如何将Template添加到UserControl？

Question

之前已经问过这个问题

• Web Forms :: Design Time Support For Custom Templated User Control In VS 2008
• VS 2008 Using the ITemplate in a UserControl and getting a design time rendoring error
• how to show the controls for web user control in design time?
• UserControl ITemplate Property Design Time Error - Easy for a Guru...

但是再次问它并没有坏处：

  

如何在ASP.net中为UserControl添加模板？

到目前为止没有奏效

1. 从新的UserControl ⁵ 开始，我将其称为Contoso：

   public partial class Contoso: System.Web.UI.UserControl
   {
   }
   

   这将允许我们使用新控件： ¹

   <Contoso>
       Stuff in here
   <Contoso>
   

2. 创建ContentTemplate类型的公共ITemplate属性：

   public partial class Contoso: System.Web.UI.UserControl
   {
      public ITemplate ContentTemplate { get; set; }
   }
   

   并向ContentTemplate属性添加不确定数量的属性： ²

   //[ParseChildren(true)]
   [ParseChildren(true, "ContentTemplate")]
   //[ParseChildren(false)]
   public partial class Contoso: System.Web.UI.UserControl
   {
      [TemplateContainer(typeof(ContentContainer))]
      [TemplateInstance(TemplateInstance.Single)]
      [PersistenceMode(PersistenceMode.InnerProperty)]   
      //[PersistenceMode(PersistenceMode.InnerDefaultProperty)] 
      [Browsable(true)]
      //[Browsable(false)]
      [DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
      //[DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
      public ITemplate ContentTemplate { get; set; }
   }
   

   这将允许我们在我们的aspx文件中向控件添加<ContentTemplate>： ¹

   <Contoso>
      <ContentTemplate>
          Stuff in here
      </ContentTemplate>
   </Contoso>
   

3. 接下来，我们需要实际使用 ContentTemplate内容，将其添加到某处。我们将它添加到UserControl的一个内部div元素中。

   从最初为空的.aspx文件开始：

   <%@ Control Language="C#" AutoEventWireup="true" CodeFile="Contoso.aspx.cs" Inherits="Contoso" %>
   

   我们添加了一个包含div内容的父ContentTemplate：

   <%@ Control Language="C#" AutoEventWireup="true" CodeFile="Contoso.aspx.cs" Inherits="Contoso" %>
   <div id="ContentDiv" runat="server"></div>
   

   然后我们在控件的 Init 期间将ContentTemplate内容填充到父div中：

   public partial class Contoso: System.Web.UI.UserControl
   {
      protected override void OnInit(EventArgs e)
      {
         base.OnInit(e);
   
         //If there's content, then put it into our ContentDiv div
         if (this.ContentTemplate != null)
            this.ContentTemplate.InstantiateIn(ContentDiv);
      }
   
      [PersistenceModeAttribute(PersistenceMode.InnerProperty)]    
      [TemplateInstanceAttribute(TemplateInstance.Single)]
      [Browsable(true)]
      [DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
      public ITemplate ContentTemplate { get; set; }
   }
   

4. 修改：表明您的班级实施INamingContainer：

   public partial class Contoso: System.Web.UI.UserControl: INamingContainer
   {
      protected override void OnInit(EventArgs e)
      {
         base.OnInit(e);
   
         //If there's content, then put it into our ContentDiv div
         if (this.ContentTemplate != null)
            this.ContentTemplate.InstantiateIn(ContentDiv);
      }
   
      [PersistenceModeAttribute(PersistenceMode.InnerProperty)]    
      [TemplateInstanceAttribute(TemplateInstance.Single)]
      [Browsable(true)]
      [DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
      public ITemplate ContentTemplate { get; set; }
   }
   

   INamingContainer界面没有任何成员，仅用于将您的UserControl类标记为某种内容。

5. 我们已经完成 ³ 。我们现在可以在aspx页面中使用此控件。但首先我们需要在aspx页面的顶部“注册”：

   <%@ Register src="Contoso.ascx" TagName="Contoso" tagprefix="uc" %>
   

   其中：

   • Contoso.ascx是ascx文件的名称
   • Contoso是我们将用于引用此用户控件的元素的名称
   • uc是我们必须放在uc:Contoso前面的一些文字（我使用uc作为用户控件的缩写）

6. 将控件添加到我们的页面：

   <uc:Contoso ID="Crackers" runat="server">
       <ContentTemplate>
           Stuff goes here
       </ContentTemplate>
   </qwerty:Contoso>
   

我们已经完成了！ ⁴

修改：忘记添加上述原因不起作用的原因。 Visual Studio显示错误：

  

创建控件时出错 - 破解者

     

类型'System.Web.UI.UserControl'没有名为'ContentTemplate'的公共属性



这是有道理的，因为UserControl没有名为ContentTemplate的公共属性 - 所以我几乎不能责怪它。

系列

这个问题是正在进行的Stackoverflow系列中的一个，“模板化用户控件”：

• How to add a Templating to a UserControl?
• How to inherit from Control, rather than UserControl?
• UserControl has IsPostBack, but Control does not
• UserControl does not have public property named ContentTemplate
• How do i specify CodeFileBaseClass from web.config?

奖金阅读

• How to: Create Templated ASP.NET User Controls
• Creating a Templated User Control with ASP.Net 2.0
• Templated User Controls in ASP.NET for Better Maintainability

脚注

• ¹ 您不能使用该语法。这只是一个易于阅读和理解的形式。
• ² 没有人知道要添加的属性或原因。添加或多或少的属性来品味。
• ³ 未完成。使用UserControl完成，但不是我们的工作。
• ⁴ 未完成;它不起作用。
网站中的
• ⁵ （不是Web应用程序，不是单独的程序集）

Answer 1

嗯，我相信你差不多了。

顺便说一句。 UserControl不使用Visual Studio Designer呈现，但是当您运行应用程序时，控件可以正常工作。如果您使用服务器控件，则会有所不同，在这种情况下，控件在Visual Studio设计器中正确显示

以下代码非常适合构建模板化用户控件和模板化服务器控件但是，如果您想添加绑定功能，则过程略有不同，take a look

Download Source Code

这是创建模板化UserControl。

的代码

简单输出

模板容器

public class MyTemplateContainer : Control, INamingContainer { }

ASPX代码背后

protected void Page_Load(object sender, EventArgs e)
{
    // just to demonstrate using the contorl
    this.WebUserControl1.Controls.Add(new LiteralControl("<br />new control"));
}

ASPX

<%@ Register src="WebUserControl.ascx" tagname="WebUserControl" tagprefix="uc1" %>

    <uc1:WebUserControl ID="WebUserControl1" runat="server">
        <ContentTemplate>
            My Template<br />
            <asp:Label Text='Hello People' runat="server" ID="lblMessage" />
        </ContentTemplate>
    </uc1:WebUserControl>

ASCX代码

public partial class WebUserControl : System.Web.UI.UserControl
{
    [TemplateContainer(typeof(MyTemplateContainer))]
    [TemplateInstance(TemplateInstance.Single)]
    [PersistenceMode(PersistenceMode.InnerProperty)]
    [Browsable(true)]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
    public ITemplate ContentTemplate { get; set; }

    protected void Page_Init(object sender, EventArgs e)
    {
        this.myPlaceHolderTag.Controls.Clear();

        if (this.ContentTemplate != null)
        {
            var container = new MyTemplateContainer();

            this.ContentTemplate.InstantiateIn(container);
            this.myPlaceHolderTag.Controls.Add(container);
        }
        else
        {
            this.myPlaceHolderTag.Controls.Add(new LiteralControl("No template defined"));
        }
    }
}

ASCX

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %>

<asp:PlaceHolder runat="server" ID="myPlaceHolderTag" />

添加模板化服务器控件的代码

输出

ASPX

<%@ Register Namespace="MyControls" TagPrefix="my" %>

<my:MyServerControl runat="server" ID="myServerControl">
    <ContentTemplate>
        My Server templated control<br />
        <asp:Label Text="My Label" runat="server" />
    </ContentTemplate>
</my:MyServerControl>

模板容器

namespace MyControls
{
    [ToolboxItem(false)]
    public class MyTemplateContainer : Control, INamingContainer { } 
}

模板化服务器控制

namespace MyControls
{
    [ToolboxData("<{0}:MyServerControl runat=server >")]
    [ToolboxItem(true)]
    [ParseChildren(true)]
    // you can inherit from another control if you like, for example from the CompositeControl
    public class MyServerControl : Control, INamingContainer
    {
        [TemplateInstance(TemplateInstance.Multiple)]
        [TemplateContainer(typeof(MyTemplateContainer))]
        [PersistenceMode(PersistenceMode.InnerProperty)]
        [Browsable(true)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
        [DefaultValue(null)]
        public ITemplate ContentTemplate { get; set; }

        protected override void CreateChildControls()
        {
            var p = new Panel { ID = "myPanel", BackColor = Color.Silver, Width = new Unit("100%") };

            if (this.ContentTemplate == null)
            {
                p.Controls.Add(new LiteralControl("No content has been specified"));
            }
            else
            {
                var c = new MyTemplateContainer();

                this.ContentTemplate.InstantiateIn(c);
                p.Controls.Add(c);
            }

            this.Controls.Clear();
            this.Controls.Add(p);
        }

        public override void DataBind()
        {
            this.CreateChildControls();
            this.ChildControlsCreated = true;
            base.DataBind();
        }

        public override ControlCollection Controls
        {
            get
            {
                this.EnsureChildControls();
                return base.Controls;
            }
        }
    }
}

参考文献：

• How to: Create Templated ASP.NET User Controls

• Building Templated Custom ASP.NET Server Controls

• Building DataBound Templated Custom ASP.NET Server Controls