第一章 .Net 控件开发(WebForm) 开发简单自定义控件(6) 自定义Style类
来源:互联网 发布:阿里大数据竞赛 编辑:程序博客网 时间:2024/06/06 01:34
1、在写这章之前,要补充下上章没讲完的一点,我们把控件拖到页面上看到了很多属性除了我们定义的两个属性(CellPadding和CellSpacing)外,大家可以设置下。
2、我们可以看到TableStyle只支持部分Css属性,所以我们要重新定义个样式,让它支持更多的Css.定义个新类必须继承Style或者TableStyle,我们先看下实现的效果图和生成的HTML源码。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title> </title> <style type="text/css"> #TestControl21 { border-collapse:collapse; } #TestControl21 tr td { border-color:Black; border-style:solid; border-width:1px; } </style></head><body> <form method="post" action="Default.aspx" id="form1"><div class="aspNetHidden"><input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTIyMDcwODcwNmRklsDUr4A0E/gAA0Qlh47G6fDyYmXq2UPgtXywVTJTHqA=" /></div> <div> <table id="TestControl21"><tr><td>姓名</td><td><input id="Txt_Name" type="text" name="Txt_Name" /></td></tr><tr><td colspan="2" align="center"><input id="Btn_Show" type="submit" value="显示" name="Btn_Show" /></td></tr></table> </div> </form></body></html>
5、定义TestControlStyle2类的默认构造函数以及对构造函数的重载,使用默认构造函数进行实例化的自定义Style类的用户,期望该类使用自身的ViewState集合管理页面回传的属性状态,我们在后面会讲到状态管理的时候回讲到。我们对构造函数进行重载传个StateBag集合参数给该类,并且希望利用该类使用StateBag集合来管理页面回传的属性。
public TestControlStyle2() { } public TestControlStyle2(StateBag statebag) : base(statebag) { }
6、定义个私有方法返回枚举的字符串值。
private string GetBorderCollapseName(BorderCollapse bordercollapse) { string result = "collapse"; switch (bordercollapse) { case BorderCollapse.Collapse: result = "collapse"; break; case BorderCollapse.Inherit: result = "inherit"; break; case BorderCollapse.Separate: result = "separate"; break; } return result; }
7、自定义的Style类必须为每个所支持的新的Css样式属性公开个强类型属性。每个属性都必须使用Style类的ViewState集合作为内部存储。
public BorderCollapse BorderCollapse { get { return ViewState["BorderCollapse"] != null ? (BorderCollapse)ViewState["BorderCollapse"] : BorderCollapse.Collapse; } set { ViewState["BorderCollapse"] = value; } }
8、我们在定义一个内部方法表示ViewState集合中是否存在该键,存在返回true,否则返回false。
internal bool IsSet(string key) { return ViewState[key] != null; }
9、重写IsEmpty属性,重写该属性可以有效的指示了是否设置了自定义Style类的样式属性。
public override bool IsEmpty { get { return base.IsEmpty && !IsSet("BorderCollapse"); } }
10、由于自定义的Style类的每个属性的set访问器都向ViewState集合添加了新项,所以要重写Reste方法,以便删除已经添加到集合中的属性项。
public override void Reset() { base.Reset(); if (IsEmpty) { return; } if (IsSet("BorderCollapse")) ViewState.Remove("BorderCollapse"); }
11、重写FillStyleAttributes方法,该方法将集合作为参数,以便将所支持的的Css样式属性添加到集合中。
protected override void FillStyleAttributes(CssStyleCollection attributes, IUrlResolutionService urlResolver) { base.FillStyleAttributes(attributes, urlResolver); if(IsSet("BorderCollapse")) attributes.Add("border-collapse",GetBorderCollapseName(BorderCollapse)); }
12、重写CopyForm方法,以便将参数Style对象的属性值复制给相关的样式属性。
public override void CopyFrom(Style s) { if (s == null) return; base.CopyFrom(s); TestControlStyle2 ts = s as TestControlStyle2; if (ts == null || ts.IsEmpty) return; if (IsSet("BorderCollapse")) BorderCollapse = ts.BorderCollapse; }
13、重写MergeWith方法,将参数Style对象的样式属性值分别与自身的样式属性合并。
public override void MergeWith(Style s) { if (s == null) return; if (IsEmpty) { CopyFrom(s); return; } TestControlStyle2 ts = s as TestControlStyle2; if (ts == null || ts.IsEmpty) return; if (!IsSet("BorderCollapse") && ts.IsSet("BorderCollapse")) BorderCollapse = ts.BorderCollapse; }
14、使用自定义的样式,修改TestControl2的CreateControlStyle方法。
protected override Style CreateControlStyle() { //return new TableStyle(ViewState);//控件与ControlStyle共享ViewState //return base.CreateControlStyle(); return new TestControlStyle2(ViewState);//使用自定义样式 }
15、新增TestControl2公开BorderCollapse属性。
public virtual BorderCollapse BorderCollapse { get { return ((TestControlStyle2)ControlStyle).BorderCollapse; } set { ((TestControlStyle2)ControlStyle).BorderCollapse = value; } }
16、我们把控件拖到页面上设置控件的BorderCollapse为Collapse,生成的界面就是我们刚开始的界面了,看下生成后的Html源码,已经设置属性了。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><%@ Register Assembly="WebFormControl" Namespace="WebFormControl" TagPrefix="cc1" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <style type="text/css"> #TestControl21 tr td { border-color:Black; border-style:solid; border-width:1px; } </style></head><body> <form id="form1" runat="server"> <div> <cc1:TestControl2 ID="TestControl21" runat="server" BorderCollapse="Collapse" /> </div> </form></body></html>
<table id="TestControl21" style="border-collapse:collapse;"><tr><td>姓名</td><td><input id="Txt_Name" type="text" name="Txt_Name" /></td></tr><tr><td colspan="2" align="center"><input id="Btn_Show" type="submit" value="显示" name="Btn_Show" /></td></tr></table>代码下载地址:点击下载
本博客内容有些来源于网络或书籍如果侵害到你的权益,请及时联系我(hch458458@vip.qq.com)版权归nethch所有,转载请注明出处!
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(6) 自定义Style类
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(4) Style类以及WebControl类
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(1) 自定义控件初始
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(5) 继承WebControl类
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(2) 控件属性的申明
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(7) 控件事件的引发以及优化
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(8) 页面的回传
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(9) 流程和生命周期
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(8) 页面的回传
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(3) HtmlTextWriter的相关枚举以及状态管理
- 第二章 .Net 控件开发(WebForm) 开发自定义复合控件(1) 继承ComPositeControl类以及子控件
- ASP.NET自定义控件组件开发 第一章:从一个简单的控件谈起
- 第二章 .Net 控件开发(WebForm) 开发自定义复合控件(2) 重写属性和方法
- 第二章 .Net 控件开发(WebForm) 开发自定义复合控件(3) 事件冒泡
- ASP.NET自定义控件组件开发 第一章 待续
- ASP.NET自定义控件组件开发 第一章 待续
- ASP.NET自定义控件组件开发 第一章 第三篇
- 判断一颗二叉树是不是另一棵二叉树的子结构
- 使用 Eclipse 远程调试 Java 应用程序
- jsp+weblogic连接oracle数据库的几种方法
- 手动挡起步要点,注意了
- C语言:内存字节对齐详解
- 第一章 .Net 控件开发(WebForm) 开发简单自定义控件(6) 自定义Style类
- SSH, SCP ConnectionTimeout
- 使用CStdioFile读写文件
- 在UNIX和Windows中关闭磁盘I/O缓冲
- JNI
- linux man section 节
- 一个软件,internal version 和external version, 安装有问题
- 【JavaScript高级程序设计(第2版).pdf】笔记——基础知识【一】
- [Android分享] Android ListPreference的用法