ASP.NET自定义控件组件开发第一章第二篇接着待续

　　很感谢大家给我的第一篇ASP.NET控件开发的支持！在写这些之前，我也看了一些例子，想选中一些好上手的例子，这样，可能一些例子大家以前都见过，但是我想说：同样是弹钢琴，同样一首“命运交响曲”，有的人弹的让人荡气回肠，有的人弹的就很一般。

受了李建忠老师的启发，发现用一种演化式的让人更好的接受。

好了，废话不说了。继续开发！希望大家支持！

系列文章链接:

ASP.NET自定义控件组件开发第一章待续

ASP.NET自定义控件组件开发第一章第二篇接着待续

ASP.NET自定义控件组件开发第一章第三篇

ASP.NET自定义控件组件开发第二章继承WebControl的自定义控件

ASP.NET自定义控件组件开发第三章为控件添加事件前篇

ASP.NET自定义控件组件开发第三章为控件添加事件后篇

ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl

ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl 后篇－－事件冒泡

ASP.NET自定义控件组件开发第五章模板控件开发

ASP.NET2.0自定义控件组件开发第六章深入讲解控件的属性

ASP.NET2.0组件控件开发视频初体验

我们之前开发了一个很简单的自定义的控件，方法很简单，只是把原来的html文本传入writer.Writer()方法的参数，然后输出。其实从模式的角度看，这可说是个Template模式（只是提下而已，有兴趣的朋友可以和我讨论)！

大家再来看看代码:

Code

using System;

using System.Collections.Generic;

using System.Text;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace CreditCardForm

{

    public class CreditCardForm1:Control 

    {

        protected override void Render(HtmlTextWriter writer)

        {

            writer.Write ("<table style='width:287px;height:128px;border-width:0'>");

            writer.Write ("<tr>");

            writer.Write ("<td>支付方式</td>");

            writer.Write ("<td>");

            writer.Write ("<select name='paymentMethod' id='paymentMethod' style='width:100%'>");

            writer.Write ("<option value='0'>Master</option>");

            writer.Write ("<option value='1'>Visa</option>");

            writer.Write ("</select>");

            writer.Write ("</td>");

            writer.Write("</tr>");

            writer.Write("<tr>");

            writer.Write("<td>信用卡号</td>");

            writer.Write("<td><input type='text' name='CreditCardNo' id='CreditCardNo'/></td>");

            writer.Write("</tr>");

            writer.Write("<tr>");

            writer.Write("<td>持卡人</td>");

            writer.Write("<td><input type='text' name='CardholderName' id='CardholderName' /></td>");

            writer.Write("</tr>");

            writer.Write("<tr>");

            writer.Write("<td>过期时间</td>");

            writer.Write("<td>");

            writer.Write("<select name='Month' id='Month'>");

            for (int month = ; month < ; month++)

            {

                writer.Write("<option value=" + month.ToString() + ">" + month.ToString() + "</option>");

            }

            writer.Write("</select>");

            writer.Write("&nbsp");

            writer.Write("<select name='Year' id='Year'>");

            for (int year = ; year< ; year ++)

            {

                writer.Write("<option value=" + year.ToString() + ">" + year.ToString() + "</option>");

            }

            writer.Write("</select>");

            writer.Write("</td></tr>");

            writer.Write("<tr>");

            writer.Write("<td align='center' colspan='2'>");

            writer.Write("<input type='submit' value='提交'/>");

            writer.Write("</td></tr>");

        }

    }

}

我们发现，这个控件实现的很僵硬！因为这个控件不像其他的服务器控件，我们这个控件没有任何让我们编辑的地方，也没有一些让我们设置的属性。下面，我们就来让控件“活”起来。给他一些可以编辑的属性。

首先我们还是从最简单来看。

相信大家都知道C#中的get ,set，我们总是把成为“属性”(Property),其实在控件开发的时候，就是用这些get, 和set来设置属性的。

先来看看这张图片：

