AjaxControlToolkit中各个控件功能说明

1.Accordion控件
1.1【功能概述】
Accordion可以让你设计多个panel 并且一次只显示一个Panel .在页面上的显示效果就像是使用了多个CollapsiblePanels只不过每一次只展开其中一个CollapsiblePanel.Accordion控件内部包含了若干个AccordionPane,每一个AccordionPane的template里包括了对其Header和Content的定义。我们可以在后台代码中通过SelectedIndex属性取得当前展开的哪一个Panel,还可以控制哪一个Panel展开。
经常可以见到类似的效果,比如QQ、Msn好友分类的折叠效果。
1.2【细节】
(1)不要把Accordion放在Table中而又把 FadeTransitions 设置为True,这将引起布局混乱
(2)在AccordionPane模板中的Content中可以定义任何Web元素,表现的就像一个容器
(3) AccordionPane内容模板自动改变大小有三种AutoSize modes :None(推荐) Limit  Fill
(4)$find(‘ctl00_ContentPlaceHolder1_MyAccordion_AccordionExtender’)这里找到的是Behavior.什么是Behavior呢?在Asp.net Ajax框架中包含一组动作并完成一个功能. Accordion的一个Behavior就是淡入淡出.
找到Behavior的引用,behavior.set_FadeTransitions()  behavior.get_FadeTransitions()的方式来实现具体某一个Behavior的访问和修改.
var behavior = $find(‘ctl00_SampleContent_MyAccordion_AccordionExtender’);这种写法是不好的,我们在自动测试的页面中发现了更好的写法: var behavior=$find(“<%= MyAccordion.ClientID %>_AccordionExtender”);

2.AlwaysVisibleControl控件
1.1【功能概述】
AlwaysVisibleControl 是一个简单的扩展控件可以让一部分内容浮动在页面上,当滚动页面或者改变浏览器大小时总是可见的。它可以扩展任意一个Asp.net 控件,并可按照要求设置水平 竖直方向上的相对距离.最多的应用是在线阅读的目录和不胜其烦的浮动小广告。
1.2【细节】
(1)   避免控件闪烁,要扩展的控件要使用absolutely position
(2)   HorizontalSide=”Center” VerticalSide=”Top” 使用这个方式控制浮动的位置
(3)   Var label = ocument.getElementById(‘ctl00_SampleContent_currentTime’);这行代码我们可以使用更简单的方法: var label = $get(‘ctl00_SampleContent_currentTime’);

3.Animation控件
1.1【功能概述】
28个控件种效果最酷的!顾名思义实现动画效果。它是一个插入式,可扩展的框架可以方便的为你的页面添加动画效果。
1.2【细节】
(1)Sys.UI.DomElement.getLocation(b) 取得控件位置的函数,常用!!!
(2)动画分为两种:Animation Action 后者的强大让我很兴奋
(3)   顺序执行的动画脚本
(4)    并发执行的动画脚本
(5)【Action】 控制目标元素外观样式,属性–值的格式修改,一个元素可以应用多个StyleAction
(6)【Action】 控件是否可用使用的方式跟上面是一样的,当前控件可省略AnimationTarget
(7)【Action】 执行一段脚本的Action
(8) 【Action】 隐藏目标的控件
(9) 【Action】 设置透明度的Action
(10)【Animation】        淡入淡出
(11)【Animation】    控制目标元素的大小但是注意:If scaleFont is true, the size of the font will also scale with the element.  If center is true, then the element’s center will not move as it is scaled. It is important to note that the target must be positioned (i.e. absolutely) so that settings its top/left properties will change its location in order for center to have an effect.
(12) 【Animation】     脉搏跳动效果
(13)【Animation】   颜色渐变效果,设置起始结束颜色就可以
(14)  【Animation】 改变元素的大小Action
(15)动画效果是在用户某一个动作发生的时候触发,触发的时机包括:OnLoad  OnClick  OnMouseOver OnMouseOut OnHoverOver OnHoverOut
正式版的页面文件为动画脚本添加了注释更加清晰易懂.上面列出的是常用的一些动画效果,全部资料参见Anmation Reference。
仔细阅读Animation的页面代码,其实我们已经提前触摸到了Xaml的编程风格。Asp.net Ajax之后的下一代WEB界面是WPF/E,WPF/E现在支持的是”javascript+Xaml” 还不支持”C# + Xaml”。

