伺服器控制項中的樣式
樣式決定了控制項的視覺外觀。如果您正在開發的控制項支援樣式是衍生自 System.Web.UI.WebControls.WebControl，它會將樣式公開為強型別 (Strongly Typed) 屬性 (例如 Font、Height、Width 等等)，並提供使用這些樣式屬性的方法。如需 ASP.NET 控制項樣式的概觀，請參閱 ASP.NET 快速入門 -> ASP.NET Web Form -> 套用樣式至控制項。
WebControl 類別提供了兩種方法以支援樣式：
- 公開型別 System.Web.UI.WebControl.Style 或 System.Web.UI.WebControl.Style 衍生型別的強型別樣式屬性。
- 將名稱/數值配對加入至 WebControl.Style 集合，以 HTML 屬性發出樣式。控制項開發人員不應該使用這個方法。這個方法是提供給控制項的使用者用來加入控制項不公開為強型別屬性的樣式。控制項的使用者可以利用程式設計或以宣告的方式來設定樣式，如 ASP.NET 快速入門 -> ASP.NET Web Form -> 套用樣式至控制項中所述。
公開強型別樣式屬性
Web 伺服器控制項 (衍生自 WebControl 的伺服器控制項) 會繼承 WebControl.ControlStyle 屬性，以決定控制項整體的型別樣式。ControlStyle 的型別是 Style，它是一個封裝有樣式相關功能的類別，如下列清單所述。
Style 的屬性有 Font、Height、Width、ForeColor、BackColor 以及其他對應至階層式樣式表的樣式。WebControl 會將這些樣式屬性公開為最上層的屬性，方法是委派 (Delegate) 至它的 ControlStyle 屬性的子屬性。
Style 會公開方法 (Style.AddAttributesToRender) 而將樣式呈現為 HtmlTextWriter 物件的屬性。如此可允許 WebControl 委派樣式呈現給它的 ControlStyle 屬性。
注意 當您覆寫 WebControl 的 Render 方法時，您必須確定已保留由 WebControl 提供的基底呈現功能。例如，當您覆寫 Render 方法以直接呼叫 HtmlTextWriter 執行個體上的 Write 方法時，即喪失了 WebControl 內建的樣式呈現功能。如需覆寫 Render 建議方法的範例資訊，請參閱呈現伺服器控制項範例。
Style 提供了複製 (Style.CopyFrom) 和合併 (Style.MergeWith) 樣式的方法。如需使用這些方法的範例資訊，請參閱樣板化的資料繫結控制項範例。
Style 會實作 IStateManager 介面，以提供狀態管理功能，而允許控制項將狀態管理委派給它的樣式屬性。由於 Style 是屬於 IStateManager 合約的一部份，它會實作這些方法，例如 LoadViewState、SaveViewState 和 TrackViewState。Style 也具有一個多載建構函式 (Constructor)，可取得 StateBag 型別作為一個引數。WebControl 會將 ViewState 傳遞給 Style 建構函式以建立 ControlStyle，使它的控制項樣式可存取它的檢視狀態。如需如何將自訂狀態管理委派給控制項樣式屬性的範例資訊，請參閱樣板化的資料繫結控制項範例。
雖然 ControlStyle 屬性的預設型別是 Style，Web 伺服器控制項仍可以覆寫 WebControl.CreateControlStyle 方法，而將它的控制項樣式設定為衍生自 Style 的任何類別，如下列範例所示。
protected override Style CreateControlStyle()
{
// Note that the constructor of Style takes ViewState as an
// argument.
TableStyle style = new TableStyle(ViewState);
// Set up default initial state.
style.CellSpacing = 0;
return style;
}
[Visual Basic]
Protected Overrides Function CreateControlStyle() As Style
' Note that the constructor of Style takes ViewState as an
' argument.
Dim style As New TableStyle(ViewState)
' Set up default initial state.
style.CellSpacing = 0
Return style
End Function
除了基底 Style 型別以外，System.Web.UI.WebControls 命名空間 (Namespace) 也提供其他的樣式型別，例如 TableStyle 和 TableItemStyle。您可以由 Style (或從衍生自 Style 的類別) 衍生以及覆寫並加入成員，來定義額外的強型別樣式。和 WebControl 會將 Style 的子屬性公開為最上層屬性一樣，您也可以將自訂樣式型別的子屬性公開為最上層屬性。例如，Table 會將它的 ControlStyle 設定為 TableStyle 並將 TableStyle 的子屬性 (如 CellPadding、CellSpacing 和 Gridlines) 公開為最上層屬性。下列的程式碼片段是取材自樣板化的資料繫結控制項範例，說明 TemplatedList 自訂控制項如何將 ControlStyle 的 CellPadding 子屬性公開為最上層屬性。
public virtual int CellPadding {
get {
if (ControlStyleCreated == false) {
return -1;
}
return ((TableStyle)ControlStyle).CellPadding;
}
set {
((TableStyle)ControlStyle).CellPadding = value;
}
}
[Visual Basic]
Public Overridable Property CellPadding() As Integer
Get
If ControlStyleCreated = False Then
Return - 1
End If
Return CType(ControlStyle, TableStyle).CellPadding
End Get
Set
CType(ControlStyle, TableStyle).CellPadding = value
End Set
End Property
下列 WebControl 方法允許控制項的使用者變更控制項的 ControlStyle。
- WebControl.ApplyStyle 方法將指定的樣式複製給 ControlStyle 並覆寫現有的項目。
- WebControl.MergeStyle 方法將指定的樣式和 ControlStyle 合併，而不需覆寫現有的項目。
如需使用這些方法的範例資訊，請參閱樣板化的資料繫結控制項範例。
公開子控制項的額外樣式屬性
雖然 ControlStyle 屬性決定了 Web 伺服器控制項的整體樣式，但是複合 Web 伺服器控制項 (擁有子控制項的控制項) 也可以公開套用至其子控制項的額外樣式屬性。控制項必須實作自訂狀態管理以保留這些在用戶端往返的額外樣式。下列清單將說明提供這類額外樣式的主要步驟。
若要公開子控制項的樣式
定義一或多個衍生自 Style 的屬性。樣板化的資料繫結控制項範例中所述的自訂控制項
TemplatedList將公開額外的樣式，如下列程式碼片段所示。請注意在這個範例中，當建立新的 Style 物件後，控制項的 ViewState 尚未傳遞給 Style 建構函式。控制項的 ViewState 只能在建立控制項的 ControlStyle 屬性時才能傳遞給 Style 建構函式，且不可以是型別 Style 的其他屬性。同時也請注意控制項會將檢視狀態追蹤 (Tracking) 委派給style屬性本身。public virtual TableItemStyle AlternatingItemStyle { get { if (alternatingItemStyle == null) { alternatingItemStyle = new TableItemStyle(); if (IsTrackingViewState) ((IStateManager)alternatingItemStyle).TrackViewState(); } return alternatingItemStyle; } } [Visual Basic] Public Overridable ReadOnly Property AlternatingItemStyle() As TableItemStyle Get If _alternatingItemStyle Is Nothing Then _alternatingItemStyle = New TableItemStyle() If IsTrackingViewState Then CType(_alternatingItemStyle, IStateManager).TrackViewState() End If End If Return _alternatingItemStyle End Get End Property將樣式套用至子控制項。如需範例資訊，請參閱樣板化的資料繫結控制項範例中的
PrepareControlHierarchy方法，其中也會說明如何合併樣式。您應該在呈現階段將樣式套用至子控制項，如範例中所示，如此它們才不會保存於檢視狀態中。覆寫 SaveViewState 方法以將額外的樣式屬性儲存於 ViewState。因為 Style 物件會管理它們本身的狀態，所以控制項必須在它的 Style 屬性上叫用 (Invoke) SaveViewState，以取得必須要加入至 ViewState 屬性的物件。下列範例是取材自樣板化的資料繫結控制項範例，說明控制項如何將自訂狀態管理委派給它的樣式屬性。
protected override object SaveViewState() { // Customized state management to handle saving // state of contained objects such as styles. object baseState = base.SaveViewState(); object itemStyleState = (itemStyle != null) ? ((IStateManager)itemStyle).SaveViewState() : null; object selectedItemStyleState = (selectedItemStyle != null) ? ((IStateManager)selectedItemStyle).SaveViewState() : null; object alternatingItemStyleState = (alternatingItemStyle != null) ? ((IStateManager)alternatingItemStyle).SaveViewState() : null; object[] myState = new object[4]; myState[0] = baseState; myState[1] = itemStyleState; myState[2] = selectedItemStyleState; myState[3] = alternatingItemStyleState; return myState; } [Visual Basic] Protected Overrides Function SaveViewState() As Object ' Customized state management to handle saving ' state of contained objects such as styles. Dim baseState As Object = MyBase.SaveViewState() Dim itemStyleState As Object Dim selectedItemStyleState As Object Dim alternatingItemStyleState As Object If Not (_itemStyle Is Nothing) Then itemStyleState = CType(_itemStyle, IStateManager).SaveViewState() Else itemStyleState = Nothing End If If Not (_selectedItemStyle Is Nothing) Then selectedItemStyleState = CType(_selectedItemStyle, IStateManager).SaveViewState() Else selectedItemStyleState = Nothing End If If Not (_alternatingItemStyle Is Nothing) Then alternatingItemStyleState = CType(_alternatingItemStyle, IStateManager).SaveViewState() Else alternatingItemStyleState = Nothing End If Dim myState(4) As Object myState(0) = baseState myState(1) = itemStyleState myState(2) = selectedItemStyleState myState(3) = alternatingItemStyleState Return myState End Function覆寫 LoadViewState 方法以自訂額外樣式屬性從 ViewState 的狀態還原。已加入 ViewState 的額外物件必須以加入時的相同順序取出。下列範例是取材自樣板化的資料繫結控制項範例，說明控制項如何將自訂狀態還原委派給它的樣式屬性。
protected override void LoadViewState(object savedState) { // Customized state management to handle // state restoration of contained objects. if (savedState != null) { object[] myState = (object[])savedState; if (myState[0] != null) base.LoadViewState(myState[0]); if (myState[1] != null) ((IStateManager)ItemStyle).LoadViewState(myState[1]); if (myState[2] != null) ((IStateManager)SelectedItemStyle).LoadViewState(myState[2]); if (myState[3] != null) ((IStateManager)AlternatingItemStyle).LoadViewState(myState[3]); } } [Visual Basic] Protected Overrides Sub LoadViewState(savedState As Object) ' Customized state management to handle saving ' state of contained objects. If Not (savedState Is Nothing) Then Dim myState As Object() = CType(savedState, Object()) If Not (myState(0) Is Nothing) Then MyBase.LoadViewState(myState(0)) End If If Not (myState(1) Is Nothing) Then CType(ItemStyle, IStateManager).LoadViewState(myState(1)) End If If Not (myState(2) Is Nothing) Then CType(SelectedItemStyle, IStateManager).LoadViewState(myState(2)) End If If Not (myState(3) Is Nothing) Then CType(AlternatingItemStyle, IStateManager).LoadViewState(myState(3)) End If End If End Sub
如需控制項公開已套用至其子控制項的樣式屬性範例，請參閱樣板化的資料繫結控制項範例。