Grupo¶

Vinyl 3.3 presenta la función Grupo, que proporciona un contenedor para los controles que desea agrupar visualmente en una página. La función Grupo tiene ajustes de configuración adicionales disponibles para que pueda ajustar la apariencia y visualización de los controles dentro del contenedor. Más allá de las opciones de configuración disponibles a través del control de Grupo, puede usar Estilos para mejorar la apariencia.

Descripción General de Funciones¶

Los grupos ofrecen muchas opciones de configuración, según el resultado deseado.

Ejemplo de grupo usando el tipo de diseño apilado

Los grupos admiten las siguientes opciones de configuración:

• Elija entre dos tipos de diseño de orientación al configurar grupos: uno al lado del otro o apilado.
• Posibilidad de utilizar tamaños relativos para escalar y rellenar el contenido para que se ajuste a todo el espacio vertical y horizontal disponible asignado en una página.
• Opción para configurar Grupos para que se contraigan y expandan cuando se hace clic en el título.
• Acordeón y Tabulador son dos tipos de controles que pueden contener información dentro de ellos y son útiles para presentar agrupaciones lógicas de información.
  • De forma predeterminada, Vinyl presentará el primer control expandido (o abierto) y el resto contraído (o cerrado).
  • Personaliza la imagen que se muestra en un control de acordeón, que se utiliza para indicar el estado abierto/cerrado. Si no eliges un "estado apagado" para el acordeón, Vinyl usará la imagen del estado ENCENDIDO y la rotará 90 grados.
  • El estado predeterminado (abierto o cerrado) se puede configurar para los controles de acordeón.

Cómo Configurar un Grupo¶

Para usar Grupos, básicamente crea un Grupo como control contenedor y luego especifica los controles individuales que desea que residan dentro del Grupo.

1. Navegue hasta la página donde desea configurar el grupo.
2. Vaya al Cajón de acciones > Live Designer.
3. Seleccione el panel desde la vista de diseño.
4. Haga clic en el botón + Control.
5. Asigne un Nombre para el grupo.
6. Seleccione Grupo como Tipo de control.

7. Defina Tipo de diseño. Por ejemplo: Lado a lado.

   • Apilados: Coloca los controles en líneas separadas, apilando uno encima del otro.
   • Lado a lado: Coloca los controles uno al lado del otro o uno al lado del otro.

8. Haga clic en Siguiente.

9. Revise la información y haga clic en Finalizar.
10. Haga clic en la pestaña Todos los controles.
11. Para cada control que desee dentro del grupo, establezca el valor Padre en el valor del grupo nombrado.

12. Para una configuración adicional, haga clic en el icono de abrir registro para el control de grupo.

    • La pestaña Propiedades del control le permite cambiar el nombre del control, cambiar el tipo de control, cambiar el tipo de diseño, definir si se muestran los bordes del grupo, configurar el control como abierto de forma predeterminada (en las versiones 3.3. 34390+) y también configure el control como Activo o Inactivo.
    • La pestaña Posición y ancho le permite ajustar en qué parte del panel aparece el grupo, cuánto ancho se le asigna y la alineación.
    • La pestaña Etiqueta le permite configurar la visibilidad de la etiqueta, anular el valor de la etiqueta y establecer el tipo de etiqueta en Lado a lado o Apilada en el campo de control correspondiente.
    • La pestaña Edge Case le permite ingresar texto flotante (Ayuda) que aparecerá cuando un usuario pase el cursor sobre el campo.

Método de Compresión y Expansión de Tamaño¶

Si está utilizando un tipo de diseño Lado a lado para un grupo, Vinyl proporcionará opciones de Método de tamaño para configurar:

• Comprimir: Hace flotar el contenedor de grupo hacia la izquierda y ajusta el tamaño de los controles según el contenido. El valor de Ancho se puede utilizar para anular el ancho de control que calcula Vinyl.
• Expandir: Ajusta el tamaño de los controles contenidos en el grupo para llenar el ancho disponible. La configuración de Ancho se puede utilizar para ajustar los tamaños que calcula Vinyl. Tenga en cuenta que los tipos de control de botón, icono e imagen no cambiarán de tamaño para llenar el ancho cuando se utiliza esta configuración.