在我们的UI层页面开发过程中,会遇到这样一种情况: 很多页面块的外围内容一样,如csdn论坛的首页面(http://community.csdn.net/),那一个个的内容块,都要统一的标题,边框。可以将这些东东统一设置吗?
本文就要介绍这样一个控件,实现对页面块的包装,对页面块的外围装饰。
基本思想:将外围装饰作为装饰器的头尾模板内容,放在skin文件中。然后页面中将需要装饰的块用装饰器控间包围,设置相应装饰器的skinid即可。
控件声明如下,其中HeaderTemplate,FooterTemplate模板内容写在skin文件中,ContentTemplate在页面中包围要装饰的块。
使用示例:
demo.skin :
<%@ Register Assembly=Net.WebControls" Namespace="Net.WebControls" TagPrefix="net" %>
<net:ContentWrapper runat="server" SkinId="Main">
<HeaderTemplate>
<hr/> <hr/>
</HeaderTemplate>
<FooterTemplate>
<hr/>
</FooterTemplate>
</net:ContentWrapper>
此skin定义将包装的内容 上面加两条横线,下面加一条横线。<net:ContentWrapper runat="server" SkinId="Main">
<HeaderTemplate>
<hr/> <hr/>
</HeaderTemplate>
<FooterTemplate>
<hr/>
</FooterTemplate>
</net:ContentWrapper>
demo.aspx
<net:ContentWrapper ID="ContentWrapper1" runat="server" SkinID="Main">
<ContentTemplate>
我被包装了
<asp:TextBox runat=server id=textbox1></asp:TextBox>
</ContentTemplate>
</net:ContentWrapper>
<ContentTemplate>
我被包装了
<asp:TextBox runat=server id=textbox1></asp:TextBox>
</ContentTemplate>
</net:ContentWrapper>
通过ContentWrapper,我们实现了页面局部的复用,减少了页面的代码量,便于统一的修改页面外观。
下面是这个控件的完整代码:
using System;
using System.Collections;
using System.Collections.Generic;
using System.Text;
using System.Web.UI.WebControls;
using System.Web;
using System.Web.UI;
using System.Web.UI.Design;
using System.ComponentModel;
namespace Net.WebControls
{
/// <summary>
/// 包装器控件
/// @author:jianyi0115@163.com
/// </summary>
[Themeable(true)]
[Designer(typeof(ContentWrapperDesigner))]
public class : CompositeControl, INaminContentWrapper gContainer
{
public ContentWrapper()
{
this.EnableViewState = true;
}
private string _title;
public string Title
{
set { _title = value; }
get { return _title; }
}
private ITemplate _headerTemplate;
/// <summary>
/// 头模版
/// </summary>
[Themeable(true)]
[TemplateInstance(TemplateInstance.Single),Browsable(false), DefaultValue((string)null)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateContainer(typeof(TemplateItem))]
public ITemplate HeaderTemplate
{
set { this._headerTemplate = value; }
get { return this._headerTemplate; }
}
private ITemplate _footerTemplate;
/// <summary>
/// 脚模版
/// </summary>
[Themeable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateContainer(typeof(TemplateItem))]
public ITemplate FooterTemplate
{
set { this._footerTemplate = value; }
get { return this._footerTemplate; }
}
private ITemplate _contentTemplate;
/// <summary>
/// 模版
/// </summary>
[Themeable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateInstance(TemplateInstance.Single), Browsable(false), DefaultValue((string)null)]
public ITemplate ContentTemplate
{
set { this._contentTemplate = value; }
get { return this._contentTemplate; }
}
private bool _IsParser = false;
private TemplateItem _header;
private TemplateItem _footer;
protected virtual void ParserTemplate()
{
if (_IsParser) return;
_IsParser = true ;
if (HeaderTemplate != null)
{
_header = new TemplateItem(0, this);
HeaderTemplate.InstantiateIn(_header);
this.Controls.Add(_header);
}
if (ContentTemplate != null)
{
Control content = new Control();
this.Controls.Add(content);
ContentTemplate.InstantiateIn(content);
}
if (FooterTemplate != null)
{
_footer = new TemplateItem(2, this);
FooterTemplate.InstantiateIn(_footer);
this.Controls.Add(_footer);
}
}
protected override void CreateChildControls()
{
this.Controls.Clear();
ParserTemplate();
this.ClearChildControlState();
base.ChildControlsCreated = true;
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
this.EnsureChildControls();
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
//不能进行整体绑定,否则回造成回发后内容丢失
if (_header != null)
_header.DataBind();
if (_footer != null)
_footer.DataBind();
}
}
/// <summary>
/// 模版数据项
/// </summary>
public class TemplateItem : Control, INamingContainer
{
public TemplateItem(int itemIndex, object dataItem)
{
_itemIndex = itemIndex;
_dataItem = dataItem;
}
private int _itemIndex = 0;
private object _dataItem;
/// <summary>
/// 行索引
/// </summary>
public int ItemIndex
{
get { return _itemIndex; }
}
/// <summary>
/// 行号
/// </summary>
public int RowNumber
{
get { return _itemIndex + 1; }
}
public object DataItem
{
get { return _dataItem; }
}
}
public class ContentWrapperDesigner : System.Web.UI.Design.ContainerControlDesigner
{
//protected override void PreFilterProperties(IDictionary properties)
//{
// base.PreFilterProperties(properties);
// Attribute[] attributeArray1 = new Attribute[] { new BrowsableAttribute(false), new EditorBrowsableAttribute(EditorBrowsableState.Never), new ThemeableAttribute(false) };
// string text1 = "VerbStyle";
// PropertyDescriptor descriptor1 = (PropertyDescriptor)properties[text1];
// if (descriptor1 != null)
// {
// properties[text1] = TypeDescriptor.CreateProperty(descriptor1.ComponentType, descriptor1, attributeArray1);
// }
//}
//public override void SetEditableDesignerRegionContent(EditableDesignerRegion region, string content)
//{
// this._zone.ZoneTemplate = ControlParser.ParseTemplate((IDesignerHost)base.Component.Site.GetService(typeof(IDesignerHost)), content);
// base.IsDirtyInternal = true;
//}
}
}
using System.Collections;
using System.Collections.Generic;
using System.Text;
using System.Web.UI.WebControls;
using System.Web;
using System.Web.UI;
using System.Web.UI.Design;
using System.ComponentModel;
namespace Net.WebControls
{
/// <summary>
/// 包装器控件
/// @author:jianyi0115@163.com
/// </summary>
[Themeable(true)]
[Designer(typeof(ContentWrapperDesigner))]
public class : CompositeControl, INaminContentWrapper gContainer
{
public ContentWrapper()
{
this.EnableViewState = true;
}
private string _title;
public string Title
{
set { _title = value; }
get { return _title; }
}
private ITemplate _headerTemplate;
/// <summary>
/// 头模版
/// </summary>
[Themeable(true)]
[TemplateInstance(TemplateInstance.Single),Browsable(false), DefaultValue((string)null)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateContainer(typeof(TemplateItem))]
public ITemplate HeaderTemplate
{
set { this._headerTemplate = value; }
get { return this._headerTemplate; }
}
private ITemplate _footerTemplate;
/// <summary>
/// 脚模版
/// </summary>
[Themeable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateContainer(typeof(TemplateItem))]
public ITemplate FooterTemplate
{
set { this._footerTemplate = value; }
get { return this._footerTemplate; }
}
private ITemplate _contentTemplate;
/// <summary>
/// 模版
/// </summary>
[Themeable(true)]
[PersistenceMode(PersistenceMode.InnerProperty)]
[TemplateInstance(TemplateInstance.Single), Browsable(false), DefaultValue((string)null)]
public ITemplate ContentTemplate
{
set { this._contentTemplate = value; }
get { return this._contentTemplate; }
}
private bool _IsParser = false;
private TemplateItem _header;
private TemplateItem _footer;
protected virtual void ParserTemplate()
{
if (_IsParser) return;
_IsParser = true ;
if (HeaderTemplate != null)
{
_header = new TemplateItem(0, this);
HeaderTemplate.InstantiateIn(_header);
this.Controls.Add(_header);
}
if (ContentTemplate != null)
{
Control content = new Control();
this.Controls.Add(content);
ContentTemplate.InstantiateIn(content);
}
if (FooterTemplate != null)
{
_footer = new TemplateItem(2, this);
FooterTemplate.InstantiateIn(_footer);
this.Controls.Add(_footer);
}
}
protected override void CreateChildControls()
{
this.Controls.Clear();
ParserTemplate();
this.ClearChildControlState();
base.ChildControlsCreated = true;
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
this.EnsureChildControls();
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
//不能进行整体绑定,否则回造成回发后内容丢失
if (_header != null)
_header.DataBind();
if (_footer != null)
_footer.DataBind();
}
}
/// <summary>
/// 模版数据项
/// </summary>
public class TemplateItem : Control, INamingContainer
{
public TemplateItem(int itemIndex, object dataItem)
{
_itemIndex = itemIndex;
_dataItem = dataItem;
}
private int _itemIndex = 0;
private object _dataItem;
/// <summary>
/// 行索引
/// </summary>
public int ItemIndex
{
get { return _itemIndex; }
}
/// <summary>
/// 行号
/// </summary>
public int RowNumber
{
get { return _itemIndex + 1; }
}
public object DataItem
{
get { return _dataItem; }
}
}
public class ContentWrapperDesigner : System.Web.UI.Design.ContainerControlDesigner
{
//protected override void PreFilterProperties(IDictionary properties)
//{
// base.PreFilterProperties(properties);
// Attribute[] attributeArray1 = new Attribute[] { new BrowsableAttribute(false), new EditorBrowsableAttribute(EditorBrowsableState.Never), new ThemeableAttribute(false) };
// string text1 = "VerbStyle";
// PropertyDescriptor descriptor1 = (PropertyDescriptor)properties[text1];
// if (descriptor1 != null)
// {
// properties[text1] = TypeDescriptor.CreateProperty(descriptor1.ComponentType, descriptor1, attributeArray1);
// }
//}
//public override void SetEditableDesignerRegionContent(EditableDesignerRegion region, string content)
//{
// this._zone.ZoneTemplate = ControlParser.ParseTemplate((IDesignerHost)base.Component.Site.GetService(typeof(IDesignerHost)), content);
// base.IsDirtyInternal = true;
//}
}
}
Is it the control you need ?