6 de noviembre de 2024

Grupos de anidamiento en bloque cero

El Bloque Cero admite ahora el anidamiento, que permite colocar un grupo de elementos dentro de otro. Veamos cuándo puede ser útil el anidamiento y cómo utilizarlo.

Cuándo utilizar la anidación

El anidamiento puede ser especialmente útil al diseñar con Auto Layout (contenedores flexibles), crear tarjetas, galerías y más. Por ejemplo, ha creado una tarjeta para su blog con un título, una descripción y una imagen. A continuación, ha agrupado estos elementos (Seleccionar varios elementos → Agrupar), los ha definido como un grupo de objetos (Grupo → Objeto) y ha activado Diseño automático (Diseño automático → Flex → Auto) para que la altura de la tarjeta se ajuste automáticamente en función de su contenido. También ha añadido una URL y ha establecido un color de fondo.

Para ajustar de forma más flexible el espaciado entre el título y la descripción, ha agrupado estos dos elementos de texto y ha activado Diseño automático para este nuevo grupo. Ahora tiene un grupo anidado con propiedades flexibles.

Cómo anidar un grupo dentro de otro

  1. A través del panel Capas.
  2. Mediante arrastrar y soltar (sólo con la función de diseño automático activada).
  3. Con el atajo de teclado Cmd/Ctrl+G.
  4. A través del panel de Ajustes.
  5. En el menú contextual.
💡 Puede anidar grupos dentro de otros grupos hasta cinco niveles de profundidad. Sin embargo, los elementos agrupados como grupo Lógico no pueden anidarse dentro de un grupo Objeto. Si intenta anidarlos, el grupo Lógico se convertirá automáticamente en un grupo Objeto.

Casos prácticos de anidamiento de grupos

Aquí tienes algunos ejemplos de cuándo resulta especialmente útil anidar grupos y cómo puedes utilizarlos en tus proyectos.
Espaciado y colocación sin esfuerzo
El siguiente ejemplo muestra la pantalla principal de una tienda de muebles, con todos los elementos agrupados como un grupo de Objetos y el Diseño Automático activado. Hay un grupo que contiene varios grupos anidados, como una imagen de portada, un logotipo, un menú de navegación y una galería de tarjetas, donde cada tarjeta es también un grupo. La maquetación automática y los grupos anidados permiten que toda la maquetación se ajuste automáticamente a cualquier cambio de contenido, lo que facilita el desplazamiento de los elementos y reduce la necesidad de realizar ajustes manuales.
Configuración flexible de la animación
Anidar grupos también es útil para aplicar diferentes efectos de animación a varios grupos. Por ejemplo, puede establecer una animación de apariencia para toda una tarjeta y una animación hover independiente para un grupo anidado con un único elemento, como una flecha.
Diseños adaptables rápidos y sencillos
El diseño automático, combinado con el anidamiento, le permite adaptar rápidamente el diseño de su sitio web a diferentes resoluciones de pantalla. También te ahorra trabajo manual repetitivo: una vez configurados, los ajustes controlan automáticamente cómo responden todos los elementos a los cambios de contenido o tamaño y los alinean en consecuencia.
Ver también

El nuevo bloque permite personalizar con flexibilidad el aspecto del cuestionario, añadir un mensaje de bienvenida y mensajes de ayuda de consultores virtuales, y configurar los resultados en función de las respuestas de los usuarios.

Puede convertir los elementos agrupados en un elemento independiente y establecer su configuración.

Hecho en
Tilda