也算是自己刚毕业时候的作品吧,当时在一家创业公司工作,考虑给公司建立一个公司的控件库,于是也学习过一段时间的控件设计,当时领我入门的是《道不远人》那本控件开发书,觉得谭振宁写的还是相当不错的,推荐一下:)。那么就开始分享我设计的一些控件,并且告诉一些基本的设计思路。

具体实现了这些控件:

CheckTextBox: 可以对于输入TextBox的字符做出判断

HighSlideHyperLink: 点击HyperLink可以弹出相关Div层或者Img图象

ContextMenu: 上下文菜单特效

Menu: 菜单特效

EnablePageDataList: 具有分页功能的DataList

EnablePageRepeater: 具有分页功能的Repeater

GroupDropDownList: 具有分组选项功能的DropDownList

GroupListBox: 具有分组选项功能的ListBox

SearchCloud:Tag云图,可以根据关键词的搜索数量,进行排列

 1. CheckTextBox

效果图:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_ASP.NET

 

该控件继承自TextBox控件:

 

其中DefaultProperty将Text作为默认属性,代表着在属性窗口中自动被选中的是Text属性;ToolboxData代表你从工具箱拖动控件到设计页面时,会自动在代码中产生该字符串的代码。

 

控件的属性代码:

Description属性将在设计窗口属性中显示出描述:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_ASP.NET_02

通过AddAttributesToRender方法实现脚本的注册:

其中InputType包括几种方式以及一些事件发生的脚本:

 

调用服务器控件页面代码:

 

 

 

 

 

 

 

 

2. HighSlideHyperLink

效果图:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_自定义_03

看到类的头部:

1 [assembly: WebResource("Conovosoft.Web.UI.WebControls.highslide.css","text/css")]
2 [assembly: WebResource("Conovosoft.Web.UI.WebControls.highslide.js","text/javascript")]
3 [assembly: WebResource("Conovosoft.Web.UI.WebControls.highslide-html.js""text/javascript")]

这里控件需要引用一些JS以及CSS的资源文件,highslide作为第三方的JS脚本,为了实现图片放大的效果。

在OnPreRender方法中注册脚本文件:

 

 

调用代码:

 

<cc1:HighSlideHyperLink NavigateUrl="p_w_picpaths/full.jpg" CssClass="highslide" ControlType="img" 
ID="HighSlideHyperLink2" runat="server"> 
<img border="0" src="p_w_picpaths/thumb.jpg" /> 
</cc1:HighSlideHyperLink>

 

 

3. EnablePageRepeater

效果图:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_休闲_04

 

 
控件代码:

 

实现了带分页的Repeater控件。同理,也可以实现带分页的DataList。

 

4. GroupDropDownList

效果图:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_ASP.NET_05分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_休闲_06

控件代码:

注意到RenderContents方法调用了OptionAndGroupRenderContents,通过该方法的逻辑实现Option以及OptionGroup的呈现。

调用代码:

<cc1:GroupDropDownList ID="GroupDropDownList1" runat="server"> 
</cc1:GroupDropDownList> 

后台绑定数据代码:

同样GroupListBox实现代码和GroupDropDownList.cs类似。

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_自定义_07

 

5. SearchCloud标签云

效果图:

分享一些曾经设计的ASP.NET自定义服务端控件(附源程序下载)_休闲_08

控件代码:

调用代码:

<cc1:SearchCloud ID="SearchCloud1" runat="server" />

后台绑定数据代码:

这样就实现了类似博客系统中的标签云。

 

最后附上我的源代码:WebControl.UI.rar,希望能够给大家带来些ASP.NET服务器控件开发上的帮助!