宝玉

专注于web开发技术
随笔 - 114, 评论 - 1517 , 引用 - 583

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

为了帮助您理解《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

  <P>登陆页的默认皮肤样式</P>
<P>用户名:<asp:TextBox id="Username" runat="server"></asp:TextBox></P>
<P>密  码:<asp:TextBox id="Password" runat="server" TextMode="Password"/></P>
<P><asp:Button id="LoginButton" runat="server" Text="登陆"/></P>
<P><asp:Label id="Result" runat="server"/></P>
Login1.ascx
  <P>登陆页的皮肤样式1</P>
用户名:<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 = "<font color='blue'>登陆成功!";
            else
                result.Text = "<font color='red'>登陆失败,用户名密码不匹配!";
        }

    }
}
 

第五步:新建两个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" SkinFilename="Login1.ascx"/>
  </form>
 </body>
</HTML>

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

源码下载

发表于 2004年5月28日 8:47

评论

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

呵呵。还是宝玉先做出来了。。公喜公喜!!!
2004-5-28 9:26 | aminic

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

难道还有谁在做么?
2004-5-28 9:29 | 宝玉

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我也做过点
aspxboy.com/forum/
只有一个皮肤
2004-5-28 14:39 | huobazi

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我这个很简单,只是为了辅助说明的:)
BTW:你的论坛写的挺不错的!
2004-5-28 14:56 | 宝玉

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我有一个笨办法,把皮肤的路径放到数据库中,用的时候再取出来加到指向中就行了,不过就是不太方便。
2004-5-31 8:21 | dgjunjie

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我做美工的,请问需要做些什么样的工作啊?
2004-7-9 13:36 | summer

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我做美工的,请问需要做些什么样的工作啊?
2004-7-9 13:36 | summer

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我做美工的,请问需要做些什么样的工作啊?
2004-7-9 13:36 | summer

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我做美工的,请问需要做些什么样的工作啊?
2004-7-9 13:36 | summer

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我意思是配合换皮肤,对前台美工有些什么要求?
2004-7-9 13:38 | summer

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

如果你会asp.net可以直接做成ascx,你做成html界面,然后我们转化成ascx:)
你可以看一下在themes目录下ascx文件
2004-7-9 14:27 | 宝玉

# 《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换

Ping Back来自:blog.csdn.net
2004-12-19 22:37 | cab

# 《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换

Ping Back来自:blog.csdn.net
2004-12-20 13:14 | 纯蓝流星

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

换肤原理非常棒,但是在多控件共用一个后台CS的地方,请宝玉回答一下,为什么不多个ascx公用一个ascx.cs文件呢?这样在IDE里,依然可以双点按扭直接切换到按扭事件,而且不用动态搜索控件或者填加事件很直观啊?
2005-1-12 0:49 | 灰灰

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

以我的理解,为什么不用多个ACCS共用一个*.ascx.cs呢,而单独写控件逻辑处理类?我想也有他的道理和好处
*.ascx.cs里,控件都是自动被protected声明了的,而不是通过FINDCONTROL的.事件也都是自动绑定的.而且还有一个关键问题是:传统的*.ascx里是强性指定了后台逻辑编码文件的路径----CodeBehind="header.ascx.cs",而文章里的ASCX无需知道CS文件位置,而CS知道动态调用的ASCX位置就可以了.逻辑分离的更彻底.
不知道宝玉老师认为我的理解对不对呢.
2005-1-12 0:52 | 灰灰

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

俺还是喜欢用一个后台CS文件。有多个skin就是增加几个usercontrol,无非处理逻辑都用一个。
改一下codeBehind不就行了。
2005-3-10 2:58 | yoyo

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

非常不错啊
2005-5-10 21:28 | try

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

用两个不同样式的.ascx文件工用一个.ascx.cs文件不是方便
不理解作者为什么费了那么大的劲全部写成控件
2005-5-20 23:14 | 含笑

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

好铁
2005-6-23 22:14 | 来客心动

# 《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换肤

Ping Back来自:blog.csdn.net
2005-8-14 13:28 | david8k

# 模拟Asp.Net Forums实现可以换皮肤的控件

Ping Back来自:blog.csdn.net
2005-8-14 16:29 | david8k

# ASP Forum2.0学习笔记之三---换肤的vb实现

Ping Back来自:blog.csdn.net
2005-8-17 11:56 | mint

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

这样就清楚多了.
2005-9-26 2:28 | 猪阿不猪

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

我直接将用户控件拉到aspx页面,会自动生成这样的代码<%@ Register TagPrefix="uc1" TagName="Login" Src="Themes/Login.ascx" %>,运行不成功,然后照着你的方式输入这段
<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %> 代码成功了,我想问一下两者的区别,谢谢了
2005-10-25 22:24 | 仁面寿星

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

研究了一下,对于刚刚的问题我已经弄清楚了,麻烦了。是我自己弄错意思了,总意味是用户控件去寻找CS代码,应该是CS代码去寻找用户控件。
呵呵,有个小提议,下次发贴能不能把原代下载放在页顶,呵呵,我一步步做下来,直到最后才看到源码下载
2005-10-25 22:37 | 仁面寿星

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

请教宝玉如何在BLOG上发布这种带代码源样式的贴子啊?比如你发的代码上的关键字可以自动识别的,是这个BLOG程序的关系的吗还是其它的方法,我自己也申请了一个BLOG就是不知道怎么发,谢谢!
2005-12-27 8:58 | 天使联盟

