Compartir a través de


Sugerencias para la aplicación de estilos al control TextBox para controles de Silverlight en Blend

JJ170878.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(es-es,VS.120).png

Puede utilizar la plantilla de control TextBox integrada para crear una plantilla TextBox personalizada. La apariencia predeterminada del control TextBox es la siguiente:

JJ170878.f77261da-feb5-4693-b764-582a9cc93c12(es-es,VS.120).png

Elementos de la plantilla TextBox

El control TextBox tiene un elemento: ContentElement. Este elemento es obligatorio.

SugerenciaSugerencia

Para ver los elementos de la plantilla, abra el panel Elementos al modificar la plantilla.

Estados del control TextBox

De forma predeterminada, el control TextBox puede estar en uno de los cuatro estados del grupo de estados CommonStates, que se pueden ver en el panel Estados al modificar una plantilla TextBox:

Nombre del estado

Descripción

Normal

Apariencia del control TextBox cuando no hay interacción con el control.

MouseOver

Apariencia del control TextBox cuando el usuario mueve el puntero sobre él.

ReadOnly

Apariencia del control TextBox cuando la propiedad IsReadOnly está establecida en True.

Disabled

Apariencia del control TextBox cuando la propiedad IsEnabled está establecida en False.

El control TextBox puede estar en alguno de los dos estados siguientes del grupo de estados FocusStates:

Nombre del estado

Descripción

Unfocused

Apariencia del control TextBox cuando no tiene el foco del teclado.

Focused

Apariencia del control TextBox cuando tiene el foco del teclado. Por ejemplo, un usuario puede presionar la tecla Tab para pasar de un objeto a otro en la aplicación hasta que el foco del teclado esté en el control TextBox.

El control TextBox puede estar en alguno de los tres estados siguientes del grupo de estados ValidationStates:

Nombre del estado

Descripción

Valid

Apariencia del control TextBox cuando es válido.

InvalidUnfocused

Apariencia del control TextBox cuando no es válido y no tiene el foco del teclado.

InvalidFocused

Apariencia del control TextBox cuando no es válido y tiene el foco del teclado.

SugerenciaSugerencia

Un grupo de estados contiene los estados visuales que forman parte de la misma categoría lógica y que no se pueden mostrar al mismo tiempo.Por ejemplo, el grupo CommonStates incluye estados relacionados con la interacción del usuario mediante un dispositivo de entrada como el mouse.Solo se puede mostrar un estado de este grupo de estados por vez, pero un estado de un grupo sí se puede mostrar al mismo tiempo que un estado de otro grupo de estados.

Al seleccionar un estado, se activa la grabación del estado y se grabarán todos los cambios que se realicen para dicho estado. Para desactivar la grabación del estado, haga clic en el **Indicador de modo de grabación **JJ170878.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(es-es,VS.120).png o seleccione Base en el panel Estados. Para modificar la apariencia del control cuando dos estados diferentes están activos, puede anclar una vista previa de un estado de un grupo de estados mientras modifica un estado de otro grupo de estados.

Enlace de plantillas

Puede enlazar mediante plantilla las propiedades Background, BorderBrush, Foreground, BorderThickness y Padding. Para obtener más información, vea Trasladar propiedades de objetos a la plantilla en Blend.

Para convertir objetos en un control TextBox

La imagen siguiente es un diseño integral de un TextBox:

TextBox

Este ejemplo utiliza el código XAML en el paso 2 del procedimiento siguiente, que se corresponde con el gráfico anterior para crear un cuadro de texto personalizado mediante la plantilla de control TextBox.

  1. Abra un nuevo proyecto de Microsoft Silverlight. En la Vista de código, busque el código siguiente y, a continuación, elimine la barra diagonal (/) de cierre.

    <Grid x:Name="LayoutRoot" Background="White"/>
    
  2. Copie y pegue el código siguiente en el nuevo proyecto, después del código que encontró en el paso 1.

    <Grid Height="20" Width="120">
    <Rectangle Fill="#FF333333" RadiusX="5" RadiusY="5"/>
    <TextBlock Margin="5,0" Foreground="White" Text="Lorem" VerticalAlignment="Center"/>
    </Grid>
    
  3. Agregue una etiqueta Grid de cierre (</Grid>) después del código que acaba de pegar.

  4. En el panel Objetos y escala de tiempo, haga clic con el botón secundario en Cuadrícula y, a continuación, haga clic en Crear en control. En el cuadro de diálogo Crear en control, haga clic en TextBox y, a continuación, haga clic en Aceptar.

  5. Compile el proyecto (Ctrl+Mayús+B) y, a continuación, presione F5 para probarlo.

Para obtener información acerca de cómo aplicar la nueva plantilla TextBox a otros objetos TextBox, vea Aplicar o quitar un recurso en Blend.

Referencias

Encontrará información detallada acerca de las propiedades y eventos del control TextBox de Silverlight en la página de controles y cuadros de diálogo de Silverlight en MSDN.

Vea también

Conceptos

Sugerencias para la aplicación de estilos a controles Silverlight comunes en Blend

Diseñar un control que admita plantillas en Blend

Dibujar texto en Blend