Crear un ComboBox en la Ribbon de Excel con XML y el Custom UI Editor.

Curso:	Personalizar la UI de Excel con XML y VBA.
Formato:	Artículo/Tutorial.
Archivos necesarios:	Personal v0.01.xlsm. ImagenesCombo.rar.
Anterior Artículo/Tutorial:	Act. y Des. Botones...
Siguiente Artículo/Tutorial:	Próximamente.
Versión Vídeo/Tutorial:	Próximamente.
ComboBox con imágenes en la Ribbon.

Seguimos con los artículos dedicados a la personalización de la Interface de Excel usando XML y VBA. Aparcamos de momento el tema de los botones y empezamos con otro control de los que podemos usar en nuestras fichas personalizadas, el comboBox o Cuadro Combinado. ¿Qué es un comboBox? Bueno pues se trata de uno de los controles más usados en todos los programas, son controles que muestran listas, en las que podemos seleccionar alguno de sus elementos. En realidad podemos seleccionar y escribir, por eso se llaman cuadros combinados. Son una combinación de un cuadro de texto en el que podemos escribir y una lista en la que podemos seleccionar. Por ejemplo, en la siguiente imagen podemos ver el cuadro combinado que permite aplicar formatos numéricos a las celdas de Excel.

ComboBox para seleccionar el formato numérico en Excel.

En este artículo nos vamos a centrar en como crearlo, en las opciones que tenemos para variar su aspecto físico, su apariencia. En el siguiente artículo conseguiremos que funcione, como ejemplo haremos lo necesario para que al seleccionar una de las opciones que aparecen en un cuadro combinado, se aplique un filtro. Para realizar los mismos pasos que yo, os he dejado para descargar el documento y las imágenes que uso en el artículo, podéis realizar la descarga a continuación o al inicio del artículo en su ficha descriptiva.

Personal v0.01.xlsm

 ImagenesCombo.rar

Antes de empezar a crear nuestro primer comboBox os voy a contar un detalle. En la Ribbon podemos crear otro control muy parecido a un comboBox, llamado dropDown. Un dropDown es como un cuadro combinado, pero sin la posibilidad de escribir en el. Es decir, si sólo quiero permitir seleccionar un elemento  y no quiero permitir escribir, esa debería ser mi opción. A mi particularmente siempre me gusta más la opción de los comboBox, pero que sepáis que también tenéis esa otra opción de la que ya hablaremos. De todas las maneras para lo que queremos hacer en este caso, la mejor opción es el comboBox. La idea es que con lo que se seleccione en el comboBox se aplicarán filtros, es decir el texto que se quedará seleccionado en el comboBox será parte del criterio de un filtro. Bueno pues para eso es mejor el comboBox porque es muy fácil acceder al texto que se ha quedado seleccionado. Por el contrario, en un DropDown, no se puede acceder fácilmente al texto que se queda seleccionado. Cuando veamos los dropDown ya veremos que se puede hacer y que no. De momento quedaros con que un comboBox, es la mejor opción si queremos acceder al texto que se queda seleccionado. En la siguiente imagen podéis ver los dos controles, la única diferencia visual que podemos ver a primera vista es que en el de la izquierda se puede escribir, es el comboBox.

comboBox y dropDown. En el primer se puede escribir, en el segundo no.

Todo el trabajo que hay que realizar en este artículo lo vamos a realizar en el Custom UI Editor, por lo tanto accedemos a él y abrimos el documento descargado. A Excel solo vamos a ir para ver como queda el código XML que iremos escribiendo, para ver como va quedando el comboBox. Para empezar vamos a crear un customUI para la versión 2010 de Excel. Como ya hemos visto el proceso en artículos anteriores, no entro en detalles. En la siguiente imagen podéis ver como se hace desde el menú Insert.

Insertamos un customUI para Excel 2010.

A continuación debemos añadir algunas líneas de código XML para definir la personalización que vamos a crear y los elementos contenedores en los que vamos a crear el comboBox. El código debe quedar como veis a continuación.

<customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui">
  <ribbon>
    <tabs>
      <tab id="fichaRecursosHumanos" label="Recursos Humanos" insertBeforeMso="TabHome">

        <group id="grupoEmpleados" label="Empleados">
          
        </group>
      </tab>
    </tabs>
  </ribbon>
</customUI>

Estas líneas ya las hemos comentado en los artículos anteriores, básicamente creamos una ficha personalizada que aparece justo antes de la ficha Inicio y en su interior tiene un grupo de controles. En la siguiente imagen podéis ver el resultado de esas líneas de código.

Creamos una ficha personalizada con un grupo de controles.

Dentro del grupo que hemos creado, es donde irá el comboBox. Para hacerlo debemos escribir dentro de las etiquetas group las siguientes líneas de código, debe quedar como vemos a continuación:

<group id="grupoEmpleados" label="Empleados">
  <comboBox id="comboPoblacion" label="Selecciona una población: ">
    
  </comboBox>
</group>

Con la etiqueta comboBox definimos cuadros combinados, en concreto aquí hemos creado un comboBox identificado como comboPoblacion y que muestra un texto al lado, en el que se puede leer que debemos seleccionar una población. Como ya sabéis el atributo id identifica al control y en este caso la etiqueta label controla el texto que aparece justo al lado del cuadro combinado, es el texto que ayuda a saber que es lo que debemos seleccionar. En la siguiente imagen podéis ver como ha quedado el comboBox.

ComoBox vacío creado en la ficha personalizada.

En el siguiente paso vamos a dar contenido al cuadro combinado. En este caso se trata de un cuadro combinado con opciones fijas. Es decir, tiene las mismas opciones todo el rato por lo que las opciones las podemos definir en el código XML. Si por ejemplo se tratará de un comboBox que debe cargar las opciones de una hoja de Excel, el proceso para darle contenido sería diferente a lo que vamos hacer ahora. En este caso para darle contenido debemos usar elementos item, escribimos lo siguiente y os comento que hemos hecho.

<comboBox id="comboPoblacion" label="Selecciona una población: ">
  <item id="itemTodas" label="*--Todas las Poblaciones--*"/>
  <item id="itemBarcelona" label="Barcelona"/>
  <item id="itemMadrid" label="Madrid"/>
  <item id="itemPamplona" label="Pamplona"/>
</comboBox>

Por cada opción que aparece en el cuadro combinado debemos utilizar una etiqueta item, debemos definir un item para cada opción, en este caso cuatro. El filtro que aplicaremos en el próximo artículo, utilizará las poblaciones a las que pertenecen unos trabajadores, para mostrar sólo los que trabajan en esa población. He creado cuatro opciones, una para mostrar los datos de todas las poblaciones, otra para mostrar los datos de los trabajadores de Barcelona, otra para los de Madrid y otra para los de Pamplona. Si abrís el documento en Excel esto es lo que tendremos.

Con item creamos cada una de las opciones que se muestran en el comboBox.

En cada item he usado dos atributos, el id y label. Como siempre el id es para identificar, en este caso cada opción que aparece, pero a nosotros nos da igual no lo usamos. Label en este caso se corresponde con el texto que mostrará cada opción. Así ya tendríamos creado el comboBox, pero evidentemente no pasa nada si selecciono una de las opciones, eso lo dejamos para el siguiente artículo. Ahora vamos a conocer algunos atributos más que tiene comboBox e item para ajustar más su apariencia.