Control Dialog (experimental)

[Este artículo es documentación preliminar y está sujeto a modificaciones].

Un control utilizado para agrupar contenido.

Control de diálogo.

Importante

  • Esta es una característica experimental.
  • Las funciones de vista previa no están diseñadas para uso en producción y pueden tener una funcionalidad restringida. Estas características están disponibles antes del lanzamiento oficial para que los clientes puedan tener un acceso anticipado y proporcionar comentarios.

Description

Un cuadro de diálogo es una ventana emergente temporal que quita el foco de la página o aplicación y requiere que el usuario interactúe con ella. Se utiliza principalmente para confirmar acciones, como eliminar un archivo o pedir a las personas que elijan.

Este componente de lienzo imita el estilo y el comportamiento del control de diálogo de Fluent UI. Consulte la documentación para las prácticas recomendadas.

Ver el componente en el repositorio de GitHub del kit Creator.

Propiedades

Propiedades importantes

Propiedad Description
Buttons Un conjunto de datos que define los botones (más información en Propiedades de los botones).
Title Texto que aparece en la sección del título.
OverlayColor Color que aparece en el área superpuesta.
DialogWidth El ancho del cuadro de diálogo (que no debe confundirse con el ancho del control, que debe abarcar el ancho de la aplicación).
DialogHeight La altura del cuadro de diálogo (que no debe confundirse con la altura del control, que debe abarcar la altura de la aplicación).
SubTitle Texto mostrado bajo el título.

Propiedades del botón

Propiedad Description
Label La etiqueta que aparece en el botón.
ButtonType Enumeración que determina el estilo del botón. Elegir entre las versiones Standard y Primary.
Table(
    {
        Label: "Cancel", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Standard 
    },{
        Label: "Ok", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Primary
    }
)

Propiedades de estilo

Propiedad Description
Theme Objeto Tema. Más información sobre tematización.

Aprenda sobre el formateo en la sección de contenido del panel Formato de Panel.

Propiedades de evento

Propiedad Description
OnCloseSelect Expresión de acción que se ejecuta cuando se selecciona el botón de cerrar.
OnButtonSelect Expresión de acción que se ejecuta cuando se selecciona uno de los botones de acción.

Comportamiento

Configurar la visibilidad del diálogo

Haga que el propio control Dialog (o la superficie en la que se encuentra) sea visible cuando una variable booleana (verdadero/falso) cambie a verdadero. Asigne esa variable a la propiedad de visibilidad del diálogo. Una vez que se muestra el cuadro de diálogo, puede ocultarlo actualizando la variable en la propiedad de reinicio, que se activa cuando se selecciona el icono de cierre.

Lo siguiente muestra la fórmula Power Fx para abrir el cuadro de diálogo en una fórmula de acción de otro componente en algún lugar de la aplicación (por ejemplo, la propiedad OnSelect de un botón):

UpdateContext({ showHideDialog: true })

La siguiente es la fórmula Power Fx para cerrar el cuadro de diálogo en la propiedad OnCloseSelect.

UpdateContext({ showHideDialog: false })

Asigne la variable a la propiedad Visible del diálogo:

showHideDialog

Configurar acciones del botón

En la propiedad OnButtonSelect del diálogo, suministre acciones en una condición If() o Switch() basada en el valor de texto Self.SelectedButton.Label para definir la acción. Dependiendo de la acción, podría tener sentido cerrar también el cuadro de diálogo después de que se complete la acción.

    If( Self.SelectedButton.Label = "Send", 
        Notify("Email Sent")
    );
    UpdateContext({ showHideDialog: false })

Limitaciones

Este componente de Canvas solo se puede usar en aplicaciones de Canvas y páginas personalizadas.