Sección modal

Crea una sección separada de la interfaz de usuario principal que puede utilizar para gestionar una tarea tangente o mostrar algo. Para reanudar el trabajo en la interfaz de usuario, debe cerrar la sección modal.

Una sección modal no es una alerta, lo que descarta al usuario para trabajar en otras partes de la interfaz de usuario. Normalmente, una sección Modal utiliza un diseño de otras vistas, como Pozo o Panel.

Sugerencia: Debe establecer la propiedad de visibilidad de la vista de sección Modal en Ninguno (en Propiedades > Visibilidad); de lo contrario, la sección Modal se muestra de forma predeterminada.

Propiedades de configuración

En Configuración, establezca o modifique las propiedades de aspecto y comportamiento de la vista.

Tamaño de pantalla: Una propiedad de configuración que tenga el icono Tamaños de pantalla junto al nombre de propiedad puede tener distintos valores para cada tamaño de pantalla. Si no define un valor, el tamaño de la pantalla hereda el valor del siguiente tamaño de pantalla más grande como valor predeterminado.

Definiciones de temas: Las definiciones de temas especifican los colores y los estilos de una vista y determinan su aspecto. Puede obtener una vista previa del aspecto de las vistas en el editor de temas. Consulte Temas.

En la tabla siguiente se muestran las propiedades de configuración del aspecto de la vista Sección modal.

Tabla 1. Propiedades de configuración de aspecto para Sección modal
Propiedad de configuración del aspecto	Descripción	Tipo de datos
Ancho de marcador modal	Especifica la anchura de la vista en píxeles (px), en forma de porcentaje de la anchura original (%) o en unidades em.	`String`
Mostrar botones	Muestra los botones del modal.	`Boolean`
Estilo de color	Estilo de color del botón primario. Las opciones disponibles son Default, Primary, Info, Success, Warningy Danger.	`ButtonColorStyle`
Texto del botón primario	El texto del botón que permite al usuario confirmar la acción en el modal. Por ejemplo, Guardar o Aceptar.	`String`
Texto del botón secundario	El texto del botón que permite al usuario rechazar la acción en el modal. Por ejemplo, Cerrar o Cancelar.	`String`

En la tabla siguiente se muestran las propiedades de configuración del comportamiento de la vista Sección modal.

Tabla 2. Propiedades de configuración del comportamiento para Sección modal
Propiedad de configuración del comportamiento	Descripción	Tipo de datos
Cerrar al pulsar	Si selecciona Cerrar al pulsar, los usuarios pueden cerrar la sección modal pulsando en cualquier lugar fuera de la misma. De forma predeterminada, la sección no se puede cerrar así.	`Boolean`

Sucesos

Establezca o modifique los manejadores de sucesos para la vista en las propiedades de Sucesos. Puede establecer que los sucesos se activen mediante programación o cuando un usuario interactúe con la vista. Para obtener información sobre cómo definir y codificar sucesos, consulte Sucesos definidos por el usuario.

Para la vista Sección modal, puede activar los siguientes tipos de manejadores de sucesos:

On load: Se activa cuando se carga la página, por ejemplo me.setVisible(true);
On close: Se activa cuando se cierra la ventana Sección modal, por ejemplo ${Output_Text1}.setText("Modal section closed...");, donde Output_Text1 es el ID de control del texto de salida.
On show: Se activa cuando se abre la ventana Sección modal, por ejemplo, me.setText("Modal section is open...");
On primary button clicked: Se activa cuando se pulsa el botón primario del modal. Por ejemplo:
```
btn text: Save
onclick: customized save function/actions
```
On secondary button clicked: Se activa cuando se pulsa el botón secundario del modal. Por ejemplo:
```
btn text: Close
onclick action: me.hide();
```

Métodos

Para obtener más información sobre los métodos disponibles, consulte la sección Modal JavaScript .

Recursos adicionales

Para obtener información sobre cómo crear un coach o una página, consulte Creación de coaches.
Para obtener información sobre las propiedades estándar (General, Configuración, Posicionamiento, Visibilidady Atributos HTML), consulte Ver propiedades.