控制項學習三（從繼承開始）

 

三．從繼承開始

1.繼承控制項

所有的控制項設計，都是從繼承一個物件而來。

當我們建立一個新的控制項專案，系統會自動生成一些程式碼，例如，

Inherits System.Web.UI.WebControls.WebControl

繼承WebControl的好處是：它有所有web控制項最基本的屬性、方法和事件。

當然，要讓這些發揮效果，Render程式碼中還有做一些事情。

    Protected Overrides Sub Render(ByVal output As System.Web.UI.HtmlTextWriter)

        output.Write("write...")

    End Sub

 

關於Render方法

為什麽Render方法可以顯示控制項？

其實，您仔細看的話，會發現每個控制項一定都會有Render方法，連WebForm的Page都有，就是因為WebForm的Rneder方法，會去呼叫WebForm上每個控制項的Render方法，並傳入【System.Web.UI.HtmlTextWriter】，而每一個Web控制項透過傳入的【System.Web.UI.HtmlTextWriter】，將自己的HTML碼輸出，一個接一個，WebForm上面的每一個控制項，都會透過傳入的【System.Web.UI.HtmlTextWriter】物件，將自己的HTML嗎會被逐一顯示出來，因此，整個WebForm機制就完成了，HTML碼被完整的輸出到使用者端，變成我們看到的網頁。

 

1.      繼承複雜的類別

假定我們要擴充【Panel控制項】的功能。那么就需要繼承System.Web.UI.WebControls.Panel

<DefaultProperty("ScrollBars"), ToolboxData("<{0}:ScrollPanel runat=server></{0}:ScrollPanel>")> Public Class ScrollPanel

    Inherits System.Web.UI.WebControls.Panel

之所以要繼承Panel，就是希望原本Panel的一些功能都還有，所以需要修改Rneder方法。

    '覆寫Render

    Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)

        MyBase.Render(writer)

    End Sub

也就是說，我們在複寫了【Render】方法之後，也要回頭呼叫原本繼承的物件（MyBase）的【Render】方法，並且傳入自己的【System.Web.UI.HtmlTextWriter】當作參數。這一做是為了在複寫【Render】方法之後，還能確保繼承的父類別的Render方法有被正常呼叫到。

之所以要呼叫到繼承的父類別的Render的方法，是為了讓繼承來的ScorllPanel可以正常顯示，原本繼承Panel而來的ScrollPanel控制項的Render方法，本身就包含了顯示Panel（HTML碼為<div style..>…</div>）的程式碼，而這些程式碼都會存在與繼承的Render方法中，所以，我們複寫了父類別的Render，就要在我們的Render程式碼中，呼叫自己基地類別（父類別）的Render方法。

如果不呼叫會怎樣？那網頁輸出后就會完全看不到這個控制項，因為主要的父類別Render方法（在網頁上產生一個<div style…>…</div>的程式碼）并沒有執行到。

如果我們乾脆不複寫這個方法呢？也行，那ScrollPanel的顯示就會和原本的Panel一樣（因為繼承自Panel控制項）。

複寫Render方法時的HtmlTextWriter物件

    '底下的Render會產生一段按鈕的HTML 例如：<Button> 標題文字 </Button>

    Protected Overrides Sub Render(ByVal output As System.Web.UI.HtmlTextWriter)

        '註冊一個隱藏欄位

        Me.Page.RegisterHiddenField("For_WebCustomControl1", "")

        'Render控制項HTML碼

        Dim JavaScript As String

        '建立 Postback 用的 JavaScript

        JavaScript = "Form1.For_WebCustomControl1.value='" & Me.ClientID & "';Form1.submit();"

        output.AddAttribute("onclick", JavaScript)

        output.AddAttribute("id", Me.ClientID)

        output.AddAttribute("name", Me.ClientID)

        output.RenderBeginTag("button")

        output.Write(Me.Text)

        output.RenderEndTag()

    End Sub

注意，在.AddAttribute被执行时，并不會立刻輸出屬性，而是等到第二行“RenderBeginTag”執行時，才會將先前“AddAttribute”加入的屬性值，整合在要顯示的標記中一并輸出。