Inténtelo: personalizar la apariencia del botón de expansión de un control SimpleComboBox
.png "This page applies to WPF projects only")
Personalizar la apariencia del botón de expansión de un cuadro combinado en Microsoft Expression Blend es fácil cuando se usa la plantilla de control ToggleButton del control SimpleComboBox.
Para personalizar el botón de expansión de un control SimpleComboBox
Dibuje un control SimpleComboBox en la mesa de trabajo de Expression Blend.
.gif "Sugerencia")
Sugerencia:Los controles de estilo simple están disponibles en Simple Styles, en la categoría Estilos del panel Activos. Una vez seleccionado un control de estilo simple de la lista, puede dibujarlo en la mesa de trabajo.
Agregue un elemento al cuadro combinado; para ello, haga clic con el botón secundario en el cuadro combinado en el panel Objetos y escala de tiempo y, a continuación, haga clic en Agregar SimpleComboBoxItem.
Agregue uno o dos elementos adicionales al cuadro combinado repitiendo el paso anterior.
Haga clic con el botón secundario en ComboBox en el panel Objetos y escala de tiempo, elija Editar plantilla y, a continuación, haga clic en Editar actual. Si no desea modificar el diccionario de recursos SimpleStyles.xaml, puede hacer clic en Editar una copia en lugar de en Editar actual para crear una plantilla nueva y guardarla en el documento. Para obtener más información acerca de cómo crear una copia, vea Crear un recurso.
Sugerencia:Para salir del modo de edición de plantilla y volver al ámbito del documento, haga clic en Ámbito superior
.png "Cc294708.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(ES-ES,Expression.30).png")
, que está encima del árbol de elementos en el panel Objetos y escala de tiempo.Para volver al modo de edición de plantilla para una plantilla existente, en el panel Objetos y escala de tiempo, haga clic con el botón secundario en el elemento cuya plantilla desee editar, elija Editar plantilla y, a continuación, haga clic en Editar actual.
En el ámbito de edición de la plantilla de control, expanda todos los nodos del panel Objetos y escala de tiempo.
Haga clic con el botón secundario en el elemento ToggleButton en el panel Objetos y escala de tiempo, elija Editar plantilla y, después, realice una de las acciones siguientes:
Si seleccionó Editar actual en el paso 4, haga clic ahora en Editar actual para editar la plantilla del control ExpanderToggeButton que está almacenada en SimpleStyles.xaml.
Si seleccionó Editar una copia en el paso 4, haga clic en Editar una copia ahora para crear una copia de la plantilla del control ExpanderToggeButton y guárdela en el mismo lugar que la plantilla de ComboBox.
El aspecto del botón de expansión se diseña en la plantilla del control ExpanderToggeButton. Observe que la cuadrícula de la plantilla abarca todo el ancho del cuadro combinado. Este diseño permite que la lista desplegable aparezca sin tener en cuenta el lugar en que el usuario haga clic dentro del cuadro combinado.
Seleccione el elemento Arrow en el panel Objetos y escala de tiempo para identificarlo en la mesa de trabajo. El elemento Arrow es un trazado que representa el botón de expansión para el control ComboBox.
Puede modificar el elemento Arrow mediante la herramienta Selección directa
.png "Cc294708.6dd6571f-c116-451d-8dd2-1f88b8406362(ES-ES,Expression.30).png")
para ajustar los puntos del trazado. O bien, puede eliminar el elemento Arrow y después crear un elemento nuevo con la herramienta Pluma.png "Cc294708.894f8612-e0ed-4e00-84cf-a9bc8f38fc54(ES-ES,Expression.30).png")
en el panel Herramientas.Sugerencia:Para acercar la mesa de trabajo, puede usar el cuadro de texto Zoom
.png "Cc294708.12524287-c48b-4cfc-b614-01951207239d(ES-ES,Expression.30).png")
situado en la parte inferior de la mesa de trabajo o el botón de desplazamiento del mouse mientras mantiene presionada la tecla CTRL.Sugerencia:Como alternativa a dibujar un elemento de trazado con la herramienta Pluma, puede usar un recurso de imagen importado desde Microsoft Expression Design o un archivo de imagen que haya agregado al proyecto.
El efecto de sustitución que se observa al hacer clic en el botón de expansión está definido por desencadenadores de propiedad que modifican la apariencia de los elementos Rectangle en la plantilla del control ToggleButton. Puede agregar un nuevo cambio de propiedad a los desencadenadores existentes que haga girar el elemento Arrow al hacer clic en el botón de expansión. Con el elemento Arrow seleccionado en el panel Objetos y escala de tiempo, haga clic en IsChecked = True en el panel Desencadenadores y, a continuación, haga clic en la ficha Girar en Transformación, dentro del panel Propiedades, y escriba 180 en el cuadro de texto Ángulo.
Cuando un usuario haga clic en el botón de expansión para ampliar el cuadro combinado, el elemento Arrow girará 180 grados y volverá a su giro original cuando se vuelva a hacer clic de nuevo.
Sugerencia:Cuando está seleccionado un desencadenador de propiedad en el panel Desencadenadores, toda modificación realizada en Expression Blend establecerá un valor para que se cambie en esa condición de desencadenador. Asegúrese de que esté seleccionado el desencadenador correcto antes de realizar cambios. Si desea realizar cambios que afecten al estado predeterminado de la plantilla de control, haga clic en Valor predeterminado en el panel Desencadenadores.
Pruebe la aplicación (F5) para ver los efectos.