EditableDesignerRegion 類別

定義

public ref class EditableDesignerRegion : System::Web::UI::Design::DesignerRegion

public class EditableDesignerRegion : System.Web.UI.Design.DesignerRegion

type EditableDesignerRegion = class
    inherit DesignerRegion

Public Class EditableDesignerRegion
Inherits DesignerRegion

繼承

Object

DesignerObject

DesignerRegion

EditableDesignerRegion

衍生

System.Web.UI.Design.TemplatedEditableDesignerRegion

System.Web.UI.Design.WebControls.WizardStepEditableRegion

範例

這個範例展示了如何建立一個有兩個可點擊區域的控制項，以及 EditableDesignerRegion 一個有兩個視圖或範本的物件。 編譯專案後，在視覺設計器中開啟頁面，切換到設計（所見即所得）視圖。 有兩個可點擊的檢視模式，分別是 View1 和 View2。 點選 View1 ，將 CheckBox 控制項從頁面下方拖曳到可點擊區域下方的空白設計師區域。 點選 View2 ，將控制項拖曳 RadioButton 到空的設計器區域。 再次點擊 View1 ，帶 的 CheckBox 區域會重新出現。 點擊 View2 ，帶 的 RadioButton 區域會重新出現。 切回原始資料檢視，看看你的變更如何被 HTML 標記保存

using System;
using System.ComponentModel;
using System.ComponentModel.Design;
using System.Drawing;
using System.Web.UI;
using System.Web.UI.Design;
using System.Web.UI.Design.WebControls;
using System.Web.UI.WebControls;

namespace Samples.ASPNet.ControlDesigners_CS 
{
    [
        Designer(typeof(MyMultiRegionControlDesigner)), 
        ToolboxData("<{0}:MyMultiRegionControl runat=\"server\" width=\"200\"></{0}:MyMultiRegionControl>")
    ]
    public class MyMultiRegionControl : CompositeControl
    {
        // Define the templates that represent 2 views on the control
        private ITemplate _view1;
        private ITemplate _view2;

        // Create persistable inner properties 
        // for the two editable views
        [PersistenceMode(PersistenceMode.InnerProperty), DefaultValue(null)]
        public virtual ITemplate View1
        {
            get { return _view1; }
            set { _view1 = value; }
        }
        [PersistenceMode(PersistenceMode.InnerProperty), DefaultValue(null)]
        public virtual ITemplate View2
        {
            get { return _view2; }
            set { _view2 = value; }
        }

        // The current view on the control; 0 = view1, 1 = view2
        private int _currentView = 0;
        public int CurrentView
        {
            get { return _currentView; }
            set { _currentView = value; }
        }

        // Create a simple table with a row of two clickable, 
        // readonly headers and a row with a single column, which 
        // is the 'container' to which we'll be adding controls.
        protected override void CreateChildControls()
        {
            // Always start with a clean form
            Controls.Clear();

            // Create a table using the control's declarative properties
            Table t = new Table();
            t.CellSpacing = 1;
            t.BorderStyle = BorderStyle;
            t.Width = this.Width;
            t.Height = this.Height;

            // Create the header row
            TableRow tr = new TableRow();
            tr.HorizontalAlign = HorizontalAlign.Center;
            tr.BackColor = Color.LightBlue;

            // Create the first cell in the header row
            TableCell tc = new TableCell();
            tc.Text = "View 1";
            tc.Width = new Unit("50%");
            tr.Cells.Add(tc);

            // Create the second cell in the header row
            tc = new TableCell();
            tc.Text = "View 2";
            tc.Width = new Unit("50%");
            tr.Cells.Add(tc);

            t.Rows.Add(tr);

            // Create the second row for content
            tr = new TableRow();
            tr.HorizontalAlign = HorizontalAlign.Center;

            // This cell represents our content 'container'
            tc = new TableCell();
            tc.ColumnSpan = 2;

            // Add the current view content to the cell
            // at run-time
            if (!DesignMode)
            {
                Control containerControl = new Control();
                switch (CurrentView)
                {
                    case 0:
                        if (View1 != null)
                            View1.InstantiateIn(containerControl);
                        break;
                    case 1:
                        if (View2 != null)
                            View2.InstantiateIn(containerControl);
                        break;
                }

                tc.Controls.Add(containerControl);
            }

            tr.Cells.Add(tc);

            t.Rows.Add(tr);

            // Add the finished table to the Controls collection
            Controls.Add(t);
        }
    }

