asp.net新特性theme的使用和介绍!

来源:互联网 发布:汽车价格 知乎 编辑:程序博客网 时间:2024/05/01 10:10

应用主题的办法办法      

       1。全局主题:在Web.config中<system.web>中添加<pages StyleSheetTheme ="ThemeName"/>节,这样在整个应用中都会自动应用名为ThemeName 的主题

       2。页面主题:在ASPX文件顶部加入:<%@ Page Language="C#" StylesheetTheme=" ThemeName " %>,这样当前页面都会应用名为ThemeName 的主题,或者在ASPX_CS中加(Page_Load方法)入如下代码 Page. StyleSheetTheme = “ThemeName”; 

       3。角色主题:需要使用masterpage 来辅助实现 ,通过User.IsInRole(“RoleName”) 来判断用户是否属于某个角色,然后决定使用何种主题(Page. StyleSheetTheme = “ThemeName”);当然,使用这种办法还可以应用用户选择的主题 。


       4。给某个控件应用特定的样式,那么需要设置控件的SkinId属性,然后在skinid中填写我们在skin文件里定义好的样式的skinid就ok了!如果你不希望某个控件应用theme的样式,你只需设置Label的EnableTheming属性为false的时候就可以了。


 5。theme中包含CSS:

  theme中也可以使用.css文件,当你把.css文件放在1个theme目录下后,在用到了这个theme的页面中自动会应用你的.css的


一般引用主题和皮肤的方式主要有这两种:stylesheettheme和theme他们用法差不多,就是执行的优先级不一样:

1在页面上定义theme时:页面只使用theme的主题样式,不会使用页面上的用户再定义的样式。
2当定义了stylesheettheme时,页面先加载stylesheettheme属性中的样式,再合并页面上的样式,如果有一样的样式定义,就取页面中的样式。
3两种皆有会先加载stylesheettheme的样式,再加载页面中的样式,再加载theme中的样式,如果有一样的样式,则后面的样式覆盖前面加载的样式。
 

工作原理

    不同的主题和皮肤之间的不同主要是页面和页面中的控件的样式(包括字体、段落、背景、边框等等)、部分图片的不同。

    传统的完全使用CSS来表现不同的主题的方案,在处理图片和图片按钮的地方往往心有余而力不足。而在aspnet2.0里面一切都已经变得简单。

    主题和皮肤是 dotnet framework2.0内建支持的,服务器控件添加了SkinId属性,Page类也添加了Theme 和 StyleSheetTheme 属性,其目的就是优雅的支持Skin。在应用指定了主题之后,相关的页面会自动链接位于主题目录下的css文件和skin文件,css的用法跟传统的用法没有什么区别,而skin文件则以一种类似于css的方式工作,指定了SkinId的服务器控件会自动从skin文件中加载并附加匹配的属性或样式(最常用的是Image 和ImageButton的ImageUrl属性,这样做可以使页面在不同的主题下)---这是在服务器端完成的。由于skin文件在使用后是缓存在内存中的,所以效率不会有问题。


后台代码轻松为网站换府肤

  前面讲的都是在aspx文件或web.config中应用theme,而在blog这样的每个用户都有不同的skin的网站中用上面的方法来实现换skin显然是不方便的。

  下面就介绍怎么在后台代码中动态的引用theme来解决上面的情况,theme必须在page被请求的最早期就应用上,所以我们必须在Page_PreInit事件中写代码,代码很简单,就1句:

Page.Theme = "...";

  这里我们只要从数据库中去读取每个用户设置的不同theme名就可以轻松实现每个用户都有不同的skin了。

下面我是我自己写的一个例子
首先创建一个app_themes文件夹
然后再下面创建两个主题 blue,red 其实就是两个文件夹
然后我们就可以分别在不同的主题下面创建不.skin文件或者.css样式
在这里我只定义了分别定义了一个skin的文件,里面具体怎么定义大家自己去发挥了!只要别把两个主题定义的一样就ok了呵呵!~

好了,现在我们就来实现在后台控制主题
1。aspx文件里
<asp:DropDownList ID="drdlstColorList" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drdlstColorList_SelectedIndexChanged"
                        Width="116px" meta:resourcekey="drdlstColorListResource1">
                        <asp:ListItem Value=" " meta:resourcekey="ListItemResource1" Text="默认"></asp:ListItem>
                        <asp:ListItem Value="red" meta:resourcekey="ListItemResource2" Text="红色海洋"></asp:ListItem>
                        <asp:ListItem Value="blue" meta:resourcekey="ListItemResource3" Text="蓝色海洋"></asp:ListItem>
                    </asp:DropDownList>
2。aspx.cs文件里:
    //更换网站主题
    protected void drdlstColorList_SelectedIndexChanged(object sender, EventArgs e)
    {
        AccessPublicClass apc = new AccessPublicClass();
        string color = drdlstColorList.SelectedValue.ToString();
        string strSql = "update CMS_Theme set ThemeName='" + color + "' where ThemeId=1";
        bool result = apc.ExeSQL(strSql);
        if (result == false)
        {
            Response.Write("<script language=javascript>alert('更换失败,请重新操作!')</script>");
        }
    }
这里是在数据库中建了一张表,其实我想过用session存起来比较好,因为大家都在浏览,一也换,我也换,数据库在不停变更,
如果存在session里虽然每次上线样式都变成默认的了,但是起码不会象数据库,好象会混乱一样,呵呵!
看来这个问题要去好好测试测试了!现在就先这样吧
然后

 
3。在所有需要应用主题的页面的.aspx.cs文件里写上下面这个方法
    //实现更换皮肤效果
    protected void Page_PreInit(object sender, System.EventArgs e)
    {
        AccessPublicClass apc = new AccessPublicClass();
        string strSql = "select ThemeName from CMS_Theme where ThemeId=1";
        DataSet ds = apc.ReturnDataSet(strSql);

        // 动态修改Page的Theme要在Page_PreInit方法中实现
        if (ds.Tables[0].Rows.Count > 0)
        {
            Page.Theme = ds.Tables[0].Rows[0][0].ToString();
        }
        else
        {
            Page.Theme = "";
        }
    }

这里大家我知道我做的是后台管理里可以更换主题,所以不存在前面所说的数据库混乱,呵呵!刚才没想到,就这样了!

 

原创粉丝点击