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

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

时间：2021-01-21 13:11:34

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

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

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

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

系列文章链接:
自定义控件组件开发第一章待续
自定义控件组件开发第一章第二篇接着待续
自定义控件组件开发第一章第三篇
自定义控件组件开发第二章继承WebControl的自定义控件
自定义控件组件开发第三章为控件添加事件前篇
自定义控件组件开发第三章为控件添加事件后篇
自定义控件组件开发第四章组合控件开发CompositeControl
自定义控件组件开发第四章组合控件开发CompositeControl 后篇－－事件冒泡
自定义控件组件开发第五章模板控件开发
2.0自定义控件组件开发第六章深入讲解控件的属性
2.0组件控件开发视频初体验

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

大家再来看看代码:

usingSystem;

usingSystem.Collections.Generic;

usingSystem.Text;

usingSystem.Web;

usingSystem.Web.UI;

usingSystem.Web.UI.WebControls;

namespaceCreditCardForm

{

publicclassCreditCardForm1:Control

{

protectedoverridevoidRender(HtmlTextWriterwriter)

{

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

writer.Write("<tr>");

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

writer.Write("<td>");

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

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

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

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

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

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

writer.Write("<tr>");

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

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

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

writer.Write("<tr>");

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

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

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

writer.Write("<tr>");

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

writer.Write("<td>");

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

for(intmonth=1;month<13;month++)

{

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

}

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

writer.Write("&nbsp");

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

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

{

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

}

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

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

writer.Write("<tr>");

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

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

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

}

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

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

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

先来看看这张图片：

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

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

用get和set

如下：

1privatestringpaymentMethod="支付方式";

2privatestringcreditCardNo="信用卡号";

3privatestringcardholderName="持卡人";

4privatestringexpirationDate="过期时间";

5privatestringsubmitButtonText="提交";

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

8//

11publicvirtualstringPaymentMethodText

12{

13get

14{

15returnpaymentMethod;

16}

17set

18{

19paymentMethod=value;

20}

21}

23publicvirtualstringCreditCardNoText

24{

25get

26{

27returncreditCardNo;

28}

29set

30{

31creditCardNo=value;

32}

33}

35publicvirtualstringCardholderNameText

36{

37get

38{

39returncardholderName;

40}

41set

42{

43cardholderName=value;

44}

45}

47publicvirtualstringExpirationDateText

48{

49get

50{

51returnexpirationDate;

52}

53set

54{

55expirationDate=value;

56}

57}

59publicvirtualstringSubmitButtonText

60{

61get

62{

63returnsubmitButtonText;

64}

65set

66{

67submitButtonText=value;

68}

69}

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

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

1protectedoverridevoidRender(HtmlTextWriterwriter)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

27writer.Write("<selectname='Month'id='Month'>");

28for(intmonth=1;month<13;month++)

29{

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

31}

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

35writer.Write("&nbsp");

37writer.Write("<selectname='Year'id='Year'>");

38for(intyear=;year<;year++)

39{

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

41}

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

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

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

46writer.Write("<tdalign='center'colspan='2'>");

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

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

53}

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

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

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

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

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

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

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

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

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

[DefaultValue("支付方式")]

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

publicvirtualstringPaymentMethodText

{

get

{

returnpaymentMethod;

}

set

{

paymentMethod=value;

}

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

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

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

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

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

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

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

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

</cc1:CreditCardForm2>

怎样做？

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

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

如下：

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

2publicclassCreditCardForm2:Control

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

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

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

1usingSystem;

2usingSystem.Collections.Generic;

3usingSystem.Text;

4usingSystem.Web.UI;

5usingSystem.Web;

ponentModel;

7usingSystem.Web.UI.WebControls;

9namespaceCreditCardForm

10{

11[DefaultProperty("CardholderNameText")]

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

13publicclassCreditCardForm2:Control

14{

15#region属性

16privatestringpaymentMethod="支付方式";

17privatestringcreditCardNo="信用卡号";

18privatestringcardholderName="持卡人";

19privatestringexpirationDate="过期时间";

20privatestringsubmitButtonText="提交";

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

23//

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

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

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

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

30publicvirtualstringPaymentMethodText

31{

32get

33{

34returnpaymentMethod;

35}

36set

37{

38paymentMethod=value;

39}

40}

42[Browsable(true)]

43[Category("Appearance")]

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

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

46publicvirtualstringCreditCardNoText

47{

48get

49{

50returncreditCardNo;

51}

52set

53{

54creditCardNo=value;

55}

56}

58[Browsable(true)]

59[Category("Appearance")]

60[DefaultValue("持卡人")]

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

62publicvirtualstringCardholderNameText

63{

64get

65{

66returncardholderName;

67}

68set

69{

70cardholderName=value;

71}

72}

74[Browsable(true)]

75[Category("Appearance")]

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

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

78publicvirtualstringExpirationDateText

79{

80get

81{

82returnexpirationDate;

83}

84set

85{

86expirationDate=value;

87}

88}

89[Browsable(true)]

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

91[Category("Appearance")]

92[DefaultValue("提交")]

93publicvirtualstringSubmitButtonText

94{

95get

96{

97returnsubmitButtonText;

98}

99set

100{

101submitButtonText=value;

102}

103}

104#endregion

105protectedoverridevoidRender(HtmlTextWriterwriter)

106{

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

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

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

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

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

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

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

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

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

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

117

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

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

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

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

122

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

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

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

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

127

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

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

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

131writer.Write("<selectname='Month'id='Month'>");

132for(intmonth=1;month<13;month++)

133{

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

135}

136

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

138

139writer.Write("&nbsp");

140

141writer.Write("<selectname='Year'id='Year'>");

142for(intyear=;year<;year++)

143{

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

145}

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

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

148

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

150writer.Write("<tdalign='center'colspan='2'>");

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

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

153

154

155

156

157}

158

159}

160}

161

作者：小洋，燕洋天

出处：/

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。

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

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

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

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