    //---------------------------------------------------------
    // Region-based control designer for the above web control, 
    // derived from CompositeControlDesigner.
    public class MyMultiRegionControlDesigner : CompositeControlDesigner 
    {
        private MyMultiRegionControl myControl;

        public override void Initialize(IComponent component)
        {
            base.Initialize(component);
            myControl = (MyMultiRegionControl)component;
        }

        // Make this control resizeable on the design surface
        public override bool AllowResize
        {
            get
            {
                return true;
            }
        }

        // Use the base to create child controls, then add region markers
        protected override void CreateChildControls() {
            base.CreateChildControls();

            // Get a reference to the table, which is the first child control
            Table t = (Table)myControl.Controls[0];

            // Add design time markers for each of the three regions
            if (t != null)
            {
                // View1
                t.Rows[0].Cells[0].Attributes[DesignerRegion.DesignerRegionAttributeName] = "0";
                // View2
                t.Rows[0].Cells[1].Attributes[DesignerRegion.DesignerRegionAttributeName] = "1";
                // Editable region
                t.Rows[1].Cells[0].Attributes[DesignerRegion.DesignerRegionAttributeName] = "2";
            }
        }

        // Handler for the Click event, which provides the region in the arguments.
        protected override void OnClick(DesignerRegionMouseEventArgs e)
        {
            if (e.Region == null)
                return;

            // If the clicked region is not a header, return
            if (e.Region.Name.IndexOf("Header") != 0)
                return;

            // Switch the current view if required
            if (e.Region.Name.Substring(6, 1) != myControl.CurrentView.ToString())
            {
                myControl.CurrentView = int.Parse(e.Region.Name.Substring(6, 1));
                base.UpdateDesignTimeHtml();
            }
        }

        // Create the regions and design-time markup. Called by the designer host.
        public override String GetDesignTimeHtml(DesignerRegionCollection regions) {
            // Create 3 regions: 2 clickable headers and an editable row
            regions.Add(new DesignerRegion(this, "Header0"));
            regions.Add(new DesignerRegion(this, "Header1"));

            // Create an editable region and add it to the regions
            EditableDesignerRegion editableRegion = 
                new EditableDesignerRegion(this, 
                    "Content" + myControl.CurrentView, false);
            regions.Add(editableRegion);

            // Set the highlight for the selected region
            regions[myControl.CurrentView].Highlight = true;

            // Use the base class to render the markup
            return base.GetDesignTimeHtml();
        }

        // Get the content string for the selected region. Called by the designer host?
        public override string GetEditableDesignerRegionContent(EditableDesignerRegion region) 
        {
            // Get a reference to the designer host
            IDesignerHost host = (IDesignerHost)Component.Site.GetService(typeof(IDesignerHost));
            if (host != null)
            {
                ITemplate template = myControl.View1;
                if (region.Name == "Content1")
                    template = myControl.View2;

                // Persist the template in the design host
                if (template != null)
                    return ControlPersister.PersistTemplate(template, host);
            }

            return String.Empty;
        }

        // Create a template from the content string and  
        // put it in the selected view.
        public override void SetEditableDesignerRegionContent(EditableDesignerRegion region, string content)
        {
            if (content == null)
                return;

            // Get a reference to the designer host
            IDesignerHost host = (IDesignerHost)Component.Site.GetService(typeof(IDesignerHost));
            if (host != null)
            {
                // Create a template from the content string
                ITemplate template = ControlParser.ParseTemplate(host, content);

                // Determine which region should get the template
                // Either 'Content0' or 'Content1'
                if (region.Name.EndsWith("0"))
                    myControl.View1 = template;
                else if (region.Name.EndsWith("1"))
                    myControl.View2 = template;
            }
        }
    }
}

Imports System.ComponentModel
Imports System.ComponentModel.Design
Imports System.Drawing
Imports System.Web.UI
Imports System.Web.UI.Design
Imports System.Web.UI.Design.WebControls
Imports System.Web.UI.WebControls

