Sugerencias para la aplicación de estilos a controles Silverlight comunes
Microsoft Expression Blend incluye numerosos controles de Microsoft Silverlight que puede usar para crear una fabulosa experiencia de usuario. También puede descargar los controles de orígenes de confianza.
Para obtener más información, vea Importar un control personalizado agregando una referencia.
Si encuentra un control cuya funcionalidad se ajusta a sus necesidades pero no tiene la apariencia que desea, y dicho control admite plantillas, puede modificar las plantillas del control para cambiar su apariencia.
Para facilitar la tarea, céntrese en el diseño dibujando todo primero en la mesa de trabajo con las herramientas de dibujo e importando imágenes y otros activos. Una vez que lo haya hecho, puede usar el comando Convertir en control para convertir sus objetos a una plantilla para cualquier control.
Enlace de plantillas
Los controles tienen propiedades a las que se pueden enlazar los objetos de una plantilla. Esto se denomina enlace de plantillas . El enlace de elementos de la plantilla a un control es una manera eficaz de crear parámetros para la plantilla. Por ejemplo, en lugar de expresar que "este Rectangle es azul", se indica que " Rectangle es del mismo color que Background en el control". Por lo tanto, al aplicar la plantilla a un control con distintas propiedades Background , el resultado es una plantilla de un color diferente.
Para enlazar una propiedad mediante plantilla, seleccione un objeto de una plantilla, haga clic en Opciones avanzadas en el panel Propiedades y, a continuación, elija una propiedad en Enlace de plantillas.
Algunas propiedades como OpacityMask , Font , FontSize , LayoutTransform y RenderTransform no tienen que estar enlazadas mediante plantilla. Se aplicarán a los objetos de las plantillas automáticamente.
Propiedades Content y Header
Varios controles contienen una propiedad Content ( Button , CheckBox y RadioButton , por ejemplo) o una propiedad Header ( TabItem y MenuItem ). Las propiedades Content y Header pueden usarse para mostrar contenido de cualquier tipo.
Para mostrar cualquier tipo de contenido
Si desea mostrar cualquier tipo de contenido (y no solo texto), necesitará un ContentPresenter en la plantilla con una propiedad Content (o Header ) que esté enlazada mediante plantilla a la propiedad Content (o Header ) del control. Si utiliza Crear en control para convertir ilustraciones en una plantilla, Expression Blend agrega un ContentPresenter a la plantilla. Si estaba usando un TextBlock para mostrar el contenido, elimine el TextBlock después de convertir la ilustración en un control. ContentPresenter mostrará el contenido que se mostró previamente en TextBlock .
Para mostrar texto
Si desea mostrar solo texto, puede utilizar TextBlock en lugar de ContentPresenter . Coloque TextBlock en la plantilla y, a continuación, enlace mediante plantilla la propiedad Text de TextBlock a la propiedad Content (o Header ) de Button . Si utiliza Crear en control para convertir ilustraciones en una plantilla y estaba usando un TextBlock para mostrar contenido, elimine el ContentPresenter que Expression Blend agregó a la plantilla. Al agregar texto a la propiedad Content (o Header ) de un control con este estilo aplicado, el TextBlock mostrará ese texto.
Convertir en ContentControl
Si utiliza Crear en control para convertir la ilustración que contiene un objeto TextBlock en una plantilla para un ContentControl (un botón, por ejemplo), Expression Blend realiza lo siguiente:
Coloca un ContentPresenter en la plantilla en lugar del TextBlock .
Copia las propiedades de Diseño de TextBlock a ContentPresenter .
Copia las propiedades de Typography de TextBlock al estilo del control.
Copia la propiedad Text de TextBlock a la instancia de la propiedad Content del control.
Convertir en TextBox
Si utiliza Crear en control para convertir la ilustración que contiene un objeto TextBlock en una plantilla para un TextBox , Expression Blend realiza lo siguiente:
Coloca un ScrollViewer que representa el elemento ContentElement en la plantilla en lugar del TextBlock .
Copia las propiedades de Diseño de TextBlock al elemento ContentElement .
Copia las propiedades de Typography de TextBlock al estilo TextBox .
Copia la propiedad Text de TextBlock a la instancia del control TextBox .
Estados visuales
Los estados visuales de un grupo de estados son mutuamente excluyentes. Sin embargo, los estados de un grupo son independientes de los estados de cualquier otro grupo. Esto significa que cualquier estado de cada uno de los grupos puede aplicarse en cualquier momento sin crear un conflicto.
Es habitual cambiar una propiedad de un objeto en más de un estado en el mismo grupo. Por ejemplo, puede cambiar la propiedad Fill de Rectangle en los estados MouseOver , Pressed y Disabled . Esto funciona porque cada vez solo se aplica un estado del grupo de estados CommonStates . Sin embargo, si se cambia la propiedad de un objeto en más de un grupo de estados se rompe la naturaleza independiente de los grupos de estados y se generan conflictos, ya que más de un estado intenta establecer la propiedad de un mismo objeto de manera simultánea. Expression Blend mostrará una advertencia cuando se detecte un conflicto de estados.
![]() |
---|
Cada nombre de estado debe ser único dentro de una plantilla, incluso de un grupo de estados a otro. |
Estado visual Normal
Cada grupo de estados tiene un estado predeterminado. Por ejemplo, el de CommonStates es Normal y el de CheckedStates es Unchecked . Se recomienda dejar el estado predeterminado sin cambios al modificar las propiedades de un objeto. Por ejemplo, en una casilla, la marca de verificación y los rectángulos de casilla están vacíos (ocultos) en Base y se muestran en Checked (en la marca de verificación) y Focused (en el rectángulo de casilla).
Conviene recordar que Base no es un estado. Por ese motivo, no se pueden definir ni controlar las transiciones a y desde Base . Por ejemplo, no se puede definir una transición de Base a MouseOver porque Base no es un estado. Base representa la plantilla en su formulario base, sin ningún estado aplicado. Los estados solo deben considerarse cuando se definen las transiciones.
Cuando cree sus propias plantillas de control, debería definir un estado normal en cada grupo de estados y establecer que el control se cargue con el estado normal como estado predeterminado. Si el control (por ejemplo, un Button ) no está en su estado normal cuando se carga, la transición (por ejemplo, del estado Normal al estado MouseOver ) no se ejecutará.
En esta sección
Sugerencias para la aplicación de estilos al control CheckBox
Sugerencias para la aplicación de estilos al control RadioButton
Sugerencias para la aplicación de estilos al control ScrollBar
Sugerencias para la aplicación de estilos al control ScrollViewer
Sugerencias para la aplicación de estilos al control ListBox
Sugerencias para la aplicación de estilos al control ComboBox
Sugerencias para la aplicación de estilos al control PasswordBox
Sugerencias para la aplicación de estilos al control TextBox
Vea también
Conceptos
Definir distintos estados visuales para un control
Aplicar estilos a los elementos de una plantilla de control de Silverlight
Aplicar estilos a un control que admite plantillas
Sugerencias para la aplicación de estilos a Simple Styles de WPF
Copyright © 2011 de Microsoft Corporation. Reservados todos los derechos.