ASP.NET自定義控件組件開發 第二章 繼承WebControl的自定義控件

                                       

                第二章 繼承於WebControl的自定義控件

               

     到現在爲止,我已經寫了三篇關於自定義控件開發的文章,很感謝大家的支持!不知道大家對我講的方式有什麼好的建議,我儘量使自定義控件的技術讓更多的程序員同胞接受。好了,開發開始了!

     

     本章還是延續上章的例子,開發一個CreditCardForm控件。

     

     其實本章也不難,相信大家看完後,也覺得很簡單!

     

     我們首先開談談繼承Control和WebControl的區別:其實二者最大的區別就是在,如果我們開發的控件繼承WebControl,那麼我們的控件就支持更多的CSS樣式。而繼承於Control的自定義控件的樣式相對就少些。

 

     其實還有一個區別就在開發的規範上。我們來簡單的看看上一章的自定義控件的代碼,主要來看看Render方法中的代碼:大家只掃一眼就可以了。

     

Code

     

     相信這段代碼大家都和熟悉。在這段代碼的作用主要顯示了一個table 以及table 之中的標記元素。

     

     如果一這個控件已經寫好了,加入我們想要改改table的樣式,如把border設爲1,或者改變顯示的顏色等,那麼我們就

 

要再次打開這段代碼,修改代碼。其實這就不好。爲什麼?

     

     其實這個方法中的代碼做了四件事:

          1.顯示控件最外層的包含標記,即table

          2.顯示最外層標記的一些屬性,如border.id等

          3.顯示控件的主要內容 ,如,顯示輸入框,下拉框,按鈕。

          4.顯示控件最外層包含標記的結束標記。

 

     這樣看來,這個方法的職責就有四個。大家應該還記得面向對象設計的原創:單一職責。雖然這個元素一般用在類上,

 

但是我們更加要注意,這個原則用的宗旨:使對象只有一個變化的因素。這個原則也用在方法的設計上。

     

     就是說,我們如果想要改變最外層標記table一些屬性,我們就影響了其他三個職責。同理,我們想改變其他的元素或者

 

內容,結果可想而知。

     

     爲此,繼承WebControl的控件就更加的規範和靈活:

     其實,繼承於WebControl的控件的顯示還是在Render方法中顯示,只是這個Render方法已經不由我們來寫了:

     如下:

          

Code

 

     因爲我們之前說,Render方法的職責有四個。所以WebControl的Render方法就把這些職責分離了。以後我們能就

 

可以獨立的改變一個因素了。大家也許奇怪:不是說有四個職責嗎,但是上面只是顯示了三個方法,其實在

 

RenderBeginTag()方法中包含顯示最外層標記樣式的方法。

 

     所以我們只要分別重寫這三個方法,一個繼承WebControl的自定義的控件就成了。不要怕,方法很多,但是很簡單,而

 

且代碼我們都懂,之前差不多都講了的。
   

     我想把寫成後的控件給大家看看,讓大家看下我們本章的目標:

     

     

 

          大家看見沒有:是不是支持的樣式多了!!!

     

          好了,我們來寫吧:不難哦:)

 

          首先看看我們要的寫方法以及他們的功能:

 

Code

 

     現在的思路很清晰吧,首先來顯示<table....>

     

     很簡單,只要如下就可以了。

     

Code

 

          不要奇怪,因爲RenderBeginTag()方法內部實際是調用了這個屬性來顯示的最外層的包含標記的。

          好了,第一步就寫完了啊!簡答吧!

 

         下面來顯示table的樣式,因爲我們的控件的最外層的標記是table,顯示他的樣式只要這樣就OK了。

 

          

Code

       

     又寫完了一部分。。不難吧!接着看啊!

     如果你的最外層的標記是<div >那麼,上面的那個方法你都不用寫.

 

 

     下面就寫了RenderContent方法,不難,只記住這個方法的職責:顯示最外層標記的內容:

     如下:

          

Code

 

     這樣就完了,大家看看上面的代碼,很熟悉吧,是啊,只是把我們之前的代碼分割開了,寫在不同的地方!

 

     最後的那個RendEndTag(),你不寫!因爲,你override那個TagKey時,就已經調用了結束標記的方法。這樣,一個繼承WebControl的控件就完了!

 

     好了,寫完了:完整的代碼如下:

     

     

Code

 

    希望大家繼續支持啊!謝謝!

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章