Componente Separador en formularios adaptables

Adobe recomienda utilizar la captura de datos moderna y ampliable Componentes principales para crear un nuevo Forms adaptable o adición de Forms adaptable a páginas de AEM Sites. Estos componentes representan un avance significativo en la creación de Forms adaptable, lo que garantiza experiencias de usuario impresionantes. En este artículo se describe un método antiguo para crear Forms adaptable mediante componentes de base.

Puede utilizar el componente separador para separar visualmente los paneles de un formulario. Puede definir el aspecto y el estilo generales de un componente Separador especificando las siguientes propiedades del componente Separador:

• Nombre del elemento: especifica el nombre del componente. Las expresiones SOM se dirigen al componente con un valor especificado en el campo Nombre del elemento.

• Grosor: especifica el grosor del componente Separador en píxeles.

• Clase CSS: especifica la clase CSS personalizada para el componente Separador.

• Estilos en línea: con AEM Forms, ahora puede aplicar estilos CSS en línea a componentes de formulario adaptable individuales y previsualizar los cambios en tiempo real.

Puede utilizar el modo Diseño para definir el número de columnas a las que se expande el componente Separador. Para obtener más información, consulte Uso del modo Diseño para cambiar el tamaño de los componentes.

Para especificar las propiedades de un componente Separador:

1. Seleccione un componente Separador y pulse . Las propiedades se abren en la barra lateral.
2. Haga clic en una pestaña de la sección Propiedades CSS en línea para poder especificar las propiedades CSS. Por ejemplo: a. En la pestaña Campo, haga clic en Agregar elemento. Se añade una fila con dos campos.
3. En el primer campo de la izquierda, especifique la propiedad CSS3 que desee aplicar. Por ejemplo, border. También puede seleccionar una propiedad haciendo clic en el botón de flecha hacia abajo. La lista desplegable no es exhaustiva y puede especificar cualquier nombre de propiedad CSS3 admitido en este campo.
4. En el campo adyacente, especifique un valor válido para la propiedad CSS3 especificada. Por ejemplo, 3 px solid black.
5. Haga clic en Agregar elemento para especificar otra propiedad y su valor.
6. Clic Previsualizar para poder obtener una vista previa de los cambios en el formulario.
7. Clic OK si desea confirmar los cambios o Cancelar para salir del cuadro de diálogo sin ningún cambio.