4.AutoComplete控件
1.1【功能概述】
AutoComplete控件是对Asp.net文本框控件的扩展,当用户词汇前面的字母时以弹出区域的形式给出备选词。这个功能的完成依赖于特定的Web Service。

在正式版的Ajax Control Toolkit中看到自动完成扩展控件有一种感觉:它终于出现在了它应该出现的地方。之前AutoComplete控件是在CTP版本中以核心组件的形式出现的,这个功能极为明确的控件被归类到核心组件,我还是比较迷惑。正式版中它终于成为了一个扩展控件。Google的自动完成功能,新浪 网易等信箱的收件人自动完成功能是这个功能的成功应用。
1.2【细节】
(1)调用的Web Service方法签名有要求:
[WebMethod]
public string[] GetCompletionList(string prefixText, int count) { … }
(2)MinimumPrefixLength最短前缀字符数,就是说你至少要键入几个字符才会出现提示

5.Calendar控件
1.1【功能概述】
Calendar同样是对文本框的扩展,当点击文本框的时候弹出日期选择选项。现在的版本提供的功能已经和WinForm中的日期控件一样,可以通过点击日期选择,点击箭头在年月之间切换。
1.2【细节】
(1)同样是对文本框的扩展,文本框获得焦点就会出现日期选择,样式是可以自定义的
(2)虽然一定是对文本框的扩展但是我们还是可以指定弹出按钮PopupButtonID,一旦这个值设定了,文本框获得焦点也不会弹出日期选择
(3)不需要把它放在UpdatePanel中。

6.CascadingDropDown控件
1.1【功能概述】
CascadingDropDown 控件是对ASP.NET DropDownList control的扩展,实现对一个DropDownList操作时其它DropDownList发生相应的变化。这个功能的实现依赖于Web Service。
1.2.【细节】
(1)如果使用Web service 方法签名必须符合下面的形式:
[WebMethod]
public CascadingDropDownNameValue[] GetDropDownContents(
string knownCategoryValues, string category){…}

(2)在阅读代码的时候请关注:Category属性。官方说法The name of the category this DropDownList represents 打开~/App_Data/CarsService.xml你就发现这是Xml的元素标签。从这个角度我们就解决了为什么联动,即联动的本质;同时也明白了调用Service的参数约定。

7.Animation控件
1.1【功能概述】
这个控件几乎在每一个页面上都出现了。它是非常灵活的一个控件,可以扩展任何ASP.NET Panel control。在页面上轻松实现展开收缩效果。这种效果我们最熟悉的恐怕就是XP的文件任务栏了。
1.2.【细节】
(1)CollapsiblePanel 默认认为使用了 标准 CSS box model 早期的浏览器要!DOCTYPE 中设置页面为自适应方式提交数据rendered in IE’s standards-compliant mode.

(2)可以自动展开 自动收缩Autoexpand=”true” AutoCollapse=”true”但是这两个本身是互斥的不能同时为True;如果设置了这两个属性其中一个为True就不要在设置 Collapsed=”True”,这样就没有意义了。

8.ConfirmButton控件
1.1【功能概述】
这个控件是对Button和继承了Button的控件的扩展,它可以捕捉到用户点击了对话框中的“是”“否”;如果是“是”就继续执行后面的代码,反之就停止执行它默认的提交行为。
1.2.【细节】
(1) 要扩展的LinkButton Button 以及ConfirmButtonExtender都要放在updatepanel里面
如果是放在外面,点击“确定”或者“取消”之后还是会导致页面刷新!
(2)更简单的方法:
this.Button1.Attributes[“onclick”]=” confirm(‘确定要停止下载么?’);”;

