SimpleComboBox y SimpleComboBoxItem

Esta página es específica de proyectos WPF

El cuadro combinado es un control de elementos en forma de lista desplegable. Para colocar contenido en un cuadro combinado en Microsoft Expression Blend, haga doble clic en el cuadro combinado y, a continuación, dibuje un elemento (como un SimpleComboBoxItem) en él. Otra posibilidad es hacer clic con el botón secundario en el cuadro combinado en Objetos y escala de tiempo y, a continuación, hacer clic en Agregar SimpleComboBoxItem para agregar elementos individuales a la colección, o bien hacer clic en Enlazar ItemsSourcea datos para generar la colección de elementos ComboBoxItem desde un origen de datos. Para ver el cuadro combinado en la mesa de trabajo cuando esté expandido, puede hacer clic con el botón secundario en el cuadro combinado o en el elemento de cuadro combinado en Objetos y escala de tiempo y, a continuación, hacer clic en Expandir ComboBox.

Vista de la mesa de trabajo de un control SimpleComboBox después de agregar dos elementos

Cc295332.25309636-8547-4686-a578-9aa914190f01(es-es,Expression.10).png

Desglosar la plantilla de control

La plantilla del control SimpleComboBox está formada por los siguientes elementos:

  • Un panel de cuadrícula, que se usa para que el cuadro combinado contenga varios elementos secundarios. El panel de cuadrícula también se usa porque facilita al diseñador de la interfaz de usuario (UI) de la aplicación la adición de otros elementos a la plantilla.

  • Un elemento ContentPresenter denominado ContentSite, que está incluido en la cuadrícula y se usa para mostrar el elemento seleccionado.

  • Un cuadro de texto denominado PART_EditableTextBox, que está incluido en la cuadrícula y permite al usuario modificar texto dentro del cuadro combinado. Puesto que la clase utiliza el nombre PART_EditableTextBox para buscar el cuadro de texto, no debe cambiarse. De forma predeterminada, el cuadro de texto se contrae y se hace visible cuando IsEditable está establecido en True en el cuadro combinado al que se aplica esta plantilla de control.

  • Un control de botón de alternancia emergente, que se usa para crear la parte que se expande del cuadro combinado. El control emergente sabe cómo colocarse en relación con otros controles y se representa encima de cualquier otro contenido. Este control también permite el uso de algunas animaciones incorporadas.

  • Un control Grid incluido dentro del control emergente y que contiene un ScrollViewer que permite el desplazamiento en la lista de elementos. StackPanel en ScrollViewer coloca cada elemento. La propiedad IsItemsHost (es host de elementos) de StackPanel se establece en True para que el control de cuadro combinado sepa colocar los elementos secundarios dentro de StackPanel. Si desea cambiar la forma en que se muestran los elementos, puede reemplazar este panel de diseño; para ello, haga clic con el botón secundario en la cuadrícula desplegable, en Objetos y escala de tiempo, y, a continuación, seleccione Cambiar tipo de diseño y elija otro panel, como UniformGrid.

La plantilla del control SimpleComboBoxItem está formada por los siguientes elementos:

  • Un panel de cuadrícula, que se usa para que el elemento de cuadro combinado contenga varios elementos secundarios. También se usa el panel de cuadrícula porque facilita al diseñador la adición de otros elementos a la plantilla.

  • Un elemento Border, que se usa porque incluye una propiedad BorderThickness (grosor del borde) que se puede enlazar mediante una plantilla a la propiedad BorderThickness (grosor del borde) del control de botón al que se aplica la plantilla.

  • Un elemento ContentPresenter, que está incluido dentro del elemento Grid y se enlaza automáticamente a la propiedad Content (contenido) del control de elemento al que se aplica la plantilla.

    Vista de objetos: partes básicas (plantilla) de un control SimpleComboBox (izquierda) y un control SimpleComboBoxItem (derecha)

    Cc295332.e3201103-2125-43d3-b077-6aae64f53947(es-es,Expression.10).pngCc295332.4532cb8d-690e-49f7-9c8d-cc2fcb0109ae(es-es,Expression.10).png

