asp.net控件开发（一）-显示控件内容
控件的显示自然会离不开输出HTML CSS Javascript等前台的显示内容 所以开发一个控件的时候第一件事就是要知道如何输出客户端要显示的内容
一 选择基类
中所有的标准控件都可以拿过来作为基类 如果我们要开发的控件只是对原有的标准控件做一些功能上的加强的话（如 你对TreeView的CheckBox添加一些随动的功能） 就可以直接拿标准控件过来作为基类
一般的如果开发的控件从标准里面找不到合适的 可以从三个类中来继承
System Web UI ControlSystem Web UI WebControls WebControlSystem Web UI WebControls CompositeControl
下面介绍下这三个类的关系跟区别
Control 只提供简单的呈现 没有对css的支持 如 Literal控件WebControl 建立了对控件外观的支持 适合可视化的控件来继承 如 ButtonCompositeControl 是派生多个控件复合的 适合开发应用中的标准控件
三者的关系 Control是所有控件的基类 WebControl是从Control中继承而来 CompositeControl是从WebControl中继承而来
二 如何呈现
Control的呈现
Control类中的呈现是通过方法Render来实现的 Render的原型
protected internal virtual void Render(HtmlTextWriter writer){ }
HtmlTextWriter writer 参数是在运行时有调用Render方法的框架所提供 所以我们可以同过重写Render方法来实现内容的呈现
HelloWorld示例
public class HelloWorld : Control{protected override void Render(HtmlTextWriter writer){writer WriteLine( Henllo World ); }}编译之后 在新的项目中添加对dll文件的使用 会呈现出 Hello World
Control输出内容
在Render方法中我们要实现输出标签跟样式可以借助于 HtmlTextWriterTag HtmlTextWriterAttribute HtmlTextWriterStyle这三个枚举来实现 HtmlTextWriterTag是表示Html标签 HtmlTextWriterAttribute是表示标签上的属性 HtmlTextWriterStyle是表示样式
Picture示例
public class PicShow : Control { protected override void Render(HtmlTextWriter writer) { writer AddStyleAttribute(HtmlTextWriterStyle TextAlign center ); writer AddStyleAttribute(HtmlTextWriterStyle Height px ); writer AddStyleAttribute(HtmlTextWriterStyle Width px ); writer RenderBeginTag(HtmlTextWriterTag Div); //Create Img Tag writer AddAttribute(HtmlTextWriterAttribute Src 你的图片地址 ); writer AddStyleAttribute(HtmlTextWriterStyle Width px ); writer AddStyleAttribute(HtmlTextWriterStyle Height px ); writer RenderBeginTag(HtmlTextWriterTag Img); writer RenderEndTag(); //End Of Div writer RenderEndTag(); } }
当你指定好上面的图片地址后 就可以显示出指定的图片 同过查看源文件我们可以发现客户端生成的源代码就是我们所要创建的内容
WebControl的呈现
WebControl的呈现分为三步 呈现开始标签 呈现标签中的内容 呈现结束标签 分别实现的方法为 RenderBeginTag RenderContents RenderEndTag RenderBeginTag所生成的标签是有WebControl TagKey或则WebControl TagName属性来决定的 WebControl TagKey的默认呈现标签为 所以如果我们要改变刚开始的呈现标签可以通过重写WebControl TagKey或则WebControl TagName来实现
注意的就是通常我们要对外围的标签进行控制时我们不会去重写RenderBeginTag方法 而是去重写TagKey属性 另外如果我们重写了RenderBeginTag方法就一定要去重写RenderEndTag方法
另外WebControl提供了AddAttributeToRender方法来添加控件的属性 需要注意的一点你重写AddAttributeToRender方法添加属性时 也要去调用base AddAttributeToRender方法
我们用WebControl来实现上面的PicShow控件
public class PictureWeb : WebControl { protected override HtmlTextWriterTag TagKey { get { return HtmlTextWriterTag Div; } } protected override void AddAttributesToRender(HtmlTextWriter writer) { base AddAttributesToRender(writer); writer AddStyleAttribute(HtmlTextWriterStyle TextAlign center ); writer AddStyleAttribute(HtmlTextWriterStyle Width px ); writer AddStyleAttribute(HtmlTextWriterStyle Height px ); } protected override void RenderContents(HtmlTextWriter writer) { writer AddAttribute(HtmlTextWriterAttribute Src 你的图片地址 ); writer AddStyleAttribute(HtmlTextWriterStyle Width px ); writer AddStyleAttribute(HtmlTextWriterStyle Height px ); writer RenderBeginTag(HtmlTextWriterTag Img); writer RenderEndTag(); } }
在上面的代码中我们首先要创建div标签 所以修改TagKey属性 为了给外层的div添加属性所以重写了AddAttributesToRender方法 最后在呈现的Img在RenderContents方法中实现 创建外层的< DIV >跟结束的< /DIV >我们交给了RenderBeginTag跟RenderEndTag去实现而无需重写
CompositeControl的呈现
lishixinzhi/Article/program/net/201311/11674
