在日常項目開發中，我們會經常用到自定義控件，我們通過一個簡單的例子來說明，在日常項目中我們經常會用到圖片，或者圖片控件，我們以ImageButton為例來說明。
<asp:ImageButton ID="imgbtn" runat="server" ImageUrl="~/Images/Add.png" />
很多時候我們需要在很多頁面上放上面這段代碼，每次都要重復設置ImageUrl 當圖片路徑換了。或者圖片名稱換了，我們需要替換很多地方。有沒有更簡單的方法呢，使用自定義控件。在項目中我們經常使用一些添加 刪除，修改的按鈕圖片 來代替按鈕。我們以此為例來說明。
1、創建一個類庫項目，或者web控件庫項目都可以，添加一個類(Class)。繼承ImageButton
public class CustImageButton : ImageButton { }
2、我們在同一個項目中，一般使用的圖片大多是一樣的。比如添加 刪除，這些按鈕圖片。那么我們在定義一個枚舉 用於區分不同的圖片，我們定義了四種類型 添加 修改 查看 刪除
public enum CustImageType { Add, Edit, View, Delete }
3、定義一個屬性，用於設定 圖片的類型
[Bindable(true)] [Category("Appearance")] [DefaultValue(CustImageType.Add)] [Localizable(true)] public CustImageType ImageType { get { return ViewState["ImageType"] == null ? CustImageType.Add : (CustImageType)ViewState["ImageType"]; } set { ViewState["ImageType"] = value; } }
我們定義了一個自定義的屬性ImageType，類型是CustImageType枚舉類型。為了便於在控件的屬性窗口顯示，我們設置了幾個特性
[Bindable(true)] 指定成員是否通常用於綁定 [Category("Appearance")] 指定當屬性或事件顯示在一個設置為“按分類順序”模式的 System.Windows.Forms.PropertyGrid 控件中時，用於給屬性或事件分組的類別的名稱 [DefaultValue(CustImageType.Add)] 指定屬性的默認值 [Localizable(true)] 指定屬性是否應本地化
4、重寫ImageButton控件的Render方法
protected override void Render(HtmlTextWriter writer) { switch (ImageType) { case CustImageType.Add: this.ImageUrl = this.ResolveUrl("~/Images/Add.png"); break; case CustImageType.Edit: this.ImageUrl = this.ResolveUrl("~/Images/Edit.png"); break; case CustImageType.Delete: this.ImageUrl = this.ResolveUrl("~/Images/delete.png"); break; case CustImageType.View: this.ImageUrl = this.ResolveUrl("~/Images/View.png"); break; } base.Render(writer); }
在頁面中引用如下：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="WebDemo1.Index" %> <%@ Register Assembly="CustControl" Namespace="CustControl" TagPrefix="cc1" %> <!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 runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> <cc1:CustImageButton ID="CustImageButton1" ImageType="View" runat="server" /> </div> </form> </body> </html>
運行效果
換成如下代碼
<cc1:CustImageButton ID="CustImageButton1" ImageType="Edit" runat="server" />
顯示
可以看出 非常方便，只需要在屬性窗口設置 ImageType 就可以輕松實現圖片顯示。
但是這樣也有一個問題，我們使用的ImageUrl的路徑是我們web項目中的路徑，當我們的路徑改了，或者圖片換了，我們仍然需要重復的去修改程序，而且每次引用這個控件 我們都需要在web項目中添加對應路徑的圖片，非常麻煩，有木有更好的方法呢，當然 那就是使用嵌入的資源這是.NET2.0開始引入的。
我們在我們的控件項目中添加剛才用到的4張圖片。
選中其中一張圖片右鍵點擊屬性 把生成操作類型改成嵌入的資源
然后在我們的應用程序集文件中添加
添加如下代碼
[assembly: WebResource("CustControl.Images.Add.png", "img/png")] [assembly: WebResource("CustControl.Images.delete.png", "img/png")] [assembly: WebResource("CustControl.Images.Edit.png", "img/png")] [assembly: WebResource("CustControl.Images.View.png", "img/png")]
CustControl是命名空間，Images是文件夾名稱后面是圖片，用.分隔
接下來就是我們如何在程序中訪問這些圖片了。
.net提供了訪問web資源文件的類和方法，我們這地方使用
Page.ClientScript.GetWebResourceUrl
方法來訪問
所以我們修改Render方法中的代碼為：
protected override void Render(HtmlTextWriter writer) { switch (ImageType) { case CustImageType.Add: //Page.ClientScript.GetWebResourceUrl()獲取對程序集內資源的 URL 引用 this.ImageUrl = this.Page.ClientScript.GetWebResourceUrl(this.GetType(), "CustControl.Images.Add.png"); break; case CustImageType.Edit: this.ImageUrl = this.Page.ClientScript.GetWebResourceUrl(this.GetType(),"CustControl.Images.Edit.png"); break; case CustImageType.Delete: this.ImageUrl = this.Page.ClientScript.GetWebResourceUrl(this.GetType(),"CustControl.Images.delete.png"); break; case CustImageType.View: this.ImageUrl = this.Page.ClientScript.GetWebResourceUrl(this.GetType(),"CustControl.Images.View.png"); break; } base.Render(writer); }
在頁面不需要引入圖片 使用效果也是一樣。很方便吧，試試吧！
直接上代碼：