模拟Asp.Net Forums实现可以换皮肤的控件（转载）-阿里云开发者社区

模拟Asp.Net Forums实现可以换皮肤的控件（转载）

2017-11-26 1077

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介：

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

第一步：新建ThemeDemo项目

第二步：添加基类SkinnedWebControl.cs

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;

namespace WebUC.ThemeDemo.Controls
{

 [
 ParseChildren( true)
 ]
 /// <summary>
 /// 换皮肤控件基类
 /// </summary>
 public abstract class SkinnedWebControl : WebControl, INamingContainer
 {

 string skinFilename = null;

 protected override void CreateChildControls()
 {
 Control skin;

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

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

 Controls.Add(skin);
 }

 /// <summary>
 /// 装载用户控件文件
 /// </summary>
 /// <returns></returns>
 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;
 }

 /// <summary>
 /// 初始化控件，并绑定控件数据
 /// </summary>
 /// <param name="skin"></param>
 protected abstract void InitializeSkin(Control skin);

 /// <summary>
 /// 用户控件文件路径
 /// </summary>
 public string SkinFilename
 {
 get { return skinFilename;}
 set { skinFilename = value; }
 }

 }
}

第三步：创建Themes目录，并创建两个用户控件文件Login.ascx和Login1.ascx。布局样式不同，但是都必须包含以下控件：
TextBox    Username
TextBox    Password
Button     LoginButton
Label      Result
Login.ascx

登陆页的默认皮肤样式
用户名：<asp:TextBox id="Username" runat="server"></asp:TextBox>
密码：<asp:TextBox id="Password" runat="server" TextMode="Password"/>
<asp:Button id="LoginButton" runat="server" Text="登陆"/>
<asp:Label id="Result" runat="server"/>

Login1.ascx

登陆页的皮肤样式1
用户名：<asp:TextBox id="Username" runat="server"/>
密码：<asp:TextBox id="Password" runat="server" TextMode="Password"/>
<asp:Button id="LoginButton" runat="server" Text="登陆"/><asp:Label id="Result" runat="server"/>

第四步：创建Login控件Login.cs

using System;
using System.Web;
using System.Web.UI.WebControls;

namespace WebUC.ThemeDemo.Controls
{
 /// <summary>
 /// 登陆控件，继承自SkinnedWebControl
 /// </summary>
 public class Login : SkinnedWebControl
 {
 string skinFilename = "Login.ascx"; // 指定默认皮肤样式
 TextBox username; // 帐号输入框
 TextBox password; // 密码输入框
 Button loginButton; // 登陆按钮
 Label result; // 显示登陆结果

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

 /// <summary>
 /// 重写InitializeSkin，初始化控件和对控件进行绑定
 /// </summary>
 /// <param name="skin"></param>
 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事件
 }

 /// <summary>
 /// 响应登陆按钮事件
 /// </summary>
 /// <param name="sender"></param>
 /// <param name="e"></param>
 public void LoginButton_Click(Object sender, EventArgs e)
 {
 if (username.Text == "demo" && password.Text == "demo")
 result.Text = "登陆成功！";
 else
 result.Text = "登陆失败，用户名密码不匹配！";
 }

 }
}

第五步：新建两个aspx页，分别把两种风格的登陆控件加入。
Login.aspx

<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>
<HTML>
 <HEAD>
  <title>换皮肤控件测试——默认皮肤</title>
 </HEAD>
 <body>
  <form runat="server">
    <uc:Login runat="server"/>
  </form>
 </body>
</HTML>

Login1.aspx

<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>
<HTML>
 <HEAD>
  <title>换皮肤控件测试——另一皮肤</title>
 </HEAD>
 <body>
  <form runat="server">
    <uc:Login runat="server"/>
  </form>
 </body>
</HTML>

最后，分别运行看看效果：）