导读:
将ASP.NET用户控件转化为自定义控件
作者:Kevin Cheng (程建和)
最后修改时间:2006-03-14
概述:如何将ASP.NET用户控件移植为ASP.NET自定义控件
关键字:Asp.net, 用户控件, 自定义控件
本文适用读者:
- 熟悉aspnet,能创建ascx用户控件
- 想创建自定义控件,而又为其庞杂的实现方法而惧的读者
相关下载:
- 本文使用的ascx控件例程:WebFtp060308(pm06).rar
- 本文使用的自定义控件例程:WebFtpControl 1.0.2259_source.rar
术语声明:
Field 类成员变量
Property 类属性
Attribute 类特性
NameSpace 命名空间
Assembly 程序集
引言:
asp.net自定义控件使用起来相当方便,但相对ascx用户控件而言,由于其没有可视化编程支持,编写时相当困难。
有没有简单的办法呢?既可以使用ascx可视化编程的优点,又可以发挥自定义控件使用方便的特点。
本文介绍一种解决方案:先设计好ascx控件,再转化为用户控件。 以下为具体步骤。
一、创建ascx控件,并调试通过
具体怎么创建ascx用户控件不是本文的重点,跳过啦~
本文使用到的ascx例程可点击此处下载。该例程创建了一个web文件管理的ascx控件。效果如:
二、将ascx移植为自定义控件
(一)新建工程aspnet自定义控件工程,将原ascx类中的所有cs代码都拷贝到自定义控件类中去
(二)修改InitializeComponent()函数以初始化控件。可将其扩充为三个小函数,如:
private void InitializeComponent()
{
CreateComponent();
SetComponentProperty();
SetComponentEvent();
}
其中
(1)CreateComponent()函数用于新建出所有使用到的控件,并组织好其层次关系
private void CreateComponent()
{
// create
lblCurrPath = new Label();
lblUpload = new Label();
lblNewFolder = new Label();
// nest
Controls.Add(this.lblCurrPath);
Controls.Add(new HtmlGenericControl("br"));
this.panAdmin.Controls.Add(this.file);
}
(2)SetComponentProperty()函数用于设置这些控件的属性,如
private void SetComponentProperty()
{
lblCurrPath.Font.Size = FontUnit.XLarge;
lblCurrPath.CssClass = "webftp_title";
panInfo.BackColor = Color.Yellow;
panInfo.Visible = false;
}
值得注意的是,aspnet提供的组合绑定控件(如DataGrid, DataList..)的属性设置较为复杂,参见附录二
(3)SetComponentEvent()函数中设置控件的事件句柄,这个从原有的InitializeComponent函数中拷贝过来就可,如
private void SetComponentEvent()
{
this.btnUpload.Click += new System.EventHandler(this.btnUpload_Click);
this.btnNewFolder.Click += new System.EventHandler(this.btnNewFolder_Click);
this.dg.ItemCommand += new System.Web.UI.WebControls.DataGridCommandEventHandler(this.dg_ItemCommand);
this.Load += new System.EventHandler(this.Page_Load);
}
(三)填充Render()函数用以渲染输出效果。可将其扩展为两个小函数,如
protected override void Render(HtmlTextWriter output)
{
RenderClientScript(output);
RenderServerComponent(output);
}
其中
(1)RenderClientScript函数可用于输出客户端脚本,以及样式style代码,如:
private void RenderClientScript(HtmlTextWriter output)
{
output.Write(" ", "A { TEXT-DECORATION: none }", "A:hover { TEXT-DECORATION: underline }");
}
(2)RenderServerComponent函数用于输出各控件,也可在此添加一些普通html代码的输出,如
private void RenderServerComponent(HtmlTextWriter output)
{
this.lblCurrPath.RenderControl(output);
output.Write("
");
this.panAdmin.RenderControl(output);
this.dg.RenderControl(output);
}
(四)让类实现INamingContainer接口,以避免页面上放置多个该控件而导致子控件id冲突的情况
该接口无任何函数,只需声明实现就可,如
public class WebFtp : System.Web.UI.WebControls.WebControl, INamingContainer
只要让类实现该接口,系统将自动实现避免id冲突的方法
具体步骤是将内部控件id名前都附上父控件的id。如在panel(id=pan)中有一个lable(id=lblName),那么label的id会给自动改为pan_lblName;
至此,编译调试成功后,该控件就可以使用了。再加上图片,效果可以是这样:
三、商业标准化自定义控件
第二步完成后,该控件已经可以使用了(如何使用?晕,请看附录五),但其还是一个粗胚,例如没有控件图标,没有设计时外观等。
以下将介绍如何修饰该控件,令其像个标准化的商业控件。
(1)为控件的属性添加例如类别、描述、默认值等Attribute特性
这些特性将影响到控件在属性工具栏中的内容
格式如:[Bindable(true), Category("类别"), Description("描述信息"), DefaultValue("缺省字符串类型值")]
常用的Attribute有:
CategoryAttribute 属性类别
BrowsableAttribute 属性可否显示
DefaultPropertyAttribute 控件的缺省属性
DefaultValueAttribute 属性的缺省值
DescriptionAttribute 属性的描述信息
ReadOnlyAttribute 属性是否只读
BindableAttribute 属性是否可绑定
NotifyParentPropertyAttribute 修改该属性后是否通知控件
更多的Attribute 请查阅附录三、附录四、以及 System.ComponentModel 命名空间
(2)添加工具栏图标
为类添加特性:[ToolboxBitmap(typeof(WebFtp), "Kingsoc.Web.Controls.WebFtp.bmp")]
其中要注意的是:
- 项目的默认命名空间为Kingsoc.Web.Controls
- 图片名称为webftp.bmp,并需要设置其编译选项为“嵌入的资源”
这样工具栏上图标就变成这样咯~:
(3)添加设计时外观支持
为类添加特性:[Designer(typeof(Kingsoc.Web.Controls.WebFtpDesigner))]
其中,类 Kingsoc.Web.Controls.WebFtpDesigner 继承至ControlDesigner,用于绘制设计时的控件外观,如:
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.ComponentModel.Design;
using System.Web.UI.Design;
using System.Text;
namespace Kingsoc.Web.Controls
{
public class WebFtpDesigner : ControlDesigner
{
public override string GetDesignTimeHtml()
{
//return base.GetDesignTimeHtml ();
WebControl ctrl = (WebControl)this.Component;
StringBuilder sb = new StringBuilder();
sb.AppendFormat(
"
将ASP.NET用户控件转化为自定义控件
作者:Kevin Cheng (程建和)
最后修改时间:2006-03-14
概述:如何将ASP.NET用户控件移植为ASP.NET自定义控件
关键字:Asp.net, 用户控件, 自定义控件
本文适用读者:
- 熟悉aspnet,能创建ascx用户控件
- 想创建自定义控件,而又为其庞杂的实现方法而惧的读者
相关下载:
- 本文使用的ascx控件例程:WebFtp060308(pm06).rar
- 本文使用的自定义控件例程:WebFtpControl 1.0.2259_source.rar
术语声明:
Field 类成员变量
Property 类属性
Attribute 类特性
NameSpace 命名空间
Assembly 程序集
引言:
asp.net自定义控件使用起来相当方便,但相对ascx用户控件而言,由于其没有可视化编程支持,编写时相当困难。
有没有简单的办法呢?既可以使用ascx可视化编程的优点,又可以发挥自定义控件使用方便的特点。
本文介绍一种解决方案:先设计好ascx控件,再转化为用户控件。 以下为具体步骤。
一、创建ascx控件,并调试通过
具体怎么创建ascx用户控件不是本文的重点,跳过啦~
本文使用到的ascx例程可点击此处下载。该例程创建了一个web文件管理的ascx控件。效果如:

二、将ascx移植为自定义控件
(一)新建工程aspnet自定义控件工程,将原ascx类中的所有cs代码都拷贝到自定义控件类中去
(二)修改InitializeComponent()函数以初始化控件。可将其扩充为三个小函数,如:
private void InitializeComponent()
{
CreateComponent();
SetComponentProperty();
SetComponentEvent();
}
其中
(1)CreateComponent()函数用于新建出所有使用到的控件,并组织好其层次关系
private void CreateComponent()
{
// create
lblCurrPath = new Label();
lblUpload = new Label();
lblNewFolder = new Label();
// nest
Controls.Add(this.lblCurrPath);
Controls.Add(new HtmlGenericControl("br"));
this.panAdmin.Controls.Add(this.file);
}
(2)SetComponentProperty()函数用于设置这些控件的属性,如
private void SetComponentProperty()
{
lblCurrPath.Font.Size = FontUnit.XLarge;
lblCurrPath.CssClass = "webftp_title";
panInfo.BackColor = Color.Yellow;
panInfo.Visible = false;
}
值得注意的是,aspnet提供的组合绑定控件(如DataGrid, DataList..)的属性设置较为复杂,参见附录二
(3)SetComponentEvent()函数中设置控件的事件句柄,这个从原有的InitializeComponent函数中拷贝过来就可,如
private void SetComponentEvent()
{
this.btnUpload.Click += new System.EventHandler(this.btnUpload_Click);
this.btnNewFolder.Click += new System.EventHandler(this.btnNewFolder_Click);
this.dg.ItemCommand += new System.Web.UI.WebControls.DataGridCommandEventHandler(this.dg_ItemCommand);
this.Load += new System.EventHandler(this.Page_Load);
}
(三)填充Render()函数用以渲染输出效果。可将其扩展为两个小函数,如
protected override void Render(HtmlTextWriter output)
{
RenderClientScript(output);
RenderServerComponent(output);
}
其中
(1)RenderClientScript函数可用于输出客户端脚本,以及样式style代码,如:
private void RenderClientScript(HtmlTextWriter output)
{
output.Write(" ", "A { TEXT-DECORATION: none }", "A:hover { TEXT-DECORATION: underline }");
}
(2)RenderServerComponent函数用于输出各控件,也可在此添加一些普通html代码的输出,如
private void RenderServerComponent(HtmlTextWriter output)
{
this.lblCurrPath.RenderControl(output);
output.Write("
");
this.panAdmin.RenderControl(output);
this.dg.RenderControl(output);
}
(四)让类实现INamingContainer接口,以避免页面上放置多个该控件而导致子控件id冲突的情况
该接口无任何函数,只需声明实现就可,如
public class WebFtp : System.Web.UI.WebControls.WebControl, INamingContainer
只要让类实现该接口,系统将自动实现避免id冲突的方法
具体步骤是将内部控件id名前都附上父控件的id。如在panel(id=pan)中有一个lable(id=lblName),那么label的id会给自动改为pan_lblName;
至此,编译调试成功后,该控件就可以使用了。再加上图片,效果可以是这样:
三、商业标准化自定义控件
第二步完成后,该控件已经可以使用了(如何使用?晕,请看附录五),但其还是一个粗胚,例如没有控件图标,没有设计时外观等。
以下将介绍如何修饰该控件,令其像个标准化的商业控件。
(1)为控件的属性添加例如类别、描述、默认值等Attribute特性
这些特性将影响到控件在属性工具栏中的内容
格式如:[Bindable(true), Category("类别"), Description("描述信息"), DefaultValue("缺省字符串类型值")]
常用的Attribute有:
CategoryAttribute 属性类别
BrowsableAttribute 属性可否显示
DefaultPropertyAttribute 控件的缺省属性
DefaultValueAttribute 属性的缺省值
DescriptionAttribute 属性的描述信息
ReadOnlyAttribute 属性是否只读
BindableAttribute 属性是否可绑定
NotifyParentPropertyAttribute 修改该属性后是否通知控件
更多的Attribute 请查阅附录三、附录四、以及 System.ComponentModel 命名空间
(2)添加工具栏图标
为类添加特性:[ToolboxBitmap(typeof(WebFtp), "Kingsoc.Web.Controls.WebFtp.bmp")]
其中要注意的是:
- 项目的默认命名空间为Kingsoc.Web.Controls
- 图片名称为webftp.bmp,并需要设置其编译选项为“嵌入的资源”
这样工具栏上图标就变成这样咯~:
(3)添加设计时外观支持
为类添加特性:[Designer(typeof(Kingsoc.Web.Controls.WebFtpDesigner))]
其中,类 Kingsoc.Web.Controls.WebFtpDesigner 继承至ControlDesigner,用于绘制设计时的控件外观,如:
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
using System.ComponentModel.Design;
using System.Web.UI.Design;
using System.Text;
namespace Kingsoc.Web.Controls
{
public class WebFtpDesigner : ControlDesigner
{
public override string GetDesignTimeHtml()
{
//return base.GetDesignTimeHtml ();
WebControl ctrl = (WebControl)this.Component;
StringBuilder sb = new StringBuilder();
sb.AppendFormat(
"