Skip To Content

Agregar grupos de pantallas

El grupo de pantallas es un contenedor de diseño con varias pantallas para organizar el contenido y los widgets de las páginas de desplazamiento. Cada pantalla tiene una fase principal y puede tener un panel de desplazamiento, dependiendo de la plantilla de grupo de pantallas. Al desplazarse a un grupo de pantallas, este ocupa la altura completa de la pantalla. Si un grupo de pantallas tiene paneles de desplazamiento, la fase principal permanece en su lugar a medida que los usuarios finales se desplazan por el contenido de un panel y solo cambia cuando se desplazan fuera del último panel. Si el grupo de pantallas no tiene paneles, la fase principal permanece en su sitio hasta que se desplaza la altura de una pantalla completa.

Ejemplos

Utilice un grupo de pantallas para apoyar los requisitos de diseño de la aplicación, como los siguientes:

  • Tiene varias imágenes y cada una de ellas necesita un párrafo largo para su descripción, motivo por el cual desea desplazarse por el contenido mientras la imagen permanece en la misma posición. Puede agregar un grupo de pantallas con panel de desplazamiento a una página de desplazamiento y colocar la imagen en la fase principal de la pantalla y la descripción correspondiente en el panel de desplazamiento de la pantalla.
  • Desea mostrar el contenido con un efecto de inversión de página en lugar del efecto de inserción predeterminado de las páginas de desplazamiento. Puede utilizar una plantilla determinada para aplicar efectos de transición diferentes entre cada pantalla del grupo de pantallas.

Notas de uso

Para agregar un grupo de pantallas a una página de desplazamiento, haga clic en el botón Insertar grupo de pantallas del lienzo y elija una plantilla de grupo de pantallas. Cuando se agrega un grupo de pantallas a la página, en el lienzo aparece una barra de desplazamiento separada para el grupo de pantallas.

Si un grupo de pantallas tiene paneles de desplazamiento, la altura del panel aumenta de manera automática basándose en su contenido. Puede insertar widgets en un panel arrastrándolos hasta su interior o haciendo clic en el botón para agregar.

En la actualidad, solo puede agregar grupos de pantallas para tamaños de pantalla grandes (no es posible para tamaños de pantalla pequeños o medianos). Configure la aplicación para un tamaño de pantalla grande antes del ajuste en los otros dos tamaños de pantalla.

Ajustes

Los grupos de pantallas incluyen los siguientes ajustes de configuración:

  • Pantalla: agregue varias pantallas una a la vez o duplique las pantallas existentes si desea que tengan el mismo fondo o diseño.
  • Administre las pantallas del grupo con las opciones siguientes: Cambiar nombre, Duplicar y Eliminar. Arrastre las pantallas para cambiar el orden de desplazamiento en el grupo de pantallas. Haga clic en el botón Configuración para cambiar la configuración de la pantalla en cuanto a fase principal y panel de desplazamiento (si tiene uno).
    • Fase principal: cambie el fondo de la fase principal mediante la elección de una imagen o un color de relleno.
    • Panel de desplazamiento
      • Modo: elija un modo de Acoplado y Flotante correspondiente a un diseño diferente.
      • Tamaño: defina la anchura del panel. También puede arrastrar el borde del panel en el lienzo para ajustar su tamaño.
      • Posición: alinee los paneles acoplados a la izquierda o a la derecha y los paneles flotantes a la izquierda, a la derecha o en el centro. En el caso de los paneles flotantes, establezca el efecto de desplazamiento horizontal en píxeles para ajustar la ubicación del panel basándose en su alineación.
      • Relleno: agregue espacio de relleno alrededor del borde interior del panel.
      • Fondo: cambie el fondo del panel de desplazamiento mediante la elección de una imagen o un color de relleno.
      Sugerencia:

      Al editar el contenido en un grupo de pantallas, los paneles flotantes tienen un botón Ocultar en vista de diseño Ocultar en vista de diseño en el que se puede hacer clic para minimizar temporalmente el panel con fin de ver la fase principal que hay detrás. Haga clic en el botón Mostrar en vista de diseño Mostrar en vista de diseño de la esquina inferior derecha de la fase principal para que se muestre de nuevo el panel. La ocultación del panel no afecta a la aparición del grupo de pantallas en la vista en vivo o la vista previa.

Plantillas

Además del diseño del widget, las plantillas de grupo de pantallas tienen otros ajustes predefinidos, como el efecto de transición, el espaciado entre paneles y el momento en que se desencadena la siguiente pantalla. Cuando elija una plantilla de grupo de pantallas en la galería, pase el cursor por la tarjeta de plantilla para ver un vista previa animada.

Los grupos de pantallas configurables tienen las siguientes plantillas predefinidas:

  • Cascada es una plantilla de varias pantallas con paneles flotantes. Los paneles avanzan y las fases principales desaparecen en el siguiente. Las pantallas cambian inmediatamente después de que aparezca el siguiente panel desde la parte inferior.
  • Índice es una plantilla con paneles acoplados y el mismo efecto de transición que Cascada. Cuando el siguiente panel se desplaza a una posición inferior, la pantalla cambia a la siguiente.
  • Folleto es una plantilla de una sola pantalla específica para un mapa y marcadores. Al desplazarse los paneles, el mapa de la fase principal navega hasta la posición del marcador de forma automática (mediante el uso de la configuraciónWidget Marcador, Activar al cargar).
  • Transmisión es una plantilla de varias pantallas con paneles flotantes. Entre el panel de la pantalla seleccionada y el de la pantalla no seleccionada se produce un efecto de paralaje. Cuando el siguiente panel se desplaza a una posición superior, la pantalla se desvanece en la siguiente.
  • Guía es una plantilla con efecto de paralaje por la que la pantalla cambia al a siguiente cuando el panel siguiente se desplaza a una ubicación inferior.
  • Muestrario es una plantilla de varias pantallas con paneles flotantes centrales. Cuando el panel actual termina de desplazarse, la fase principal cambia al siguiente con un efecto de transición de portada.
  • Presentación de diapositivas es una plantilla de varias pantallas con paneles acoplados. Cuando el panel actual termina de desplazarse, la fase principal cambia al siguiente con un efecto de transición de inserción.
  • Portfolio es una plantilla de varias pantallas con la fase principal solamente que tiene un efecto de transición de portada.