经过前面的努力,我们终于始一张空白的页面出现在了CS系统里, 接下来就要在这个空白的页面里加入我们想要的内容的,通过对CS代码的解读,我们知道CS的内容块都是采用了WEB用户控件的方式,而且在CS中所用的所有的ascx文件和ASPX文件一样是没有直接的绑定代码的.打开一些CS项目中在Controls文件夹下的文件,这些就是真正的控件的实现代码,所有CS控件都是继承自TemplatedWebControl,它是CS实现换肤的基础.
CS中所有的项目中都对TemplatedWebControl进行了一次甚至多次的继承,为什么要多次继承,具体原因我还不是搞得很明白,估计是为了提高代码的可读性和重用性.
对我们来说一开始不要搞得太复杂,我简单的写了个类做为我们项目的控件的基类
using System;
using CommunityServer.Controls;
using CommunityServer.Components;
namespace Papersnake.LocalPhoto.Controls
{
public abstract class LocalPhotoTemplatedWebControl:TemplatedWebControl
{
public LocalPhotoTemplatedWebControl():base()
{
}
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
if (Context.Items["SetLocalPhotoLocation"] == null)
{
UsersOnline.SetLocation("My LocalPhoto", null);
Context.Items["SetLocalPhotoLocation"] = true;
}
}
protected override string ExternalSkinFileName
{
get
{
return string.Format("/LocalPhotos/Skin-{0}.ascx", this.GetType().Name);
}
}
}
}
非常简单,唯一需要提一下的就是,ExternalSkinFileName的这个属性, 它指定了, 我们的CS控件从哪个文件夹下去找它的皮肤文件.
回到CS的WEB项目中Themes\default\Skins\建一个名为LocalPhotos的文件夹,注意这个文件夹的名称要和ExternalSkinFileName属性中的统一.
做好的准备工作,我们就要来写我们要的功能了,为了简单起见,我们就搞一个最简单的,用一个Repeater把我们在硬盘上搜索到的图片文件的文件名全显示出来,先不要去考虑什么数据库什么的,不然的话,可能先了N多的代码,就因为一个功能没有完成,你就得不到一次运行一下你程序的机会, 这是很郁闷的一件事情,很多时候,我们就会因此而半途而废了.
在LocalPhotos中新建一个Skin-PhotoAllList.ascx的文件
<%@ Control %>
<div class="CommonContentArea">
<div class="CommonContent">
<asp:Repeater ID="AllPhotoRepeater" runat="server">
<ItemTemplate>
<asp:Label ID="txtphypath" runat="server" /><br />
</ItemTemplate>
</asp:Repeater>
</div>
</div>
怎么样够简单吧, 就在里面另了一个名为AllPhotoRepeater的Repeater控件,在它的ItemTemplate中加一个名为txtphypath的子控件.完成了这个,又要回到我们自已的项目,为这个web用户控件写实现代码,也很简单,只是需要注意,这个类集成至我们的LocalPhotoTemplated,还有就是它的文件名必须和皮肤文件中Skin-PhotoAllList.ascx中的PhotoAllList统一,为什么这样,看一下我们LocalPhotoTemplated中的ExternalSkinFileName属性就明白了
using System;
using System.Collections.Generic;
using System.Web.UI.WebControls;
using Papersnake.LocalPhoto.Components;
namespace Papersnake.LocalPhoto.Controls
{
public class PhotoAllList : LocalPhotoTemplatedWebControl
{
private Repeater AllPhotoRepeater;//定义一个Repeater控件
public PhotoAllList()
{
}
protected override void OnLoad(EventArgs e)
{
if (!Page.IsPostBack)
this.DataBind();//在OnLoad中实现数据绑定
base.OnLoad(e);
}
//这个方法是用来绑定皮肤文件中定义的控件的
protected override void AttachChildControls()
{
AllPhotoRepeater = (Repeater)FindControl("AllPhotoRepeater");
AllPhotoRepeater.ItemDataBound += new RepeaterItemEventHandler(AllPhotoRepeater_ItemDataBound);
}
void AllPhotoRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
photo tphoto = e.Item.DataItem as photo;
if (tphoto == null)
return;
switch (e.Item.ItemType)
{
case ListItemType.Item:
case ListItemType.AlternatingItem:
Label txtphypath = (Label)e.Item.FindControl("txtphypath");
txtphypath.Text = e.Item.ItemIndex.ToString()+":"+tphoto.PhyPath;//把绑定的数据在Label中显示出来
break;
}
}
public override void DataBind()
{
base.DataBind();
BindData();
}
private void BindData()
{
AllPhotoRepeater.DataSource = Photos.GetAllPhotos();
AllPhotoRepeater.DataBind();
}
}
}
运行效果
非常简单的一个类,但是我们已经完成了开发CS插件的第一步,接下去我们要做的就只是进一步更细致的设计,以完成我们所需要的功能