9.DragPanel控件
1.1【功能概述】
DragPanel extender可以轻松的让控件 “draggability”.DragPanel 扩展的目标是任意 ASP.NET Panel .你可以设置拖动行为的细节,比如哪里是类似于标题栏一样的区域。
1.2.【细节】
(1) TargetControlID 要拖动的控件

10.DropDown控件
1.1【功能概述】
DropDown 同样是一个 ASP.NET AJAX extender 可以对任何 ASP.NET control 进行扩展实现 SharePoint-style drop-down menu效果。弹出的只不过是其它的panel或者控件而已。    在IE浏览器中下拉列表总是在最前面的,的确是影响页面效果,这个控件的出现可以解决这一问题.这随时随地的弹出窗口成为WEB 2.0网站的标志性建筑,弹出的东西也越来越丰富。
1.2.【细节】
(1)TargetControlID要在什么控件上实现扩展
(2)DropDownControlID弹出控件的ID

11.DropShadow控件
1.1【功能概述】
实现控件的阴影效果,可根据具体的属性调节阴影的半径,像素,大小。
1.2.【细节】
(1)   Width 单位:px  默认5px
(2)   Opacity  不透明度0-1.0 默认.5

12.DynamicPopulate控件
1.1【功能概述】
能实用Web Service或页面方法来动态的替换控件的内容。调用的方法返回的是一个Html的字符串,作为目标元素的子节点插入其中。
1.2.【细节】
(1)ClearContentsDuringUpdate  替换之前先清除以前的内容(默认True)
(2)PopulateTriggerControlID 触发器绑定的控件 单击时触发
(3)ContextKey传递给Web Service的随机字符串
(4) Web Service方法签名必须符合下面的形式:
[WebMethod]
string DynamicPopulateMethod(string contextKey)
{…}
Note you can replace “DynamicPopulateMethod” with a naming of your choice, but the return
type and parameter name and type must exactly match, including case.

(5) 我们非常欣慰的一点就是BehaviorID=”dp1″,这种用法是我所期望的。