Cc295332.7e183f1f-37d8-4dcb-980c-19a5d61ca087(es-es,Expression.10).gifVolver al principio

Desencadenadores de propiedad usados

Los desencadenadores de propiedad de la plantilla de control sirven para hacer que el control reaccione ante los cambios de propiedad. Puede hacer clic en los elementos en Desencadenadores, en el panel Interacción, para ver las propiedades que cambian cuando se activa un desencadenador. Por ejemplo, en la plantilla del cuadro combinado, cuando la propiedad HasItems (tiene elementos) es False, el alto mínimo del elemento DropDownBorder se establece en 95 para que aparezca una ventana desplegable vacía al hacer clic en el cuadro combinado. Si el alto mínimo se estableciera en 0, aparecería una ventana desplegable muy pequeña. En la plantilla del elemento de cuadro combinado, si la propiedad IsHighlighted (está resaltado) es True, la propiedad Background (fondo) del elemento Border se cambia para indicar qué elemento del cuadro combinado se selecciona.

Cc295332.7e183f1f-37d8-4dcb-980c-19a5d61ca087(es-es,Expression.10).gifVolver al principio

Pinceles usados

Las plantillas SimpleComboBox y SimpleComboBoxItem utilizan los siguientes recursos de pincel del diccionario de recursos SimpleStyles.xaml:

  • La propiedad Background (fondo) del elemento DropDownBorder se establece mediante WindowBackgroundBrush.

  • La propiedad BorderBrush (pincel del borde) del elemento DropDownBorder se establece mediante SolidBorderBrush.

  • La propiedad Foreground (primer plano) se establece mediante DisabledForegroundBrush cuando IsEnabled es False.

  • Si SimpleComboBox se ha llenado con elementos que usan la plantilla SimpleComboBoxItem, la propiedad Background (fondo) del elemento se establece mediante SelectedBackgroundBrush cuando se selecciona un elemento y la propiedad Foreground (primer plano) se establece mediante DisabledForgroundBrush cuando IsEnabled es False.

Cc295332.7e183f1f-37d8-4dcb-980c-19a5d61ca087(es-es,Expression.10).gifVolver al principio

Prácticas recomendadas e instrucciones de diseño

  • En general, debe usar un control Grid como raíz de la plantilla si espera que el diseñador agregue más elementos visuales al control. Expression Blend busca un panel de diseño como el control Grid y lo activa de forma predeterminada para que los elementos nuevos de la mesa de trabajo se agreguen como elementos secundarios del panel de diseño.

  • La expansión del cuadro combinado se establece mediante el enlace de la propiedad IsChecked (está activado) de ToggleButton y la propiedad IsOpen (está abierto) del elemento emergente a la propiedad IsDropDownOpen (está abierto desplegable) del cuadro combinado al que se aplica esta plantilla de control. Si modifica ToggleButton o el elemento emergente, necesitará asegurarse de mantener este enlace de plantilla.

  • El elemento ToggleButton utiliza una plantilla independiente denominada ToggleButtonControlTemplate. Para modificarlo, haga clic con el botón secundario en el elemento ToggleButton, elija Editar partes del control (Plantilla) y, a continuación, haga clic en Editar plantilla o Editar una copia.

  • Para modificar la plantilla SimpleComboBoxItem, haga clic en el botón Editar recurso situado al lado del estilo SimpleComboBoxItem en el panel Recursos. En el modo de edición del estilo, haga clic con el botón secundario en Style en Objetos y escala de tiempo, elija Editar partes del control (Plantilla) y, a continuación, haga clic en Editar plantilla o Editar una copia. Si modifica la plantilla SimpleComboBoxItem, puede desear conservar o modificar el desencadenador IsHighlighted.

Cc295332.7e183f1f-37d8-4dcb-980c-19a5d61ca087(es-es,Expression.10).gifVolver al principio

Vea también

Conceptos

Inténtelo: personalizar la apariencia del botón de expansión de un control SimpleComboBox