Sugerencias para la aplicación de estilos al control ListBox

Ee371162.0b2c798e-86c6-4ea2-a8a6-5cf1f12be1e2(ES-ES,Expression.30).png

El control ListBox representa una colección de elementos. Para rellenar un control ListBox, puede enlazarlo a un origen de datos o mostrar elementos no enlazados. El control ListBox es un control de elementos, es decir, puede rellenarlo con elementos que contengan texto u otros controles.

Al igual que los demás controles, el control ListBox (y cada control ListBoxItem que contenga el objeto ListBox) se puede modificar para que tenga una apariencia muy diferente a la predeterminada. La apariencia predeterminada del control ListBox es la siguiente:

Ee371162.3cc2d3af-6781-4937-b068-c3448a56406d(ES-ES,Expression.30).png

Propiedades de interés del control ListBox

Para establecer el elemento que está seleccionado en el control ListBox, establezca la propiedad SelectedIndex en Propiedades comunes en el panel Propiedades. Un valor de -1 muestra el objeto ListBox sin ninguna selección. Un valor de 0 muestra el objeto ListBox con el primer elemento seleccionado.

Para agregar elementos a un control ListBox, puede agregar manualmente objetos ListBoxItem o enlazar una colección de datos al objeto ListBox para que los elementos aparezcan de forma automática.

Para obtener más información, vea Enlazar un objeto a datos y Crear datos de ejemplo.

Elementos de la plantilla ListBox

El control ListBox usa una plantilla para definir su apariencia: la plantilla ListBox. Cada elemento de esta plantilla desempeña un papel en la apariencia y el comportamiento del objeto ListBox al que se aplica la plantilla.

Ee371162.alert_tip(ES-ES,Expression.30).gifSugerencia:

Para aplicar estilos a los elementos que contiene un control ListBox, debe modificar otras plantillas. Por ejemplo, cuando un control ListBox está enlazado a datos, la plantilla que usa para aplicar estilos a los elementos que contiene es una plantilla de elementos generados (una plantilla de datos). Cuando un control ListBox no está enlazado a datos, no tiene una plantilla que se aplique a los elementos que contiene. En su lugar, debe modificar la plantilla de los propios elementos; por ejemplo, la plantilla ListBoxItem.

En la plantilla, pueden existir otros objetos para adornar la apariencia del control ListBox, pero los elementos enumerados en la tabla siguiente están asociados a su comportamiento en un contrato.

Para ver los elementos de una plantilla, abra el panel Elementos al modificar la plantilla. En el panel Objetos y escala de tiempo, aparece un icono Ee371162.6cf58c39-edba-4a0e-acbc-1da272f9a387(ES-ES,Expression.30).png junto a cada objeto que está actuando como elemento en el panel Elementos.

Nombre de elemento

Tipo de objeto

Descripción

ScrollViewer

ScrollViewer

Objeto que muestra los elementos en una ventana desplazable.

Este elemento es obligatorio.

El objeto ScrollViewer de la plantilla ListBox puede tener aplicada una plantilla modificada. Los objetos ScrollBar del objeto ScrollViewer también pueden tener aplicadas plantillas modificadas. Esto da lugar a plantillas anidadas del siguiente modo:

Ee371162.b8a37dc0-a65e-4fe1-8a9f-df485bb1bbae(ES-ES,Expression.30).png

Ee371162.095c13e8-6ed8-4572-9bd2-b2d6bdfdf199(ES-ES,Expression.30).png

Control ListBox. El control ListBox es un contenedor de una lista de elementos que pueden estar enlazados a los elementos de un origen de datos, o bien que muestran objetos individuales sin enlazar.

Ee371162.e1a62fcf-2f5c-4263-95fe-a9bf97616b85(ES-ES,Expression.30).png

Control ScrollViewer en la plantilla ListBox.

Ee371162.b36987f6-e914-4b58-99f2-a76c47128837(ES-ES,Expression.30).png

Elemento sin enlazar en el control ListBox.

Ee371162.41999197-e26c-42b9-8039-58ce07f5b5ba(ES-ES,Expression.30).png

Control ScrollBar vertical en la plantilla ScrollViewer.

Ee371162.a5d608f2-bba2-48c5-8b15-2c115db86acc(ES-ES,Expression.30).png

Control Thumb vertical en la plantilla ScrollBar.

Ee371162.15de085f-48f5-41dd-a286-e3dcb4cfd18b(ES-ES,Expression.30).png

