Adobe Experience Manager permite crear formularios adaptables fáciles de usar que ofrecen experiencias dinámicas a los usuarios finales. El diseño del formulario controla cómo se muestran los elementos o los componentes de un formulario adaptable.
Un formulario adaptable proporciona los siguientes tipos de diseños:
Diseño de panel: controla cómo se muestran los elementos o componentes de un panel en un dispositivo.
Diseño móvil: controla la navegación de un formulario en un dispositivo móvil. Si el ancho del dispositivo es de 768 píxeles o más, el diseño se considera un diseño para móviles y se optimiza para un dispositivo móvil.
Diseño de barra de herramientas: controla la ubicación de los botones de acción en la barra de herramientas o la barra de herramientas del panel de un formulario.
Todos estos diseños de panel se definen en la ubicación /libs/fd/af/layouts
.
Para cambiar el diseño de un formulario adaptable, utilice el modo Autor de Experience Manager.
Un autor de formularios puede asociar un diseño a cada uno de los paneles de un formulario adaptable, incluido el panel raíz.
Los diseños de panel están disponibles en la ubicación /libs/fd/af/layouts/panel
. Pulse el panel y seleccione para ver sus propiedades.
Utilice este diseño de panel para crear un diseño adaptable que se ajuste al tamaño de pantalla del dispositivo sin necesidad de utilizar ningún tipo de navegación especializada.
Con este diseño, puede colocar varios componentes Formulario adaptable con panel uno tras otro en el panel.
Utilice este diseño de panel para proporcionar navegación guiada dentro de un formulario. Por ejemplo, utilice este diseño cuando desee capturar información obligatoria en un formulario y guiar a los usuarios paso a paso.
Utilice el componente Formulario adaptable con panel para proporcionar navegación paso a paso dentro de un panel. Cuando se utiliza este diseño, el usuario solo puede pasar al siguiente paso una vez que ha completado el paso actual.
window.guideBridge.validate([], this.panel.navigationContext.currentItem.somExpression)
Con este diseño, puede colocar el componente Formulario adaptable con panel en un panel con navegación de estilo acordeón. Este diseño también permite crear paneles repetibles. Los paneles repetibles permiten agregar o quitar paneles de forma dinámica según sea necesario. Puede definir el número mínimo y máximo de veces que se repite un panel. Además, el título del panel se puede determinar dinámicamente en función de la información proporcionada en los elementos del panel.
La expresión de resumen se puede utilizar para mostrar los valores proporcionados por el usuario final en el título del panel minimizado.
Con este diseño, puede colocar el componente Formulario adaptable con panel en un panel con navegación entre pestañas. Las pestañas se colocan a la izquierda del contenido del panel.
Las pestañas aparecen a la izquierda del panel
Con este diseño, puede colocar el componente Formulario adaptable con panel en un panel con navegación entre pestañas. Las pestañas se colocan sobre el contenido del panel.
Los diseños móviles proporcionan una navegación fácil de usar en los dispositivos móviles con pantallas relativamente más pequeñas. Los diseños móviles utilizan estilos con pestañas o de asistente para la navegación del formulario. La aplicación de un diseño para móvil proporciona un diseño único para todo el formulario.
Este diseño controla la navegación mediante una barra y un menú de navegación. La barra de navegación muestra los iconos < y > para indicar los pasos de navegación Siguiente y Anterior en el formulario.
Los diseños móviles están disponibles en la ubicación /libs/fd/af/layouts/mobile/
. Los siguientes diseños móviles están disponibles en los formularios adaptables de forma predeterminada.
Seleccione la opción Agregar elementos navegables de diseño adaptable al menú móvil para ver las opciones navegables disponibles en un panel con el diseño móvil. Las opciones navegables solo están visibles si selecciona el diseño Adaptable para un panel.
Cuando se utiliza un diseño móvil, el menú del formulario está disponible para acceder a los diferentes paneles del formulario pulsando el icono .
Este diseño, como su nombre indica, muestra los títulos de los paneles junto con el menú y la barra de navegación. También incluye los iconos Siguiente y Anterior para la navegación.
Este diseño, como su nombre indica, muestra únicamente el menú y la barra de navegación, sin títulos de panel. También incluye los iconos Siguiente y Anterior para la navegación.