C#.NET应用主题的办法

时间:2023-01-29 15:29:24

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文件里
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Template.aspx.cs" Inherits="admin_Template" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>模板管理</title>
<script language="javascript" type="text/javascript">
    <!--
    function clickit() {
        var dom=document.all;
        var el=event.srcElement;
        if(el.tagName=="INPUT"&&el.type.toLowerCase()=="radio")
        {
                for(i=0;i<dom.length;i++)
                {
                        if(dom[i].tagName=="INPUT"&&dom[i].type.toLowerCase()=="radio")
                        {
                                dom[i].checked=false;
                        }
                }
        }
        el.checked=true;
}

   //-->
   </script>
</head>
<body>
<form id="f1" runat="server">
     <div class ="inner2">
      <asp:Repeater ID="Repeater1" runat="server">
            <ItemTemplate>
              <ul ><li>
                     <img src="../image/<%#DataBinder.Eval(Container.DataItem, "TemplateImage")%>"/><br />
                     <asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.TemplateName") %>'></asp:Label><br />
                     <asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.SetFolder") %>' Visible="false"></asp:Label>
                     <asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.CssName") %>' Visible="false"></asp:Label>
                     <asp:RadioButton ID="RadioButton1" runat="server" onclick="clickit();"/>
                     </li></ul>
            </ItemTemplate>
        </asp:Repeater>
         <div style ="text-align :center;"><asp:Button ID="SaveButton1" runat="server" Text="选好了,确定!" onclick="SaveButton1_Click"/></div><br />
        </div><br />
   </form>
</body>
</html>
2。aspx.cs文件里:
    //更换网站主题
using System.Data.SqlClient;
public partial class admin_Template : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

        if (Session["UserNm"] != null)
        {
            if (Session["UserNm"] != "")
            {

            }
            else
            {
                Response.Write("<script>alert('操作失败!没有登陆或者登陆超时');location.href='adminlogin.aspx';</script>");
            }
        }
        else
        {
            Response.Write("<script>alert('操作失败!没有登陆或者登陆超时');location.href='adminlogin.aspx';</script>");
        }
        if (!IsPostBack)
        {
            SqlConnection con = new SqlConnection("数据库连接语句,我就不写了");
            string sql1 = "select top 5 * from [Template] order by [Templateid] desc";
            SqlDataAdapter da1 = new SqlDataAdapter(sql1, con);
            DataSet ds1 = new DataSet();
            da1.Fill(ds1);
            Repeater1.DataSource = ds1;
            Repeater1.DataBind();
        }
    }
    protected void SaveButton1_Click(object sender, EventArgs e)
    {
        SqlConnection con = new SqlConnection("数据库连接语句,我就不写了");
        con.Open();
        int intI = 0;
        try
        {

            for (intI = 0; intI < this.Repeater1.Items.Count; intI++)
            {
                RadioButton itemCheck = (RadioButton)this.Repeater1.Items[intI].FindControl("RadioButton1");
                if (itemCheck.Checked)
                {
                    Label Label2 = (Label)this.Repeater1.Items[intI].FindControl("Label2");
                    Label Label3 = (Label)this.Repeater1.Items[intI].FindControl("Label3");
                    string sql = "Update user set Template='" + Label2.Text.ToString() + "',SelectCss='" + Label3.Text.ToString() + "' where id=" + '2';(注意!,如果是多用户的话这里的改成 where UserId=" + this.Session["UserId"].ToString();)                    SqlCommand cmd = new SqlCommand(sql, con);
                    cmd.ExecuteNonQuery();
                }
            }
        }
        catch (Exception ex)
        {
            throw new Exception(ex.Message);
        }
        Response.Write("<script>alert('操作成功!');location.href='Template.aspx';</script>");
        con.Close();
    }
}


看来我们得好好测试测试了!

3。在所有需要应用主题的页面的.aspx.cs文件里写上下面这个方法
    //实现更换皮肤效果
    protected void Page_PreInit(object sender, EventArgs e)
    {
        SqlConnection con1 =new SqlConnection("数据库连接语句,我就不写了");
        con1.Open();
        string sql2 = "select Template from [user] Where [id]=" + '2';(注意!,如果是多用户的话这里的改成 where UserId=" + this.Session["UserId"].ToString();)
        SqlDataAdapter Da = new SqlDataAdapter(sql2, con1);
        DataSet Ds = new DataSet();
        Da.Fill(Ds);
        DataTable dt = Ds.Tables[0];
        if (Ds.Tables[0].Rows.Count > 0)
        {
            Page.Theme = Ds.Tables[0].Rows[0][0].ToString();
        }
        else
        {
            Page.Theme = "default";
        }
 }