[ASP.NET 控件实作 Day14] 继承 CompositeControl 实作 Toolbar 控件

之前我们简单介绍过继承 CompositeControl  来实作复合控件，在本文我们将以 Toolbar 控件为例，以复合控件的作法(继承 CompositeControl )来实作 Toolbar 控件，此工具列控件包含 Items 属性来描述工具列项目集合，依 Items 属性的设定来建立工具列按钮，另外包含 Click 事件可以得知使用按了那个按钮。

程序代码下载：ASP.NET Server Control - Day14.rar

 

一、工具列项目集合类别

工具列包含多个按钮，新增 TBToolbarItem 类别来描述工具列项目，TBToolbarItem 类别包含 Key、Text、Enabled 三个属性；而 TBToolbarItemCollection 为 TBToolbarItem 的集合类别来描述工具列按钮集合。

 

二、实作 TBToolbar 控件

step1. 新增继承 CompositeControl 的 TBToolbar 控件

    < _
    Description("工具列控制項。"), _
    ParseChildren(True, "Items"), _
    ToolboxData("<{0}:TBToolbar runat=server ></{0}:TBToolbar>") _
    > _
    Public Class TBToolbar
        Inherits CompositeControl
    End Class

 

step2. 新增 Items 属性，描述工具列项目集合

        ''' <summary>
        ''' 工具列項目集合。
        ''' </summary>
        < _
        Description("工具列項目集合。"), _
        PersistenceMode(PersistenceMode.InnerProperty), _
        DesignerSerializationVisibility(DesignerSerializationVisibility.Content), _
        Editor(GetType(CollectionEditor), GetType(UITypeEditor)) _
        > _
        Public ReadOnly Property Items() As TBToolbarItemCollection
            Get
                If FItems Is Nothing Then
                    FItems = New TBToolbarItemCollection()
                End If
                Return FItems
            End Get
        End Property

 

step3. 新增 Click 事件

TBToolbar 类别新增 Click 事件，当按下按钮时会引发 Click 事件，由 Click 的事件自变量 e.Key 可以得知使用者按了那个按钮。

        ''' <summary>
        ''' Click 事件引數。
        ''' </summary>
        Public Class ClickEventArgs
            Inherits System.EventArgs
            Private FKey As String = String.Empty

            ''' <summary>
            ''' 項目鍵值。
            ''' </summary>
            Public Property Key() As String
                Get
                    Return FKey
                End Get
                Set(ByVal value As String)
                    FKey = value
                End Set
            End Property
        End Class

        ''' <summary>
        ''' 按下工具列按鈕所引發的事件。
        ''' </summary>
        < _
        Description("按下工具列按鈕所引發的事件。") _
        > _
        Public Event Click(ByVal sender As Object, ByVal e As ClickEventArgs)

        ''' <summary>
        ''' 引發 Click 事件。
        ''' </summary>
        Protected Overridable Sub OnClick(ByVal e As ClickEventArgs)
            RaiseEvent Click(Me, e)
        End Sub

 

step4. 建立工具列按钮集合

覆写 CreateChildControls 方法，依 Items 属性的设定，来建立工具列中的按钮集合。每个按钮的 Click 事件都导向 ButtonClickEventHandler 方法，来处理所有按钮的 Click 动作，并引发 TBToolbar 的 Click 事件。

        Private Sub ButtonClickEventHandler(ByVal sender As Object, ByVal e As EventArgs)
            Dim oButton As Button
            Dim oEventArgs As ClickEventArgs

            oButton = CType(sender, Button)
            oEventArgs = New ClickEventArgs()
            oEventArgs.Key = oButton.ID
            OnClick(oEventArgs)
        End Sub

        ''' <summary>
        ''' 建立子控制項。
        ''' </summary>
        Protected Overrides Sub CreateChildControls()
            Dim oItem As TBToolbarItem
            Dim oButton As Button

            For Each oItem In Me.Items
                oButton = New Button()
                oButton.Text = oItem.Text
                oButton.Enabled = oItem.Enabled
                oButton.ID = oItem.Key
                AddHandler oButton.Click, AddressOf ButtonClickEventHandler
                Me.Controls.Add(oButton)
            Next
            MyBase.CreateChildControls()
        End Sub

 

三、测试程序

在页面拖曳 TBToolbar 控件，并设定 Items 属性，如入新增、修改、删除三个按钮。

在 TBToolbar 控件的 Click 事件加入测试程序代码，输出引发 Click 事件的 e.Key。

    Protected Sub TBToolbar1_Click(ByVal sender As Object, ByVal e As Bee.Web.WebControls.TBToolbar.ClickEventArgs) Handles TBToolbar1.Click
        Me.Response.Write(String.Format("您按了 {0}", e.Key))
    End Sub

 

执行程序，当按了工具列上的按钮时，就会引发 Click 事件，并输出该按钮对应的 Key。