21.3 RoundedCorners锐化边角控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
来源:互联网 发布:淘宝的数字暗语大全 编辑:程序博客网 时间:2024/04/30 08:55
--------http://book.csdn.net/bookfiles/305/10030512732.shtml
21.3 RoundedCorners锐化边角控件
RoundedCorners控件专门用来锐化控件的边角,本节介绍其主要的属性和功能。
21.3.1 简介
RoundedCorners控件和DropShadow控件的锐化效果一样,缺点是没有阴影效果,优点是可以只锐化4个边角中的任意一个或多个。RoundedCorners控件的主要属性如下所示:
<ajaxToolkit:RoundedCornersExtender ID="rce" runat="server"
TargetControlID="Panel1"
Radius="6"
Corners="All" />
其中各属性的意义如下:
l TargetControlID:被锐化的控件ID。
l Radius:锐化幅度。
l Corners:要锐化的边角,All表示所有边角。
RoundedCorners控件的应用效果如图21-22所示。
图21-22 RoundedCorners控件的应用效果
21.3.2 自定义锐化效果
本例的功能是可以自定义边角锐化的幅度,也可以选择要锐化的边角。演示步骤如下:
(1)打开VS2005,新建一个AJAX Control Toolkit网站,命名为“AjaxRoundedCornersCtrl”。
(2)打开默认生成的Default.aspx,切换到设计视图。
(3)添加一个Panel,用来实现锐化效果,再添加一个RoundedCorners,用来控制锐化。然后添加2个Html Radio和4个Html CheckBox。效果如图21-23所示。
图21-23 RoundedCorners控件实例的设计视图
(4)2个Radio让用户选择其锐化的幅度,4个CheckBox让用户选择锐化的边角,这6个控件的事件定义如清单21-16所示。注意“$find”方法的使用,是AJAX类库中提供查找客户端AJAX控件专用的方法。
代码清单21-16 自定义RoundedCorners的效果事件
<input id="Radio1" type="radio" value="8"
onclick="$find('RoundedCornersBehavior1').set_Radius(this.value);"/>8
<input id="Radio2" type="radio" value="10"
onclick="$find('RoundedCornersBehavior1').set_Radius(this.value);" />10
选择某个边角
<input id="Checkbox1" type="checkbox" value="1"
onclick="$find('RoundedCornersBehavior1').setCorner(this.value, this.checked);" checked="checked" />左上角
<input id="Checkbox2" type="checkbox" value="2"
onclick="$find('RoundedCornersBehavior1').setCorner(this.value, this.checked);" checked="checked" />右上角
<input id="Checkbox3" type="checkbox" value="8"
onclick="$find('RoundedCornersBehavior1').setCorner(this.value, this.checked);" checked="checked" />左下角
<input id="Checkbox4" type="checkbox" value="4"
onclick="$find('RoundedCornersBehavior1').setCorner(this.value, this.checked);" checked="checked" />右下角
(5)设计RoundedCorners的属性如下所示。
<ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender1" runat="server"
BehaviorID="RoundedCornersBehavior1"
TargetControlID="Panel1">
</ajaxToolkit:RoundedCornersExtender>
(6)按“Ctrl+S”保存所有的设计。按F5运行程序,效果如图21-24所示。可通过选择不同的锐化幅度测试不同的运行效果。
图21-24 RoundedCorners自定义的运行效果
- 21.3 RoundedCorners锐化边角控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 21.2 DropShadow阴影控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 21.1 Animation动画控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 21.4 ToggleButton个性化按钮控件(征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 21.5 UpdatePanelAnimation局部刷新动画控件(征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 征服ASP.NET 2.0 Ajax——Web开发技术详解
- 12.1 认识RSS (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 12.4 添加RSS频道功能 (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 12.6 显示频道内容功能 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 21.6 小结(征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 征服ASP.NET 2.0 Ajax——Web开发技术详解
- 12.5 Ajax实现RSS频道的显示功能 (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 12.2 了解要开发的RSS阅读器 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 12.3 开发RSS阅读器的前期准备 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- 征服Ajax web2.0开发技术详解
- 《征服ajax Web2.0开发技术详解》光盘源码 下载
- 征服Ajax-Web2.0开发技术详解试读版
- 探讨微软ASP.NET AJAX控件开发技术
- Posix多线程编程学习笔记(一)—线程基础(1)
- P4 SCC Plugin Sucks
- 21.1 Animation动画控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- 最近在学习python
- lucene 搜索入门实例
- 21.3 RoundedCorners锐化边角控件 (征服ASP.NET 2.0 Ajax——Web开发技术详解)
- IIS配置FLV文件
- 注册CSDN了
- 21.4 ToggleButton个性化按钮控件(征服ASP.NET 2.0 Ajax——Web开发技术详解 )
- AT917S256 的SPI通信实现
- 1.1.3 GIS应用框架
- 21.5 UpdatePanelAnimation局部刷新动画控件(征服ASP.NET 2.0 Ajax——Web开发技术详解)
- JGAP使用说明
- 21.6 小结(征服ASP.NET 2.0 Ajax——Web开发技术详解 )