Formularios emergentes de Power Apps para una experiencia de usuario interactiva

En este tutorial, le mostraré cómo crear un formulario emergente de Power Apps y cómo pueden ofrecer una experiencia de usuario más personalizada e interactiva. Puedes ver el video completo de este tutorial en la parte inferior de este blog.

Las ventanas emergentes de Form Power Apps son herramientas muy poderosas para brindar una experiencia personalizada a sus usuarios y permitirles validar algo que están a punto de hacer en una base de datos subyacente.

Por ejemplo, si vas a tu iPhone e intentas eliminar una aplicación, te preguntará si estás seguro de que quieres eliminarla. El motivo de esto es crear una interfaz de usuario muy buena que contenga pasos de validación para asegurarse de que desea realizar la acción que va a realizar.

Vamos a hacer lo mismo dentro de Power Apps. Es un poco difícil hacerlo en Power Apps de forma nativa porque la forma en que funciona Power Apps es que tienes elementos que van en una pantalla. No se puede superponer una pantalla a otra pantalla. Entonces, lo que hacemos es usar un método de agrupación para imitar eso. Ahora entraremos en Power Apps y le mostraré cómo se hace.

Tabla de contenido

• Cómo crear una ventana emergente de Power Apps de formulario
• Conclusión

Cómo crear una ventana emergente de Power Apps de formulario

Vayamos al Editor de Power Apps. En este ejemplo, estoy en el proceso de crear una aplicación de informes de gastos para mi negocio. En el lado izquierdo de la pantalla, tengo una galería de todos mis gastos. Puedo hacer clic en un gasto y obtener más información sobre ese gasto en el lado derecho.

Podemos ver más información sobre ese informe de gastos, como la descripción, el monto, la categoría, el estado, etc., etc.

Además de esto, puedo hacer clic en Editar y, en la parte inferior, hay un ícono de papelera que también me permite eliminar este registro.

Ahora, quiero crear un formulario emergente para que si un usuario ingresa y elimina un registro, aparece un cuadro de mensaje para confirmar si el usuario realmente desea eliminar el registro o no.

Lo primero que voy a hacer es agregar un rectángulo que cubra toda la pantalla. Parecerá que la pantalla está un poco descolorida solo para reflejar la apariencia de una pantalla una encima de la otra.

Entonces, iré a Insertar , luego iré a Iconos, e iré hasta el final hasta Rectángulo. Me aseguraré de que el rectángulo cubra toda la pantalla.

Lo siguiente que voy a hacer es cambiar el color de esta forma a gris oscuro. Luego iré a la propiedad Relleno de este rectángulo. Tenemos el rojo, el verde y el azul, pero también tenemos el valor alfa, que representa la opacidad o la transparencia. Haremos que la transparencia sea 0.7, para que parezca que está algo descolorida.

A continuación, agregaremos otro rectángulo, que será nuestro cuadro emergente. Luego, agregaremos una etiqueta, que es una especie de advertencia para el usuario. Podemos cambiar los colores y ajustar el tamaño de la fuente.

Ahora, queremos mostrarle al usuario el registro que realmente va a eliminar. Entonces, queremos valores, como el nombre, la cantidad y probablemente la categoría del informe de gastos que están a punto de eliminar.

Para hacer eso, regresemos a nuestra etiqueta y agreguemos el nombre, la cantidad y la categoría. El registro que queremos mostrar se basa en el registro que se seleccionó en la galería subyacente. La galería subyacente aquí se llama Galería 1 . Entonces, el nombre del elemento que se seleccionó en la galería uno es simplemente Gallery1.Selected.Title . La cantidad será Gallery1.Selected.Amount y, para la categoría, será Gallery1.Selected.Status.Value.

Luego agregaremos dos botones. Un botón será básicamente Eliminar y el otro será simplemente Volver . También ajustaremos el color y el tamaño.

Ahora, debemos asegurarnos de que cuando alguien haga clic en el ícono de la papelera o la papelera, no elimine el registro, sino que muestre este cuadro emergente. Para lograrlo, resaltaremos todas las cosas en nuestro cuadro emergente, haga clic con el botón derecho y seleccione Grupo .

Esta es una de las mejores cosas de Power Apps. Nos permite agrupar elementos. Con eso, ha creado un grupo llamado Group1 .

Lo bueno de esto es que si modifica la propiedad de un grupo, por ejemplo, la visibilidad, afectará a todas las demás propiedades. Es muy agradable tener algo como esto que todo encaja. Es genial agruparlos porque podemos controlar todas las propiedades de esos elementos a la vez.

Por ejemplo, queremos controlar la visibilidad de todas estas propiedades y hacerlas "falsas" por ahora, desaparece.

Ahora, intentemos seleccionar el icono de basura y, como puede ver, cuando se selecciona, hace todas estas funciones, y estas funciones básicamente aseguran que el registro se haya eliminado. Pero no queremos eso. Entonces, copiaremos esto por ahora y lo pondremos en un bloc de notas vacío, solo para que se guarde en algún lugar. Esta es la función real que hemos creado para eliminar el registro y simplemente lo eliminaremos.

Y ahora, crearemos una nueva variable que controlará cuándo aparece realmente el formulario. Llamemos a esta variable la función de conjunto. Nombremos nuestra variable, ConfirmPopUp , y estableceremos eso en verdadero.

Luego seleccionaremos el grupo y estableceremos la propiedad de visibilidad en esa variable, que es ConfirmPopUp. Dado que se establece en verdadero, vemos todo.

Lo siguiente que vamos a hacer es hacer clic en Regresar y vamos a tener una acción asociada con hacer clic en eso. Cuando alguien selecciona eso, queremos que la visibilidad del Grupo1 sea falsa.

A continuación, debemos cambiar la acción OnSelect del botón Eliminar para ejecutar las funciones que guardamos en el bloc de notas.

Lo último que debemos hacer es después de que alguien haya hecho clic en el botón Eliminar, también queremos deshacernos de la ventana emergente. Entonces, agregaremos otra acción y estableceremos la variable ConfirmPopUp en falso. Y así es como usaría las ventanas emergentes dentro de Power Apps.

Microsoft Power Apps: Agrupación de elementos
Entornos de Power Apps: Configuración adecuada de los elementos de la aplicación
Power Apps: Primeros pasos con esta herramienta revolucionaria

Conclusión

Una razón para usar las ventanas emergentes de Power Apps es crear una experiencia personalizada para sus usuarios. Otra es crear algún tipo de validación para sus usuarios también porque es beneficioso para sus usuarios.

Se trata de crear una interfaz de usuario para sus usuarios para que no tengan que ir a la lista o base de datos de SharePoint subyacente y confundirse con la edición y eliminación de ciertas cosas. Pueden hacerlo desde la seguridad de una interfaz de usuario que ha creado para ellos para que no arruinen nada. Los formularios emergentes son una herramienta poderosa para lograrlo.

Avíseme si tiene alguna pregunta y deje comentarios en la sección de comentarios a continuación.

¡Mis mejores deseos!

Enrique