大家都熟悉吧，就是我们之前前开发的那个控件的外观。我们在拖控件是使用的时候，一般都要设置一些属性，比如：Text,Name等等。当然，这里也不例外，我们也设置这个控件的属性，例如我们想让控件左边的文本改变，就像改变Text属性，如下：

这样的控件就更加的灵活。下面来看看这样开发这些属性吧！

用get和set

如下：

Code

 1        private string paymentMethod = "支付方式";

 2        private string creditCardNo = "信用卡号";

 3        private string cardholderName = "持卡人";

 4        private string expirationDate = "过期时间";

 5        private string submitButtonText = "提交";

 6

 7        //以便以后二次开发 所以用了virtual

 8        //

 9

         public virtual string PaymentMethodText

        {

            get

            {

                return paymentMethod;

            }

            set

            {

                paymentMethod = value;

            }

        }

         public virtual string CreditCardNoText

        {

            get

            {

                return creditCardNo;

            }

            set

            {

                creditCardNo = value;

            }

        }

        public virtual string CardholderNameText

        {

            get

            {

                return cardholderName;

            }

            set

            {

                cardholderName = value;

            }

        }

         public virtual string ExpirationDateText

        {

            get

            {

                return expirationDate;

            }

            set

            {

                expirationDate = value;

            }

        }

        public virtual string SubmitButtonText

        {

            get

            {

                return submitButtonText;

            }

            set

            {

                submitButtonText = value;

            }

        }

这样做以后，基本上就完成了我们之前的目的，可以设置控件的属性了。注意：我们这里实现的属性是可读写的。大家可以根据情况来确定是只读，还是只写！

但是我们不要忘记了，控件的显示是通过Render方法呈现在页面的，我们要使得我们的控件可以改变属性，改变呈现的方式，就要改改Render中的代码：如下：

