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

應用主題的辦法辦法      

       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 = "";
        }
    }

這裏大家我知道我做的是後臺管理裏可以更換主題,所以不存在前面所說的數據庫混亂,呵呵!剛纔沒想到,就這樣了!

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章