Estilos de los controles de servidor
Los estilos determinan la apariencia visual de un control. Si va a desarrollar un control que admita estilos, derívelo de la clase System.Web.UI.WebControls.WebControl, que expone los estilos como propiedades con establecimiento inflexible de tipos (como Font, Height, Width, etcétera) y cuenta con métodos para trabajar con propiedades de estilo. Para obtener información general de los estilos de los controles ASP.NET, vea Tutorial rápido de ASP.NET —> Formularios Web Forms ASP.NET —> Aplicar estilos a los controles.
La clase WebControl ofrece dos técnicas para el uso de estilos:
- Exponer propiedades con establecimiento inflexible de tipos de la clase System.Web.UI.WebControl.Style o de otras clases derivadas de ésta.
- Agregar pares de nombre y valor a la colección WebControl.Style para crear estilos como atributos HTML. Los programadores de controles no deben usar esta técnica. Su objetivo es que los usuarios de los controles puedan agregar estilos que el control no expondrá como propiedades con establecimiento inflexible de tipos. El usuario de un control puede establecer los estilos de este modo tanto mediante programación como de forma declarativa, según se describe en Tutorial rápido de ASP.NET —> Formularios Web Forms ASP.NET —> Aplicar estilos a los controles.
Exponer propiedades de estilo con establecimiento inflexible de tipos
Un control de servidor Web (un control de servidor derivado de WebControl) hereda la propiedad WebControl.ControlStyle, que determina el estilo con establecimiento inflexible de tipos para el control como un todo. El tipo de ControlStyle es Style, que es una clase que encapsula la funcionalidad relacionada con el estilo, como se describe en la lista siguiente.
Style tiene propiedades como Font, Height, Width, ForeColor, BackColor y otras, que corresponden a estilos de hoja de estilos en cascada. WebControl expone estas propiedades de estilo como propiedades de máximo nivel al delegar en subpropiedades su propiedad ControlStyle.
Style expone un método (Style.AddAttributesToRender) para procesar los estilos como atributos de un objeto HtmlTextWriter. De este modo, permite a WebControl delegar el procesamiento de los estilos en su propiedad ControlStyle.
Nota Cuando reemplace el método Render de WebControl, deberá asegurarse de conservar la funcionalidad de procesamiento básica que ofrece WebControl. Por ejemplo, si reemplaza el método Render para llamar directamente al método Write de la instancia HtmlTextWriter, perderá la funcionalidad de procesamiento de estilos integrada en WebControl. En Ejemplos de procesamiento de un control de servidor encontrará un ejemplo de la técnica recomendada para reemplazar el método Render.
Style proporciona métodos para copiar (Style.CopyFrom) y combinar (Style.MergeWith) estilos. En Ejemplo de control enlazado a datos a partir de plantillas encontrará un ejemplo en el que se utilizan estos métodos.
Style implementa la interfaz IStateManager, que proporciona funciones de administración del estado, lo que permite a un control delegar esta tarea en sus propiedades de estilo. Como parte del contrato IStateManager, Style implementa métodos como LoadViewState, SaveViewState y TrackViewState. Style también cuenta con un constructor sobrecargado que acepta el tipo StateBag como argumento. WebControl crea ControlStyle al pasar ViewState al constructor Style, lo que permite al estilo del control tener acceso al estado de vista. En Ejemplo de control enlazado a datos a partir de plantillas encontrará un ejemplo de cómo delegar la administración personalizada del estado en las propiedades de estilo de un control.
Aunque el tipo predeterminado de la propiedad ControlStyle es Style, un control de servidor Web puede establecer como estilo cualquier clase derivada de Style; para ello, basta con reemplazar el método WebControl.CreateControlStyle, como se muestra en el ejemplo siguiente.
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
Además del tipo base Style, el espacio de nombres System.Web.UI.WebControls proporciona otros tipos de estilo, como TableStyle y TableItemStyle. Puede definir estilos adicionales con establecimiento inflexible de tipos si los deriva de Style (o de una clase derivada de Style) y reemplaza o agrega miembros. De la misma forma que WebControl expone subpropiedades de Style como propiedades de máximo nivel, también es posible exponer subpropiedades de un tipo de estilo personalizado como propiedades de máximo nivel. Por ejemplo, Table establece TableStyle en su propiedad ControlStyle y expone las subpropiedades de TableStyle, por ejemplo CellPadding, CellSpacing y Gridlines, como propiedades de máximo nivel. En el fragmento de código siguiente extraído de Ejemplo de control enlazado a datos a partir de plantillas se muestra el modo en que el control personalizado TemplatedList expone la subpropiedad CellPadding de su ControlStyle como propiedad de máximo nivel.
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
Los métodos de WebControl siguientes permiten al usuario de un control alterar su ControlStyle.
- El método WebControl.ApplyStyle copia el estilo especificado a la propiedad ControlStyle y sobrescribe los elementos existentes.
- El método WebControl.MergeStyle combina el estilo especificado con ControlStyle, sin sobrescribir los elementos existentes.
En Ejemplo de control enlazado a datos a partir de plantillas encontrará ejemplos del uso de estos métodos.
Exponer propiedades de estilo adicionales para los controles secundarios
Aunque la propiedad ControlStyle determina el estilo general de un control de servidor Web, un control de servidor Web compuesto (que tiene controles secundarios) puede exponer propiedades de estilo adicionales que se aplican a sus controles secundarios. El control debe implementar una administración personalizada del estado para conservar los estilos adicionales entre los viajes de ida y vuelta hacia el cliente. En la lista siguiente se describen los pasos principales para proporcionar los estilos adicionales.
Para exponer los estilos de los controles secundarios
Defina una o varias propiedades derivadas de Style. El control personalizado
TemplatedList,descrito en el Ejemplo de control enlazado a datos a partir de plantillas, expone estilos adicionales, como se muestra en el siguiente fragmento de código. Observe que, en este caso, cuando se crea un objeto Style nuevo no se pasa la propiedad ViewState del control al constructor del objeto Style. La propiedad ViewState del control sólo se pasa al constructor del objeto Style cuando se crea la propiedad ControlStyle de un control y no cuando se crea cualquier otra propiedad de tipo Style. Observe también que el control delega el seguimiento del estado de vista en la propia propiedad de estilo.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 PropertyAplique estilos a los controles secundarios. Para obtener un ejemplo, vea el método
PrepareControlHierarchyen Ejemplo de control enlazado a datos a partir de plantillas, en el que también se muestra cómo combinar estilos. Los estilos de los controles secundarios deben aplicarse en la fase de procesamiento, como se indica en el ejemplo, para que no se conserven en el estado de vistaReemplace el método SaveViewState para guardar las propiedades de estilo adicionales en ViewState. Los objetos Style administran su propio estado y, por ello, el control deberá invocar a SaveViewState para sus propiedades de estilo con el fin de obtener los objetos que hay que agregar a la propiedad ViewState. En el ejemplo siguiente extraído de Ejemplo de control enlazado a datos a partir de plantillas se muestra la forma en que un control delega la administración personalizada del estado en sus propiedades de estilo.
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 FunctionReemplace el método LoadViewState para personalizar la restauración de las propiedades de estilo adicionales a partir de ViewState. Los objetos adicionales agregados a ViewState deben obtenerse ahora en el mismo orden en que se agregaron. En el ejemplo siguiente extraído de Ejemplo de control enlazado a datos a partir de plantillas se muestra la forma en que un control delega la restauración personalizada del estado en sus propiedades de estilo.
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
Para consultar un ejemplo de control que expone las propiedades de estilo aplicadas a sus controles secundarios, vea Ejemplo de control enlazado a datos a partir de plantillas.