Code

 1 protected override void Render(HtmlTextWriter writer)

 2         {

 3             writer.Write("<table style='width:287px;height:128px;border-width:0'>");

 4             writer.Write("<tr>");

 5             writer.Write("<td>"+PaymentMethodText+ "</td>");

 6             writer.Write("<td>");

 7             writer.Write("<select name='paymentMethod' id='paymentMethod' style='width:100%'>");

 8             writer.Write("<option value='0'>Master</option>");

 9             writer.Write("<option value='1'>Visa</option>");

             writer.Write("</select>");

             writer.Write("</td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+CreditCardNoText +"</td>");

             writer.Write("<td><input type='text' name='CreditCardNo' id='CreditCardNo'/></td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+CardholderNameText +"</td>");

             writer.Write("<td><input type='text' name='CardholderName' id='CardholderName' /></td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+ExpirationDateText +"</td>");

             writer.Write("<td>");

             writer.Write("<select name='Month' id='Month'>");

             for (int month = ; month < ; month++)

             {

                 writer.Write("<option value=" + month.ToString() + ">" + month.ToString() + "</option>");

             }

 

             writer.Write("</select>");

 

             writer.Write("&nbsp");

 

             writer.Write("<select name='Year' id='Year'>");

             for (int year = ; year < ; year++)

             {

                 writer.Write("<option value=" + year.ToString() + ">" + year.ToString() + "</option>");

             }

             writer.Write("</select>");

             writer.Write("</td></tr>");

 

             writer.Write("<tr>");

             writer.Write("<td align='center' colspan='2'>");

             writer.Write("<input type='submit' value='"+SubmitButtonText +"'/>");

             writer.Write("</td></tr>");

 

 

 

 

         }

这里，请大家注意代码的第5，15，20，25，和47行，我们之前在前一个控件中是直接写如字符串，这里我们改变了写法。用到了我们定义的那些get，set的属性，来改变控件显示。

好了，这写步骤完成之后，工作就差不多完成了。

我想大家应该来记得我们平时用的控件，如下：

例如上面的TextBox控件，他的属性就显示在属性窗口，而且属性都分了类，如”外观“，”行为“，而且没有属性下面都有注释。大家注意途中的标记部分。

我们上面的代码确实已经为控件添加了属性，但是我们要让我们开发的控件和现有的控件一样，看起来更加的专业，我们就要实现一些显示的代码，使得我们的控件和现有的服务器控件一样”好看，好用”。即，要有下面的效果：

这个控件看起来很专业吧！好了，我们来实现下：

其实很简单的，只要添加一些属性(Attribute）标记

Code

       [Browsable (true )]//在属性窗口中是否可见

        [Category ("Appearance")]//属性的分类，如，行为，外观，大家可以在属性窗口看见这样的分类

        [DefaultValue ("支付方式")]

        [Description ("支付方式")]//这些是显示在属性窗口底下的

        public virtual string PaymentMethodText

        {

            get

            {

                return paymentMethod;

            }

            set

            {

                paymentMethod = value;

            }

        }

大家可以根据我的注释再结合我上面的标记图可以看看。然后其他的的一些get,set属性都添加差不多，只是括号()内的文本，随你写而已！

到此为止，一个”好看“的控件就写完了。至于“好用”，暂时不急，慢慢来！

当我们把控件添加到页面后，查看他的“源”看到的这样的：

Code

 <cc1:creditcardform1 id="CreditCardForm1_1" runat="server"></cc1:creditcardform1>

我们看到其他的一些控件的“源”，例如：

Code

 <asp:TextBox ID="TextBox1" runat="server" Font-Bold="True" Font-Italic="True" Height="200px" TextMode="MultiLine"></asp:TextBox>

TextBox控件的很多的属性都显示在标记中了，我们也希望当我们的控件一拖上页面的时候就显示一些包含在标记中的属性，如下：

Code

 <cc1:CreditCardForm2 ID="CreditCardForm2_1" runat="server" PaymentMethodText="我的支付" CardholderNameText="持卡姓名" CreditCardNoText="我的卡号" ExpirationDateText="过期吗？">

        </cc1:CreditCardForm2>

怎样做？

也很简单，加些Attribute标记就行了。

这些的标记是类级别的，就是说，要用在类上，我们之前家的那些标记都用在字段上，级别不同。注意哦！

如下：

Code

 [ToolboxData("<{0}:CreditCardForm2 runat='server' PaymentMethodText='支付方式'></{0}:CreditCardForm2>")]

     public class CreditCardForm2:Control

注意：在{0}的冒号中之后的那个"CreditCardForm2“就是类的名字，不要写错，否就不行！还有runat='sever'一定要写，其他的属性你可以随意加，但是要保证，那些你的家的属性是我们定义了的。例如你还可以加

CreditCardNo='信用卡号',等等。这样之后，我们的控件就更加的专业了！

整个代码如下：大家多多提意见，如果我讲不够好就说，我尽量讲的更加平实！

Code

  1 using System;

  2 using System.Collections.Generic;

  3 using System.Text;

  4 using System.Web.UI ;

  5 using System.Web ;

  6 using System.ComponentModel;

  7 using System.Web.UI.WebControls ;

  8 

  9 namespace CreditCardForm

 10 {

 11     [DefaultProperty ("CardholderNameText")]

 12     [ToolboxData("<{0}:CreditCardForm2 runat='server' PaymentMethodText='支付方式'></{0}:CreditCardForm2>")]

 13     public class CreditCardForm2:Control

 14     {

 15         #region 属性

 16         private string paymentMethod = "支付方式";

 17         private string creditCardNo = "信用卡号";

 18         private string cardholderName = "持卡人";

 19         private string expirationDate = "过期时间";

 20         private string submitButtonText = "提交";

 21 

 22         //以便以后二次开发 所以用了virtual

 23         //

 24 

 25 

 26         [Browsable (true )]//在属性窗口中是否可见

 27         [Category ("Appearance")]//属性的分类，如，行为，外观，大家可以在属性窗口看见这样的分类

 28         [DefaultValue ("支付方式")]

 29         [Description ("支付方式")]//这些是显示在属性窗口底下的

 30         public virtual string PaymentMethodText

 31         {

 32             get

 33             {

 34                 return paymentMethod;

 35             }

 36             set

 37             {

 38                 paymentMethod = value;

 39             }

 40         }

 41 

 42         [Browsable (true)]

 43         [Category ("Appearance")]

 44         [DefaultValue ("信用卡号")]

 45         [Description ("信用卡的号码")]

 46         public virtual string CreditCardNoText

 47         {

 48             get

 49             {

 50                 return creditCardNo;

 51             }

 52             set

 53             {

 54                 creditCardNo = value;

 55             }

 56         }

 57 

 58         [Browsable (true)]

 59         [Category ("Appearance")]

 60         [DefaultValue ("持卡人")]

 61         [Description ("持卡人的名字")]

 62         public virtual string CardholderNameText

 63         {

 64             get

 65             {

 66                 return cardholderName;

 67             }

 68             set

 69             {

 70                 cardholderName = value;

 71             }

 72         }

 73 

 74         [Browsable (true)]

 75         [Category ("Appearance")]

 76         [DefaultValue ("过期时间")]

 77         [Description ("描述卡的过期时间")]

 78         public virtual string ExpirationDateText

 79         {

 80             get

 81             {

 82                 return expirationDate;

 83             }

 84             set

 85             {

 86                 expirationDate = value;

 87             }

 88         }

 89         [Browsable (true )]

 90         [Description ("按钮的文本")]

 91         [Category ("Appearance")]

 92         [DefaultValue ("提交")]

 93         public virtual string SubmitButtonText

 94         {

 95             get

 96             {

 97                 return submitButtonText;

 98             }

 99             set

             {

                 submitButtonText = value;

             }

         }

         #endregion

         protected override void Render(HtmlTextWriter writer)

         {

             writer.Write("<table style='width:287px;height:128px;border-width:0'>");

             writer.Write("<tr>");

             writer.Write("<td>"+PaymentMethodText+ "</td>");

             writer.Write("<td>");

             writer.Write("<select name='paymentMethod' id='paymentMethod' style='width:100%'>");

             writer.Write("<option value='0'>Master</option>");

             writer.Write("<option value='1'>Visa</option>");

             writer.Write("</select>");

             writer.Write("</td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+CreditCardNoText +"</td>");

             writer.Write("<td><input type='text' name='CreditCardNo' id='CreditCardNo'/></td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+CardholderNameText +"</td>");

             writer.Write("<td><input type='text' name='CardholderName' id='CardholderName' /></td>");

             writer.Write("</tr>");

 

             writer.Write("<tr>");

             writer.Write("<td>"+ExpirationDateText +"</td>");

             writer.Write("<td>");

             writer.Write("<select name='Month' id='Month'>");

             for (int month = ; month < ; month++)

             {

                 writer.Write("<option value=" + month.ToString() + ">" + month.ToString() + "</option>");

             }

 

             writer.Write("</select>");

 

             writer.Write("&nbsp");

 

             writer.Write("<select name='Year' id='Year'>");

             for (int year = ; year < ; year++)

             {

                 writer.Write("<option value=" + year.ToString() + ">" + year.ToString() + "</option>");

             }

             writer.Write("</select>");

             writer.Write("</td></tr>");

 

             writer.Write("<tr>");

             writer.Write("<td align='center' colspan='2'>");

             writer.Write("<input type='submit' value='"+SubmitButtonText +"'/>");

             writer.Write("</td></tr>");

 

 

 

 

         }

 

     }

 }

ASP.NET自定义控件组件开发第一章第二篇接着待续的更多相关文章

ASP.NET自定义控件组件开发第一章第三篇
原文:ASP.NET自定义控件组件开发第一章第三篇第三篇:第一章的完结篇系列文章链接: ASP.NET自定义控件组件开发第一章待续 ASP.NET自定义控件组件开发第一章第二篇接着待 ...
ASP.NET自定义控件组件开发第一章待续
原文:ASP.NET自定义控件组件开发第一章待续第一章:从一个简单的控件谈起系列文章链接: ASP.NET自定义控件组件开发第一章待续 ASP.NET自定义控件组件开发第一章第二篇接 ...
ASP.NET自定义控件组件开发第一章第三篇第一章的完结篇
ASP.NET自定义控件组件开发第一章第三篇第三篇:第一章的完结篇系列文章链接: ASP.NET自定义控件组件开发第一章待续 ASP.NET自定义控件组件开发第一章第二篇接着待续 ...
ASP.NET自定义控件组件开发第一章第一章：从一个简单的控件谈起
第一章:从一个简单的控件谈起系列文章链接: ASP.NET自定义控件组件开发第一章待续 ASP.NET自定义控件组件开发第一章第二篇接着待续 ASP.NET自定义控件组件开发第一章第三 ...
ASP.NET自定义控件组件开发第二章继承WebControl的自定义控件
原文:ASP.NET自定义控件组件开发第二章继承WebControl的自定义控件第二章继承于WebControl的自定义控件到现在为止,我已经写了三篇关于自定义控件开发的文章,很感谢大家的支 ...
ASP.NET自定义控件组件开发第五章模板控件开发
原文:ASP.NET自定义控件组件开发第五章模板控件开发第五章模板控件开发系列文章链接: ASP.NET自定义控件组件开发第一章待续 ASP.NET自定义控件组件开发第一章第二篇接 ...
ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl
原文:ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl 第四章组合控件开发CompositeControl 大家好,今天我们来实现一个自定义的控件,之前我们已经 ...
ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl 后篇－－事件冒泡
原文:ASP.NET自定义控件组件开发第四章组合控件开发CompositeControl 后篇 --事件冒泡 CompositeControl 后篇 --事件冒泡系列文章链接: ASP.NET ...
ASP.NET自定义控件组件开发第三章为控件添加事件前篇
原文:ASP.NET自定义控件组件开发第三章为控件添加事件前篇第三章为控件添加事件好了,我们之前以前开发一个控件.而且也添加了属性,开发也很规范,但是那个控件还差最后一点:添加事件. 系列 ...

随机推荐

DOM的event对象的属性和方法
属性/方法类型是否可读写描写叙述 altKey Boolean 读写指示是否按下alt键 bubbles Boolean 读指示事件是否冒泡 button Intrger 读写鼠标事件发生 ...
使用MYCAT作为Mysql HA的中间件（转）
记得在上一篇文章“Java集群--大型网站是怎样解决多用户高并发访问的”的结尾处本人阐述了数据库的高可用的一种方案----实现主从部署,那么今天,就让我聊聊本人关于数据库的一些所思所想吧! 下面是本人 ...
Beijing Perl Workshop - Augest 10th, 2013
Beijing Perl Workshop - Augest 10th, 2013 Beijing Perl Workshop
pan
百度云盘地址第一季http://pan.baidu.com/share/link?shareid=198342&uk=1191518428第二季http://pan.baidu.com/sha ...
Xtext什么
在Xtext官方网站是这么说的 "Building your own domain-specific languages has never been so easy. Just put y ...
javascript它【蛇系列】第一弹：简单的蛇实现
参考博客:http://blog.csdn.net/sunxing007/article/details/4187038 上面的博客是一个参考,竟第一次做.真让自己盲人摸象做不出来. 只是我在其上做了 ...
嵌入式Linux下BOA网页server的移植
**************************************************************************************************** ...
获得树形json串
public class TreeNode { private long nodeId; private String nodeName; private long fatherNod ...
ubuntu终端方向键不能用（主机名不显示）问题的解决
sudo gedit /etc/passwd 在/etc/passwd中改动该用户相应的shell:/bin/sh改为/bin/bash就可以解决该问题
使用异步HTTP提升客户端性能(HttpAsyncClient)
使用异步HTTP提升客户端性能(HttpAsyncClient) 大家都知道,应用层的网络模型有同步.异步之分. 同步,意为着线程阻塞,只有等本次请求全部都完成了,才能进行下一次请求. 异步,好处是不 ...

ASP.NET自定义控件组件开发 第一章 第二篇 接着待续

ASP.NET自定义控件组件开发 第一章 第二篇 接着待续的更多相关文章

随机推荐

热门专题

ASP.NET自定义控件组件开发第一章第二篇接着待续

ASP.NET自定义控件组件开发第一章第二篇接着待续的更多相关文章