Control RepeatButton vertical en la plantilla ScrollBar para reducir el valor del control ScrollBar en incrementos grandes.

Ee371162.1d2fe38a-3fd8-4951-b978-7e44b6f2401d(ES-ES,Expression.30).png

Control RepeatButton vertical en la plantilla ScrollBar para reducir el valor del control ScrollBar en incrementos pequeños.

Para obtener más información acerca de la aplicación de estilos a los objetos ScrollViewer y ScrollBar, vea Sugerencias para la aplicación de estilos al control ScrollViewer y Sugerencias para la aplicación de estilos al control ScrollBar.

Estados del control ListBox

De forma predeterminada, el control ListBox puede estar en uno de los tres estados siguientes del grupo de estados ValidationStates:

Nombre del estado

Descripción

Valid

Apariencia del control ListBox cuando es válido.

InvalidUnfocused

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

InvalidFocused

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

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 de un estado, haga clic en el botón de grabación Ee371162.0dcc6415-6d4e-4fcf-a9a3-eb4664cb6cbc(ES-ES,Expression.30).png en la mesa de trabajo, o bien seleccione Base en el panel Estados.

Para convertir objetos en un control ListBox

Para modificar la plantilla de un control ListBox, realice una de las acciones siguientes:

  • Dibuje un control ListBox Ee371162.b174a511-dd12-4a45-a986-034de7693de9(ES-ES,Expression.30).png en la mesa de trabajo y, a continuación, cree una copia de la plantilla predeterminada.

    Para obtener más información, vea Crear o modificar una plantilla.

  • Diseñe el aspecto del control ListBox dibujando objetos o importando material gráfico, y use después el comando Convertir en control.

Si usa el comando Convertir en control, siga los pasos que se indican a continuación para asegurarse de crear todos los objetos que la plantilla ListBox requiere:

  1. Agrupe todos los objetos con los que desea definir la apariencia del control ListBox en un control Grid. Incluya aquellos objetos que no estén destinados a formar parte de la plantilla.

  2. Seleccione el nuevo control Grid y, en el menú Herramientas, haga clic en Convertir en control.

  3. En el cuadro de diálogo que aparece, seleccione ListBox, dé un nombre a la plantilla y seleccione la ubicación donde se almacenará la plantilla.

    Para obtener información acerca de las ubicaciones, vea Crear un recurso.

  4. Después de hacer clic en Aceptar, Microsoft Expression Blend entra en el modo de edición de plantillas y muestra los objetos que forman parte del control ListBox. Puede continuar modificando la plantilla en este modo. Por ejemplo, agregar o modificar objetos, o bien seleccionar un estado en el panel Estados para modificar la apariencia de la plantilla en dicho estado.

  5. Para crear el elemento ScrollViewer, haga doble clic en ScrollViewer en el panel Elementos. Con el nuevo objeto ScrollViewer seleccionado, dibuje un control ItemsPresenter dentro de él. Use la herramienta SelecciónEe371162.2ff91340-477e-4efa-a0f7-af20851e4daa(ES-ES,Expression.30).png o las propiedades de la categoría Diseño del panel Propiedades para cambiar de tamaño y mover estos objetos dentro de la plantilla.

  6. Considere la posibilidad de enlazar algunas de las propiedades de pincel de los objetos de la plantilla a las siguientes propiedades del objeto ListBox que finalmente usará la plantilla:

    • Background

    • BorderBrush

    • Foreground

    • BorderThickness

    Para obtener más información, vea Trasladar propiedades de objetos a la plantilla.

  7. Para salir del modo de edición de plantilla, haga clic en [ListBox] en la barra de ruta de navegación situada en la parte superior de la mesa de trabajo, o haga clic en Ámbito superiorEe371162.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(ES-ES,Expression.30).png en el panel Objetos y escala de tiempo.

    Para obtener información sobre cómo aplicar una plantilla ListBox nueva a otros objetos ListBox, vea Aplicar o quitar un recurso.

Referencias

Encontrará información detallada acerca de las propiedades y eventos del control ListBox de Microsoft Silverlight en la galería de controles de Silverlight (puede estar en inglés) en MSDN.

Vea también

Tareas

Usar el control DataGrid

Usar el control TreeView

Conceptos

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

SimpleListBox y SimpleListBoxItem

Aplicar estilos a un control que admite plantillas

Aplicar estilo a un control que muestra datos