Cuando realizamos una aplicación WPF una gran ventaja que tenemos es la posibilidad de definir estilos para cualquier control. Un estilo es una serie de parejas propiedad/valor, que serán aplicadas a una serie de elementos, es decir podemos definir para cada propiedad de un control un valor que será el que se aplique. La idea es parecida a los CSS del desarrollo web. Esto te da las ventajas de :
- Reducir redundancia en tu código
- Cambiar la apariencia de los controles en un solo punto
- Poder cambiar el estilo de tus controles en tiempo de ejecución
Imaginemos que en nuestra aplicación queremos que todos los botones sean de fondo naranja, con letra italica , un margen determinado, bueno un estilo para un botón. La definición del estilo sería:
<Style x:Key="miBoton" TargetType="Button"> <Setter Property="Background" Value="Orange" /> <Setter Property="FontStyle" Value="Italic" /> <Setter Property="Padding" Value="8,4" /> <Setter Property="Margin" Value="4" /> </Style>
Los estilos se definen como recursos así que o van en la propia ventana en la sección Windows.Resources o en un diccionario de recursos que suele ser lo habitual y lo aconsejable.
Cuando queremos que botón aplique este estilo se lo debemos decir en la propiedad Style
<Button Style="{StaticResource myStyle}">Estilo Aplicado</Button>
Una caracteristica interesante de los estilos es que tienen herencia gracias a la propiedad del estilo BasedOn, si quiero otro estilo con la letra en negrita seria tan sencillo como
<Style x:Key="boldStyle" BasedOn="{StaticResource miBoton}" TargetType="Button"> <Setter Property="FontWeight" Value="Bold" /> </Style>
Además de customizar un control a través de sus propiedades, podemos reemplazarlo por algo completamente diferente, a través de un Control Template.
Cada control tiene un template por defecto , que le da la apariencia básica, el template esta definido en cada control en la Dependency Property Template . Con un Control Template podemos reemplazar totalmente el árbol visual de un control. Por ejemplo un Botón su árbol visual es el siguiente
Muchas veces podemos cambiar el Template a partir de un Stylo, modificando la propiedad Template, lo mejor con un ejemplo
<Style x:Key="CircularStyle" BasedOn="{StaticResource miBoton}" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Grid> <Ellipse Fill="{TemplateBinding Background}" Stroke="{TemplateBinding BorderBrush}"/> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style>
Si aplicamos el estilo
Como podéis observar ahora el botón, es circular
Para que veais un ejmplo mas completo os dejo el código de la aplicación de arriba y he añadido un Diccionario de Recursos que hace un checkbox como el de un IPhone
Cuando realizamos una aplicación WPF una gran ventaja que tenemos es la posibilidad de definir
Muy buenas las ilustraciones, son muy explicativas
Tengfo una dudaEntonces ¿que diferencia existe entre cambiar el aspecto de un control recurriendo a style o recurriendo al Template?
¿es que acaso con alguna de estas dos se pueden hacer cambios que con la otra no se pueden?
Gracias
En Style solo puedes cambiar propiedades que tenga el control y con Templates puedes cambiar todo el aspecto y el arbol visual del control como puedes ver con el checkbox