自定義控件主題使用研究

  我們在使用Windows操作系統的時候，可以在桌面設置中通過主題來設定當前Windows的UI風格，現在在asp.net 2.0中也新增加了這一功能：主題/皮膚，例如：在我們的系統中，我們可以製作幾種樣式風格的主題，然後在web.config中，通過<pages>配置項的theme屬性來指定要使用的主題，您也可以對單個的頁面來進行主題的設定，同時也可以在程序中設定，這樣就可以保存並應用用戶自己選擇的主題了。
  對於asp.net 2.0中自帶的webControl都提供了主題的支持，那對於自定義的控件該如何來實現主題呢？
  其實很簡單，在要使用主題的屬性定義前面，添加屬性[Themeable(true)]，這樣，自定義控件的該屬性就能夠支持主題了。
  然後，在主題文件夾中，你可以爲該自定義控件單獨做一個skin文件，也可以在其他的skin文件中指定該自定義控件的屬性主題樣式等，但您需要在該skin文件中註冊該自定義控件，指定其所在程序集、名稱空間、標籤前綴等，就像我們在頁面中使用自定義控件一樣，但對於標籤前綴的命名不一定要和頁面中完全一樣。
  對於皮膚的使用同其他asp.net2.0自帶控件一樣，都是在skin文件中定義多個樣式，並設定其SkinId屬性，在頁面中可以指定該自定義控件的SkinId屬性來使用該皮膚，如果沒有指定SkinId，則該樣式爲主題的默認樣式。
如下面的樣例：
  這是一個用來刷新頁面的一個自定義的ImageButton，其好處是刷新當前頁，動作的觸發是在客戶端利用腳本來完成，不需要寫任何程序代碼：
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.ComponentModel;
using System.Drawing;
using System.Drawing.Design;
using System.IO;
using System.Reflection;
using System.Collections;
using System.Web.UI.Design;
using System.Web;
using System.Text;

namespace G3CustomControls
{
    public class RefreshButton:WebControl
    {
        protected override void Render(HtmlTextWriter writer)
        {
            writer.Write("<img src='" + ImageUrl.Replace("~/", "") + "' style='cursor:hand' onclick='window.location=window.location'>");
        }

        [DefaultValue(""), Themeable(true), Category("Appearance"), Description("RefreshButton_ImageUrl"), UrlProperty, Editor("System.Web.UI.Design.ImageUrlEditor, System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a", typeof(UITypeEditor)), Bindable(true)]
        public virtual string ImageUrl
        {
            get
            {
                string imageUrl = (string)this.ViewState["ImageUrl"];
                if (imageUrl != null)
                {
                    return imageUrl;
                }
                return string.Empty;
            }
            set
            {
                this.ViewState["ImageUrl"] = value;
            }
        }
    }
}

主題的Skin文件配置如下：
<%@ Register Assembly="G3CustomControls" Namespace="G3CustomControls" TagPrefix="cc1" %>
  <cc1:CloseButton runat="server" ImageUrl="~/App_Themes/Blue/images/button_Close.gif"></cc1:CloseButton>
  <cc1:RefreshButton runat="server" ImageUrl="~/App_Themes/Blue/images/button_Refresh.gif"></cc1:RefreshButton>
  <cc1:RefreshButton runat="server" SkinId= "RefreshButton2" ImageUrl="~/App_Themes/Blue/images/button_Refresh2.gif"></cc1:RefreshButton>

頁面中使用如下：
<%@ Register Assembly="G3CustomControls" Namespace="G3CustomControls" TagPrefix="cc1" %>

……
  <cc1:CloseButton runat="server"></cc1:CloseButton>
  <cc1:RefreshButton runat="server"></cc1:RefreshButton>

 其中頁面的TagPrefix和Skin的TagPrefix不一定要一樣。