Go homepage(回首页)
Upload pictures (上传图片)
Write articles (发文字帖)

The author:(作者)delv
published in(发表于) 2014/1/16 9:34:05
模拟Asp.Net,Forums实现可以换皮肤的控件_[Asp.Net教程]

模拟Asp.Net Forums实现可以换皮肤的控件_[Asp.Net教程]

为了帮助您理解《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换皮肤的,现在我们一起来写一个代码分离带换皮肤功能的登陆页面:


第一步:新建ThemeDemo项目


第二步:添加基类SkinnedWebControl.cs
复制C#代码保存代码using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;



namespace WebUC.ThemeDemo.Controls
{


[
ParseChildren(true)
]
///


/// 换皮肤控件基类
///

public abstract class SkinnedWebControl : WebControl, INamingContainer
{


string skinFilename = null;



protected override void CreateChildControls()
{
Control skin;


// 装载用户控件文件
skin = LoadSkin();


// 初始化控件和对控件绑定
InitializeSkin(skin);


Controls.Add(skin);
}



///


/// 装载用户控件文件
///

///
protected Control LoadSkin()
{
Control skin;


// 用户控件文件默认放在Themes目录下
string skinPath = "Themes/" + SkinFilename;


// 是否定义了用户控件文件?
if (SkinFilename == null)
throw new Exception("必须定义SkinFilename属性,指定用户控件文件路径");


// 通过Page.LoadControl(defaultSkinPath)方法,从用户控件文件中获取 UserControl 对象
try
{
skin = Page.LoadControl(skinPath);
}
catch (FileNotFoundException)
{
throw new Exception("用户控件文件未找到!");
}


return skin;
}



///


/// 初始化控件,并绑定控件数据
///

///
protected abstract void InitializeSkin(Control skin);


///


/// 用户控件文件路径
///

public string SkinFilename
{
get { return skinFilename; }
set { skinFilename = value; }
}


}
}
第三步:创建Themes目录,并创建两个用户控件文件Login.ascx和Login1.ascx。布局样式不同,但是都必须包含以下控件:
TextBox Username
TextBox Password
Button LoginButton
Label Result
Login.ascx
阅读代码编辑代码运行效果复制HTML代码保存代码

登陆页的默认皮肤样式


用户名:


密 码:



登陆页的默认皮肤样式


用户名:


密 码:




Login1.ascx
阅读代码编辑代码运行效果复制HTML代码保存代码

登陆页的皮肤样式1


用户名:
密 码:

登陆页的皮肤样式1


用户名:
密 码:

第四步:创建Login控件Login.cs
复制C#代码保存代码using System;
using System.Web;
using System.Web.UI.WebControls;


namespace WebUC.ThemeDemo.Controls
{
///


/// 登陆控件,继承自SkinnedWebControl
///

public class Login : SkinnedWebControl
{
string skinFilename = "Login.ascx"; // 指定默认皮肤样式
TextBox username; // 帐号输入框
TextBox password; // 密码输入框
Button loginButton; // 登陆按钮
Label result; // 显示登陆结果


public Login()
{
if (SkinFilename == null)
SkinFilename = skinFilename;
}


///


/// 重写InitializeSkin,初始化控件和对控件进行绑定
///

///
protected override void InitializeSkin(System.Web.UI.Control skin)
{
// 查找ascx页中ID是username的textbox控件
username = (TextBox) skin.FindControl("Username");
// 绑定数据
username.Text = "demo";


// 查找ascx页中ID是password的textbox控件
password = (TextBox) skin.FindControl("Password");
// 绑定数据
password.Attributes.Add("value", "demo");


// 初始化Result控件
result = (Label) skin.FindControl("Result");


// 找到登陆按钮
loginButton = (Button) skin.FindControl("LoginButton");
loginButton.Click += new System.EventHandler(LoginButton_Click); // 绑定登陆按钮的Click事件
}


///


/// 响应登陆按钮事件
///

///
///
public void LoginButton_Click(Object sender, EventArgs e)
{
if (username.Text == "demo" && password.Text == "demo")
result.Text = "登陆成功!";
else
result.Text = "登陆失败,用户名密码不匹配!";
}


}
}
第五步:新建两个aspx页,分别把两种风格的登陆控件加入。
Login.aspx
复制ASPX代码保存代码<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>


换皮肤控件测试——默认皮肤






<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>


换皮肤控件测试——默认皮肤







Login1.aspx
复制ASPX代码保存代码<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>


换皮肤控件测试——另一皮肤





<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>


换皮肤控件测试——另一皮肤







最后,分别运行看看效果:)








源代码下载
http://webuc.net/download/ThemeDemo.rar

来源: 阿良.NET







If you have any requirements, please contact webmaster。(如果有什么要求,请联系站长)





QQ:154298438
QQ:417480759