ASPNET模板控件ASPNET内置的模板控件了解模板控件
如下图以下为ASPNET内置的模板控件
)thisstylewidth=; border=>
上图的控件一方面是模板控件另一方面又是数据绑定控件这里我们暂且不讨论如何实现数据绑定
使用上面控件的话应该熟悉控件存在着不同的模板如下图Repeater控件的模板类型
image onmousewheel=javascript:return big(this) height= alt= hspace= src=http://imgeducitycn/img_///jpg width= onload=javascript:if(thiswidth>)thisstylewidth=; border=>
在不同模板内你可以定义控件显示内容会呈现不同效果典型的运用就是GridView其呈现代码会是一个表格代码而Repeater则是自定义的其实其是内部已经实现了的暂且先不管这些下面一步步看下来如何实现
ASPNET模板控件实现模板控件
简单实现模板控件(静态模板)
()模板控件为特殊的复合控件你还是需要实现INamingContainer接口因为在模板属性的内容是为子控件集合添加到模板控件中为保证控件具有唯一标识符其实现将在CreateChildControls方法中创建子控件
ASPNET中可以直接继续CompositeControl就可
()定义控件属性
模板属性为SystemWebUIITemplate 接口此接口有一InstantiateIn 方法 将在下面分析
上一篇我们说明了控件内部属性和控件的区别模板并非控件而是属性我们在属性浏览器中并未看到此属性是因为我们为其加了元数据作为内部属性使用
定义模板属性方法如下
//声明变量 private ITemplate _itemTemplate;
//属性 [Browsable(false)] [TemplateContainer(typeof(Article))]
[PersistenceMode(PersistenceModeInnerProperty)]
public ITemplate ItemTemplate
{
get {
return _itemTemplate;
}
set {
_itemTemplate = value;
}
}
这里我们认识到了一个TemplateContainer元数据其与容器控件关联起来Article为默认其自身控件即默认将自身控件作为容器控件
()重写CreateChildControls方法
此方法我们以前已认识过了主要是为控件添加子控件
protected override void CreateChildControls()
{
_itemTemplateInstantiateIn(this);
}
这次我们要做的重点是认识ITemplate接口的InstantiateIn 方法方法有一个Control参数其为子控件和模板定义了一个容器控件(此处为其自身控件下面看页面代码)如GridView和DataList控件都实现了自定义的容器控件Repeater则是完全自定义的这里暂且默认实现
ASPNET模板控件实现代码
在模板内拖了一个label控件
﹤custom:Article id=Article Runat=server﹥
﹤ItemTemplate﹥
﹤asp:Label ID=Label runat=server Text=Label﹥﹤/asp:Label﹥
﹤/ItemTemplate﹥
﹤/custom:Article﹥
OK你可以看一下效果了当然你可以定义多个模板然后在多个不同模板内添加内容我们来看下其控件树内容如下图
image onmousewheel=javascript:return big(this) height= alt= hspace= src=http://imgeducitycn/img_///jpg width= onload=javascript:if(thiswidth>)thisstylewidth=; border=>
子控件有一个Label控件非控件内容则以LiteralControl呈现
实现动态模板
当我们使用DataList控件时往往在模板中动态的绑定一些数据获取的这些数据则是ITemplate接口的InstantiateIn 方法中的容器控件下面我们为控件定义属性然后通过DataBind()方法和数据绑定表达式获取数据
我们先先定义三个属性
页面代码注意要用DataBind()方法
void Page_Load()
{
ArticleTitle = Creating Templated Databound Controls;
ArticleAuthor = Stephen Walther;
ArticleContents = Blah blah blah blah
ArticleDataBind();
}
通过Container数据绑定表达式获取容器对象属性此处容器对象为默认的Article
image onmousewheel=javascript:return big(this) height= alt= hspace= src=http://imgeducitycn/img_///jpg width= onload=javascript:if(thiswidth>)thisstylewidth=; border=>
如下实现
﹤custom:Article id=Article Runat=server﹥
﹤ItemTemplate﹥
﹤asp:Label ID=Label runat=server Text=Label﹥﹤/asp:Label﹥
﹤%# ContainerTitle%﹥﹤br /﹥
﹤%# ContainerAuthor %﹥﹤br /﹥
﹤%# ContainerContents %﹥﹤br /﹥
﹤/ItemTemplate﹥
﹤/custom:Article﹥
好了到这里你就实现了一个简单的动态模板控件了
实现默认模板
在购书网站上我们常常看到由于图书太多的情况下管理人员未能将图书封面发布到网站上这时此书可能出现默认的图片尚为此书添加图书封面
在一个具有模板的控件里如果你未为控件添加模板属性的话你可以通过实现默认模板来实现默认效果
()那你第一步要做的就是定义一个自定义ASPNET模板控件此模板需要实现ITemplate接口实现InstantiateIn方法看一下典型实现如下代码
public class ArticleDefaultTemplate : ITemplate
{
public void InstantiateIn(Control container)
{
Label lblTitle = new Label();
lblTitleDataBinding += new EventHandler(lblTitle_DataBinding);
Label lblAuthor = new Label();
lblAuthorDataBinding += new EventHandler(lblAuthor_DataBinding);
Label lblContents = new Label();
lblContentsDataBinding += new EventHandler(lblContents_DataBinding);
containerControlsAdd(lblTitle);
containerControlsAdd(new LiteralControl(﹤br /﹥));
containerControlsAdd(lblAuthor);
containerControlsAdd(new LiteralControl(﹤br /﹥));
containerControlsAdd(lblContents);
}
void lblTitle_DataBinding(object sender EventArgs e)
{
Label lblTitle = (Label)sender;
ArticleWithDefault container = (ArticleWithDefault)lblTitleNamingContainer;
lblTitleText = containerTitle;
}
void lblAuthor_DataBinding(object sender EventArgs e)
{
Label lblAuthor = (Label)sender;
ArticleWithDefault container = (ArticleWithDefault)lblAuthorNamingContainer;
lblAuthorText = containerAuthor;
}
void lblContents_DataBinding(object sender EventArgs e)
{
Label lblContents = (Label)sender;
ArticleWithDefault container = (ArticleWithDefault)lblContentsNamingContainer;
lblContentsText = containerContents;
}
}
在InstantiateIn方法中定义了默认控件并实现了默认绑定在各自的数据绑定事件里通过容器控件(默认容器控件为ArticleWithDefault此处还是没自定义容器控件下面会介绍)的NamingContainer属性获取控件ID值然后对控件进行赋值
()重写CreateChildControls方法
当未定义模板属性时则实现默认模板
protected override void CreateChildControls()
{
if (_itemTemplate == null)
_itemTemplate = new ArticleDefaultTemplate();
_itemTemplateInstantiateIn(this); }
()页面代码
下面实现效果跟的定义的模板控件效果一样这里只为说明默认模板的使用方法
void Page_Load()
{
ArticleWithDefaultTitle = Creating Templated Databound Controls;
ArticleWithDefaultAuthor = Stephen Walther;
ArticleWithDefaultContents = Blah blah blah blah;
ArticleWithDefaultDataBind();
}
﹤custom:ArticleWithDefault
id=ArticleWithDefault
Runat=server /﹥ ASPNET模板控件之实现自定义容器控件
上面我已经多次注明容器控件为默认自身控件你可以通过自定义容器控件
GridView控件会自动把数据以表格形式呈现DataList控件有DataListItem Repeater则有RepeaterItem
这些控件实现数据绑定后通常不是显示一条数据的其控件都有一个Items属性其表示项集合
image onmousewheel=javascript:return big(this) height= alt= hspace= src=http://imgeducitycn/img_///jpg width= onload=javascript:if(thiswidth>)thisstylewidth=; border=>
每项数据都在其Item里面看一下DataList绑定数据以后的控件树
我们常常会需要在模板控件里以以下方式来获取模板内部控件
如在DataList控件中
protected void DataList_ItemDataBound(object sender DataListItemEventArgs e)
{
eItemFindControl();
DataListItems[]BackColor = SystemDrawingColorRed;
}
通过此方法我们可以处理一些特殊的列和行为实现上面效果我们也可以为ASPNET模板控件自定义容器控件
()自定义容器控件类
注意需要实现IDataItemContainer接口就如DataList一样其绑定的数据不可能是一条的
public class ProductItem : WebControl IDataItemContainer
{
private string _name;
private decimal _price;
public string Name
{
get { return _name; }
set { _name = value; }
}
public decimal Price
{
get { return _price; }
set { _price = value; }
}
public object DataItem
{
get
{
return this;
}
}
public int DataItemIndex
{
get { return ;
}
}
public int DisplayIndex
{
get { return ;
}
}
}
然后在主控件中如下实现
private ProductItem _item;
public string Name
{
get
{
EnsureChildControls();
return _itemName;
}
set
{
EnsureChildControls();
_itemName = value;
}
}
public Decimal Price
{
get
{
EnsureChildControls();
return _itemPrice;
}
set
{
EnsureChildControls();
_itemPrice = value;
}
}
()ASPNET模板控件之用TemplateContainer与模板属性关联起来
[TemplateContainer(typeof(ProductItem))]
[PersistenceMode(PersistenceModeInnerProperty)]
public ITemplate ItemTemplate
{
get {
return _itemTemplate;
}
set
{
_itemTemplate = value;
}
}
()重写CreateChildControls方法
image onmousewheel=javascript:return big(this) height= alt=类型为ProductItem src=http://imgeducitycn/img_///jpg width= onload=javascript:if(thiswidth>)thisstylewidth=; border=>
注意了此处模板的InstantiateIn方法不再是this了而是自定义容器控件了再用数据绑定表达式访问的将是ProductItem的数据(即自定义容器控件的数据)
protected override void CreateChildControls()
{
_item = new ProductItem();
_itemTemplateInstantiateIn(_item);
ControlsAdd(_item);
}
()页面代码
void Page_Load()
{
ProductName = Laptop Computer;
ProductPrice = m;
ProductDataBind();
}
﹤custom:Product
id=Product
Runat=Server﹥
﹤ItemTemplate﹥
Name: ﹤%# Eval(Name) %﹥
﹤br /﹥
Price: ﹤%# Eval(Price {:c}) %﹥
﹤/ItemTemplate﹥
﹤/custom:Product﹥
上面以Eval来绑定数据也可以用Container表达式如下图其类型为ProductItem
注意:当不是数据绑定控件时则不能用Eval绑定语法如上面的几个例子大家可以测试一下
ASPNET模板控件的相关内容就向你介绍到这里希望对你了解ASPNET模板控件有所帮助