13.FilteredTextBox控件
1.1【功能概述】
FilteredTextBox扩展控件用来阻止用户在文本框输入无效字符 。由于这种效果的实现是依赖于javascript 验证,所以不要期望数据会发送到服务器端进行校验。
1.2.【细节】
(1)过滤条件Numbers LowercaseLetters UppercaseLetters   Custom
(2)过滤条件也可以是Custom的组合 FilterType=”Custom, Numbers”
(3)ValidChars=”+-=/*().” Custom要定义这样的有效字符串

14.HoverMenu控件
1.1【功能概述】
HoverMenu控件可以扩展任何 ASP.NET WebControl, 同时将把附加的显示内容关联到该控件上,当用户移动鼠标到该控件的时候附加的内容将显示出来。
1.2.【细节】
(1) PopupControlID要弹出来什么
(2)PopupPostion 在哪里弹出来Left (Default), Right, Top, Bottom, Center.
(3)OffsetX/OffsetY 弹出项与源控件的距离
(4) PopDelay 弹出延时显示 单位milliseconds. Default is 100.

15.ListSearch控件
1.1【功能概述】
使用该控件可以在listbox和dropdownlist中,通过输入的方式找出匹配的项。

16.MaskedEdit控件
1.1【功能概述】
MaskedEdit 控件是对TextBox control的扩展.用户输入会在客户端进行验证,可用性不高。

17.ModalPopup控件
1.1【功能概述】
ModalPopup 扩展控件允许在页面上模式弹出内容并阻止用户和页面上其他区域的交互。模式弹出区域的样式都是可以自定义的。 用户可以在模式弹出框选择OK/Cancel,对用户选择的处理方式有两种:使用客户端脚本或者PostBack到服务器端。这样我们就得到了用户的选择结果!。
1.2.【细节】
(1)  这个控件是提供了一个模式弹出对话框的模板。

18.MutuallyExclusiveCheckBox控件
1.1【功能概述】
MutuallyExclusiveCheckBox 是一个可以使得 CheckBox 具有类似 RadioButton 一样,在一系列的选项中只能选择一个的功能。但是和 RadioButton 不同,MutuallyExclusiveCheckBox 除了在一系列选项中选择一个的功能外,MutuallyExclusiveCheckBox 还可以呈现“不选任何一个”的状态。
1.2.【细节】
ID=”MustHaveGuestBedroomCheckBoxEx”
TargetControlID=”MustHaveGuestBedroomCheckBox”
Key=”GuestBedroomCheckBoxes” />
o  TargetControlID – 被 MutuallyExclusiveCheckBox 所控制的 CheckBox 控件 ID
o  Key – 用作标示为“同一组”的只可选其一的标识

19.NoBot
2.1【功能概述】
提供了简单的Captcha 图灵测试 用来屏蔽bot/spam 垃圾信息。是一个反垃圾信息控件。我查了一下资料,我的理解是:比如你点击一个按钮需要一秒钟的时间,而这一秒钟的时间你不可能再做其他的操作比如再点一次;这样区分出了人和机器。避免机器人自动点击 注册 暴力破解之类的事情
2.2.【应用场景】
网 络上的垃圾信息似乎无处不在,从前是垃圾邮件、广告等。而现在,这些无孔不入的垃圾信息发布者又盯上了互联网上的各大网站。各种机器人程序(Bot)应运 而生,它们可以自动在网络上爬行并寻找带有评论或留言功能的页面,随即自动填写表单并提交,其提交垃圾信息的数量和质量更是让传统的手工发布者自愧不如。管理者往往一夜之间发现自己的网站下已经多了成千上万条广告,不但让真正有用的信息淹没于其中,更是让网站在性能上不堪重负。

由此,很 多解决方法同样应运而生,其中最著名的当属各种验证图片了。这种验证图片中的文字由计算机随机生成,并尽其所能地对其进行扭曲、变形、修饰、模糊,最终要达到的目的是只有聪明的人类才能够分析出其中的内容(如图10-1所示),而当前水平的计算机却只能够望“图”兴叹。然后将用户对这幅图片的识别文本随表 单一起发送至服务器。这样,服务器即可通过检查客户端输入的识别文字的正确与否来判断这是否是人类所为,也就达到了区分机器人程序和人类的目的。

20.NumericUpDown
3.1【功能概述】
实现Winform里面的Updown控件,可以自定义最大值最小值增减步长,同时还可以使用值列表或者调用Web Service来决定下一个值是什么。上下按钮的图片同样是可以自定义的。
3.2.【细节】
(1)普通整数增减
(2)值列表循环显示比如下面的第二个例子RefValues
(3)调用Web Service的格式:
TargetControlID=”TextBox1″
Width=”100″
RefValues=”January;February;March;April”
TargetButtonDownID=”Button1″
TargetButtonUpID=”Button2″
ServiceDownPath=”WebService1.asmx”
ServiceDownMethod=”PrevValue”
ServiceUpPath=”WebService1.asmx”
ServiceUpMethod=”NextValue”
Tag=”1″ />
(4)上下按钮如果不需美化就这样使用:TargetButtonDownID=” ” TargetButtonUpID=” ”

21.PagingBulletedList
4.1【功能概述】
PagingBulletedList 扩展BulletedList的分页功能并实现客户端的排序分页。这里提供的分页是相当灵活的有各种分页方法供选择。
4.2.【细节】
(1)可以控制每页最多显示多少条,是否排序
(2)IndexSize表示index headings 的字符数,如果MaxItemPerPage设置了概属性被忽略
(3)MaxItemPerPage分页每页最大条数

22.PasswordStrength
5.1【功能概述】
验证密码强度,微软Live注册的时候就是用的这个效果。
5.2.【细节】
StrengthIndicatorType两种显示方式:文字提示,进度条提示。

23.PopupControl
6.1【功能概述】
PopupControl任何控件上都可以弹出任何内容,跟HoverMenu功能类似。Popup 窗口一般是放在ASP.NET AJAX UpdatePanel中, 因此它能够完成服务器端的处理之后更能新数据
显示. Popup Window 可以包含任何内容包括 ASP.NET server controls, HTML elements, etc.
6.2.【细节】
(1)TargetControlID – The ID of the control to attach to
(2)PopupControlID – The ID of the control to display
(3)CommitProperty -属性来标识返回的值
(4) CommitScript -把返回结果值通过脚本处理,用到CommitProperty

24.Rating
7.1【功能概述】
使用星级表示等级,鼠标操作;
7.2.【细节】
鼠标移动等级也会变,鼠标移动划过效果,改变星级等级

25.ReorderList
9.1【功能概述】
ReorderList是一个全新的控件。它可以实现逐条列出数据并实现交互。用户简单的拖拽就可以改变数据的排列顺序并更新到数据源。在本控件中如果SortOrderField 属性设置之后排序将自动完成。可以实现WINFORM中数据的鼠标拖拽效果。
9.2.【细节】
(1)绑定数据,拖动数据之后数据将被更新到绑定源
(2)它不是已有控件的扩展是全新的服务器端控件,只是它对Ajax行为是敏感的
(3)重排的实现有两种方式:CallBack PostBack 前者的发生在页面上是没有PostBack的(也就是没有刷新页面)
(4) 而数据添加或者编辑的时候就必须要使用PostBack来同步服务器端的数据状态  (5)PostbackOnReorder就是针对两种策略进行选择

26.ResizableControl
10.1【功能概述】
就像设计状态一样可以拖动修改大小,可以拖动放大或者缩小
10.2.【细节】

27.RoundedCorners
11.1【功能概述】
控件圆角 纯粹是控制外观的了,可以通过选项来控制圆角属性和边框
11.2.【细节】
(1)还有一个非常非常细节的地方:你必须要设置 CssClass=”roundedPanel”要不然不起作用
(2) Radius设置弧度,默认是5
(3)只适用于容器 WebControl

28.Slider
12.1【功能概述】
实现WinForm中的Slider控件效果,新浪论坛用来分页了,还有的用来调整“时间———-|—-热度”。
12.2.【细节】
(1)   修改文本框的值也可以影响Slider的状态

29.SlideShow
13.1【功能概述】
实现图片自动播放器的功能,还可以手动选择播放图片
132.【细节】

30.Tabs
14.1【功能概述】
实现Tabs卡片模块的功能
14.2.【细节】

31.TextBoxWatermark
15.1【功能概述】
对文本框进行扩展,文本水印效果。在文本框中有提示的效果。当鼠标点进入时提示自动消失。
15.2.【细节】

32.ToggleButton
16.1【功能概述】
就是把一个CheckBox的逻辑应用到一个按钮上,于是就有了双态按钮。
实际上示例页面并没有突出这个控件功能上的优势,对这个控件的操作引起页面上数据的更新,这才是CheckBox控件封装成Button的最终原因。可以双击图标可以更新页面上的状态
16.2.【细节】

33.UpdatePanelAnimation
17.1【功能概述】
更新动画效果,当当网在查询商品时有一个更新的过程,其中其更新商品的过程累世效果二
17.2.【细节】

34.ValidatorCallout
18.1【功能概述】
对于表单或者登陆的用户名密码可以起到很好的提示,在界面上是个友好的提示,也可以做验证的功能,控件本身可以使用正则表达试来对输入的判断。
18.2.【细节】

打赏

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注