# Asp.Net Forums研究文章集合

Asp.Net Forums研究文章集合
2006-3-5 11:46 | H_J_H

# vs2005用户控件不能继承

为什么vs2005用户控件不能继承
2006-4-29 23:53 | ff

# vs2005用户控件不能继承

为什么vs2005用户控件不能继承
2006-4-29 23:54 | ff

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

假如我在前台皮肤里有这样子的绑定需要:<input id=TextBox_psd runat="server" value="<%#loginPSD%>" type=password size=12 name=TextBox_psd />,会报错说说 编译器错误信息: CS0103: 名称“loginPSD1”在类或命名空间“ASP.Login_Default_ascx”中不存在 ,像这样子的绑定是很常用的,请问有什么解决的方法 ?
2006-5-7 5:22 | jsking

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

GIDZYWOSDHGLKZXDHGBVXV,BEKSDGBVJKXS
2006-7-23 23:19 | chen

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

GIDZYWOSDHGLKZXDHGBVXV,BEKSDGBVJKXS
2006-7-23 23:19 | chen

# Asp.Net Forums研究文章集合

Asp.Net Forums研究文章集合
2006-11-29 17:40 | hanchi8008

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

非常好,很受益。
2006-12-2 4:30 | 早起的虫子

# 《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换皮肤的

《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换皮肤的
2007-1-17 9:37 | Glen_qiu

# Asp.Net Forums研究文章集合

Asp.Net Forums研究文章集合
2007-3-15 9:34 | 天纯蓝

# Asp.Net Forums研究文章集合(收藏)

Asp.Net Forums研究文章集合(收藏)Asp.Net Forums研究文章集合。========2005.10.18新添加==========CnForums研究文章集合。
2007-4-26 17:28 | 最后一个烟头

# Asp.Net Forums研究文章集合(收藏)

Asp.NetForums研究文章集合 Asp.NetForums是如何实现代码分离和换皮肤的http://www.cnblogs.com/dotey/archive/2004/05/28/1...
2007-6-2 13:02 | endif

# Asp.net Forums与Cnforums研究文章集合

2007-6-14 10:37 | sagacite

# ddd

Asp.NetForums研究文章集合 Asp.NetForums是如何实现代码分离和换皮肤的http://www.cnblogs.com/dotey/archive/2004/05/28/1...
2007-7-2 18:08 | mbskys

# (转)Asp.Net Forums研究文章集合(收藏)

Asp.NetForums是如何实现代码分离和换皮肤的http://www.cnblogs.com/dotey/archive/2004/05/28/11982.html模拟Asp.NetFor...
2007-8-15 21:34 | 面朝大海

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

招聘兼职翻译、同传译员和外籍英文校对人员,不知道是否有时间。
希望有机会合作.
郭先生
同传租赁 同声传译翻译公司 同声传译设备租赁 同声传译 同声传译设备租赁 同传租赁 北京同传设备租赁 上海同声传译设备租赁 同声传译 同声翻译公司
2007-8-21 1:32 | 在线翻译公司

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

<%@ Register TagPrefix="uc" Namespace="WebUC.ThemeDemo.Controls" Assembly="ThemeDemo" %>
<HTML>
<HEAD>
<title>换皮肤控件测试——另一皮肤</title>
</HEAD>
<body>
<form runat="server">
<uc:Login runat="server" SkinFilename="Login1.ascx"/>
</form>
</body>
</HTML>
2007-9-1 16:05 | oyun

# 《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换皮肤的

转贴:以便查看
《Asp.Net Forums2.0深入分析》之 Asp.Net Forums是如何实现代码分离和换皮肤的
在Visual Studio中开发Web项目,Web 窗体页由两部分组成:视觉元素(HTML、服务器控件和静态文本)和该页的编程逻辑。...
2007-11-22 21:47 | 网虫的BLOG

# 模拟Asp.Net Forums实现可以换皮肤的控件

转贴(作者宝玉,链接:http://webuc.net/dotey/archive/2004/05/28/835.aspx)
以便查看
模拟Asp.Net Forums实现可以换皮肤的控件
为了帮助您理解《Asp.Net...
2007-11-22 22:02 | 网虫的BLOG

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

l like dhis forum site thank u
2007-12-23 20:07 | sue oyunlari

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

yes it is very nice
2007-12-23 20:08 | barbie oyunlari

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

bedava mp3 download yap?nnnnnnnnnnnn
2008-1-4 16:01 | mp3 indir

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

thank you
2008-1-10 17:53 | automotive repair manual

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

It’s very good article. Great site with very good look and perfect information.
2008-1-15 9:03 | Mp3 player

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

Interesting article!
Thanks
2008-3-19 15:08 | Opony

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

Thanks for help, Keep up the good work.
2008-3-21 15:56 | Free Web Directories List

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

Keep up the good work.
2008-3-23 8:49 | Gry

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

可以在页面中加入<%@ Page " Theme="Button" %>
也可通过在 Web.config 中指定 <pages theme="..."/>都可以换皮肤
为什么还要动到.cs的文件?
2008-5-26 20:33 | 悠悠

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

Vallah ben bi?e anlamad?m
2008-8-30 16:53 | En Güzel Oyunlar

# re: 模拟Asp.Net Forums实现可以换皮肤的控件

thanks you ben cok güzel olmu?
2008-9-22 9:50 | oyunlar

Post Comment

主题  
姓名  
主页
校验码  
内容   
京ICP备 05050892号