Namespace Samples.ASPNet.ControlDesigners_VB

    < _
        Designer(GetType(MyMultiRegionControlDesigner)), _
        ToolboxData("<{0}:MyMultiRegionControl runat=""server"" width=""200""></{0}:MyMultiRegionControl>") _
    > _
    Public Class MyMultiRegionControl
        Inherits CompositeControl

        ' Define the templates that represent 2 views on the control
        Private _view1 As ITemplate
        Private _view2 As ITemplate
        ' The current view on the control; 0 = view1, 1 = view2
        Private _currentView As Integer = 0

        ' Create persistable inner properties
        <PersistenceMode(PersistenceMode.InnerProperty), DefaultValue(CType(Nothing, ITemplate))> _
        Public Overridable Property View1() As ITemplate
            Get
                Return _view1
            End Get
            Set(ByVal value As ITemplate)
                _view1 = value
            End Set
        End Property

        <PersistenceMode(PersistenceMode.InnerProperty), DefaultValue(CType(Nothing, ITemplate))> _
        Public Overridable Property View2() As ITemplate
            Get
                Return _view2
            End Get
            Set(ByVal value As ITemplate)
                _view2 = value
            End Set
        End Property

        Public Property CurrentView() As Integer
            Get
                Return _currentView
            End Get
            Set(ByVal value As Integer)
                _currentView = value
            End Set
        End Property

        ' Create a simple table with a row of two clickable, 
        ' readonly headers and a row with a single column, which 
        ' is the 'container' to which we'll be adding controls.
        Protected Overrides Sub CreateChildControls()
            ' Start with a clean form
            Controls.Clear()

            ' Create a table
            Dim t As New Table()
            t.CellSpacing = 1
            t.BorderStyle = BorderStyle
            t.Width = Me.Width
            t.Height = Me.Height

            ' Create the header row
            Dim tr As New TableRow()
            tr.HorizontalAlign = HorizontalAlign.Center
            tr.BackColor = Color.LightBlue

            ' Create the first cell in the header row
            Dim tc As New TableCell()
            tc.Text = "View 1"
            tc.Width = New Unit("50%")
            tr.Cells.Add(tc)

            ' Create the second cell in the header row
            tc = New TableCell()
            tc.Text = "View 2"
            tc.Width = New Unit("50%")
            tr.Cells.Add(tc)

            t.Rows.Add(tr)

            ' Create the second row for content
            tr = New TableRow()
            tr.HorizontalAlign = HorizontalAlign.Center

            ' This cell represents our content 'container'
            tc = New TableCell()
            tc.ColumnSpan = 2

            ' Add the current view content to the cell 
            ' at run-time
            If Not DesignMode Then
                Dim containerControl As New Control()
                Select Case CurrentView
                    Case 0
                        If Not (View1 Is Nothing) Then
                            View1.InstantiateIn(containerControl)
                        End If
                    Case 1
                        If Not (View2 Is Nothing) Then
                            View2.InstantiateIn(containerControl)
                        End If
                End Select

                tc.Controls.Add(containerControl)
            End If

            tr.Cells.Add(tc)

            t.Rows.Add(tr)

            ' Add the finished table to the Controls collection
            Controls.Add(t)
        End Sub

    End Class

    ' Region-based control designer for the above web control. 
    ' This is derived from CompositeControlDesigner.
    Public Class MyMultiRegionControlDesigner
        Inherits CompositeControlDesigner

        Private myControl As MyMultiRegionControl

        Public Overrides Sub Initialize(ByVal component As IComponent)
            MyBase.Initialize(component)
            myControl = CType(component, MyMultiRegionControl)
        End Sub

        ' Make this control resizeable on the design surface
        Public Overrides ReadOnly Property AllowResize() As Boolean
            Get
                Return True
            End Get
        End Property

        ' Use the base to create child controls, then add region markers
        Protected Overrides Sub CreateChildControls()
            MyBase.CreateChildControls()

            ' Get a reference to the table, which is the first child control
            Dim t As Table
            t = CType(myControl.Controls(0), Table)

            ' Add design time markers for each of the three regions
            If Not IsNothing(t) Then
                ' View1
                t.Rows(0).Cells(0).Attributes(DesignerRegion.DesignerRegionAttributeName) = "0"
                ' View2
                t.Rows(0).Cells(1).Attributes(DesignerRegion.DesignerRegionAttributeName) = "1"
                ' Editable region
                t.Rows(1).Cells(0).Attributes(DesignerRegion.DesignerRegionAttributeName) = "2"
            End If
        End Sub

        ' Handler for the Click event, which provides the region in the arguments.
        Protected Overrides Sub OnClick(ByVal e As DesignerRegionMouseEventArgs)
            If IsNothing(e.Region) Then
                Return
            End If

            ' If the clicked region is not a header, return
            If e.Region.Name.IndexOf("Header") <> 0 Then
                Return
            End If

            ' Switch the current view if required
            If e.Region.Name.Substring(6, 1) <> myControl.CurrentView.ToString() Then
                myControl.CurrentView = Integer.Parse(e.Region.Name.Substring(6, 1))
                MyBase.UpdateDesignTimeHtml()
            End If
        End Sub

        ' Create the regions and design-time markup. Called by the designer host.
        Public Overrides Function GetDesignTimeHtml(ByVal regions As DesignerRegionCollection) As String
            ' Create 3 regions: 2 clickable headers and an editable row
            regions.Add(New DesignerRegion(Me, "Header0"))
            regions.Add(New DesignerRegion(Me, "Header1"))

            ' Create an editable region and add it to the regions
            Dim editableRegion As EditableDesignerRegion = _
                New EditableDesignerRegion(Me, _
                    "Content" & myControl.CurrentView, False)
            regions.Add(editableRegion)

            ' Set the highlight for the selected region
            regions(myControl.CurrentView).Highlight = True

            ' Use the base class to render the markup
            Return MyBase.GetDesignTimeHtml()
        End Function

        ' Get the content string for the selected region. Called by the designer host?
        Public Overrides Function GetEditableDesignerRegionContent(ByVal region As EditableDesignerRegion) As String
            ' Get a reference to the designer host
            Dim host As IDesignerHost = CType(Component.Site.GetService(GetType(IDesignerHost)), IDesignerHost)

            If Not IsNothing(host) Then
                Dim template As ITemplate = myControl.View1
                If region.Name = "Content1" Then
                    template = myControl.View2
                End If

                ' Persist the template in the design host
                If Not IsNothing(template) Then
                    Return ControlPersister.PersistTemplate(template, host)
                End If
            End If

            Return String.Empty
        End Function

        ' Create a template from the content string and put it 
        ' in the selected view. Called by the designer host?
        Public Overrides Sub SetEditableDesignerRegionContent(ByVal region As EditableDesignerRegion, ByVal content As String)
            If IsNothing(content) Then
                Return
            End If

            ' Get a reference to the designer host
            Dim host As IDesignerHost = CType(Component.Site.GetService(GetType(IDesignerHost)), IDesignerHost)
            If Not IsNothing(host) Then
                ' Create a template from the content string
                Dim template As ITemplate = ControlParser.ParseTemplate(host, content)

                ' Determine which region should get the template
                If region.Name.EndsWith("0") Then
                    myControl.View1 = template
                ElseIf region.Name.EndsWith("1") Then
                    myControl.View2 = template
                End If

            End If
        End Sub
    End Class

End Namespace

<%@ Page Language="C#"  %>
<%@ Register TagPrefix="aspSample" 
    Assembly="Samples.ASPNet.ControlDesigners_CS" 
    Namespace="Samples.ASPNet.ControlDesigners_CS" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Designers Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <aspSample:MyMultiRegionControl ID="myCtl" Runat=Server Width=200 Height=75 BorderStyle=solid >
        </aspSample:MyMultiRegionControl><br />
        <asp:CheckBox ID="CheckBox1" runat="server" />
        <asp:RadioButton ID="RadioButton1" runat="server" />

    </div>
    </form>
</body>
</html>

<%@ Page Language="VB" %>
<%@ Register TagPrefix="aspSample" 
    Assembly="Samples.ASPNet.ControlDesigners_VB" 
    Namespace="Samples.ASPNet.ControlDesigners_VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Designers Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <aspSample:MyMultiRegionControl ID="myCtl" Runat=Server Width=200 Height=75 BorderStyle=solid >
        </aspSample:MyMultiRegionControl><br />
        <asp:CheckBox ID="CheckBox1" runat="server" />
        <asp:RadioButton ID="RadioButton1" runat="server" />

    </div>
    </form>
</body>
</html>

備註

在設計時用這 EditableDesignerRegion 堂課來幫助管理範本。 A ControlDesigner 會使用此類別的實例及其 GetEditableDesignerRegionContent 方法來產生區域內容的 HTML 標記。

另請參閱

• ControlDesigner
• GetEditableDesignerRegionContent(EditableDesignerRegion)
• 提供 Design-Time 支持
• 如何：擴展設計模式下控制項的外觀與行為