Entornos de Power Apps: configuración adecuada de los elementos de la aplicación

En este tutorial, le mostraré cómo diseñar correctamente sus entornos de Power Apps.

Una de las mayores ventajas de usar Power Apps es la cantidad de opciones de personalización, lo que le permite decidir cómo diseñar todo. El objetivo aquí es ayudarlo a familiarizarse más con cada parte del entorno de Power Apps para que pueda maximizar el uso de su aplicación.

Así es como se ve su entorno de desarrollo de Power Apps.

Crearé tutoriales separados que describirán y demostrarán en detalle cómo funciona cada parte. Pero por ahora, quiero concentrarme en lo que hacen estas diferentes partes y de qué son responsables.

Tabla de contenido

• El panel central de los entornos de Power Apps
• Pantallas, elementos y subelementos
• Cintas utilizadas en entornos de Power Apps
• Cambiar las propiedades de los elementos de la aplicación
• Conclusión

El panel central de los entornos de Power Apps

Permítanme comenzar con el área media. Aquí es donde puede ver la aplicación que está creando.

Hay un control deslizante de zoom en la parte inferior que puede usar para cambiar su vista y le permite acercar y alejar la aplicación.

Hay una flecha de dos puntas justo al lado del control deslizante de zoom, que le permite expandir la pantalla de la aplicación para que se ajuste a toda la ventana.

Pantallas, elementos y subelementos

El panel izquierdo muestra las diferentes pantallas dentro de la aplicación en la que está trabajando. Por el momento, está organizado en "Vista de árbol", que es la vista más utilizada. Le muestra cómo cada pantalla se ramifica en elementos más pequeños.

Entonces, si colapso algunas de las listas aquí a la izquierda, nos dice que hay tres pantallas en la aplicación en la que estoy trabajando actualmente: BrowseScreen1, DetailScreen1 y EditScreen1.

Si hago clic en la primera pantalla en el panel izquierdo, me muestra la pantalla de exploración de la aplicación. Esta pantalla solo muestra una lista de entradas provenientes de mi tabla de datos.

El segundo es para mi pantalla de detalles. Esto muestra los detalles de cada entrada en la lista en mi pantalla de navegación.

La última pantalla es para mi pantalla de edición, que me permite editar registros específicos o crear uno nuevo.

Si estas tres pantallas no son suficientes, es posible agregar una nueva pantalla. Voy a ir a través de eso en detalle más tarde.

Volvamos a la pantalla de exploración. Si hago clic en el menú desplegable, se mostrará una lista de todos los elementos presentes en mi pantalla de navegación.

El primer elemento aquí muestra una galería, que es básicamente una lista de registros. Cuando mire la aplicación en el panel central, verá que la galería cubre esta lista de registros desplazables.

Aquí hay un objeto etiquetado como Rectangle11, que es solo un rectángulo simple entre la barra de búsqueda y la galería.

También hay un ícono de búsqueda que es solo una imagen de una lupa.

Hay un cuadro de texto, que es donde puede escribir texto cuando busca un elemento.

Hay mucho más debajo de eso, con una larga lista de elementos que representan cada parte de la aplicación que está creando. Microsoft suele construir sus herramientas para un uso intuitivo, por lo que cada elemento está representado por un símbolo para mostrar lo que son o lo que hacen.

Por ejemplo, una galería será diferente a un rectángulo. Una galería es una lista de registros, por lo que está representada por un ícono que muestra diferentes ventanas. Un rectángulo es una forma, por lo que el icono que lo representa muestra una colección de formas. Un cuadro de texto le permite escribir texto en él, por lo que el icono muestra un bolígrafo.

Los elementos también pueden tener subelementos. Por ejemplo, BrowseGallery1 tiene otros elementos enumerados debajo. Esto tiene sentido sabiendo que la galería tiene muchas cosas sucediendo en la aplicación.

La galería tiene un elemento llamado Título1, por ejemplo, que es el nombre en la parte superior del registro de la galería.

Aparte del Título1, el registro de la galería también tiene un subtítulo y un cuerpo, así como una flecha siguiente y un separador que va entre los registros. Todos estos están representados por los subelementos en el panel izquierdo.

Cuando vaya más a la izquierda, puede acceder a un nuevo conjunto de opciones haciendo clic en las tres líneas.

Como puede ver, la primera entrada en el menú es la vista de árbol que hemos estado viendo. También te permite Insertar otros elementos.

También muestra las fuentes de datos utilizadas en el proyecto. En este caso, solo hay una fuente de datos integrada en la aplicación actual. Este viene de OneDrive.

También puede integrar diferentes entidades y conectores en Fuentes de datos, pero este es un tema más avanzado que se tratará en otros tutoriales.

El menú también muestra los medios utilizados en la aplicación. Aquí es donde puede cargar imágenes, videos y archivos de audio.

Para colapsar ese menú, simplemente haga clic en las tres líneas nuevamente.

Cintas utilizadas en entornos de Power Apps

Como ocurre con cualquier otro programa de Microsoft, la parte superior suele estar formada por cintas. Estas cintas ofrecen diferentes acciones categorizadas en diferentes menús.

Comencemos con la cinta Inicio.

Una de las acciones disponibles en la cinta de inicio es crear una nueva pantalla. Al igual que Powerpoint, hay plantillas para que elijas. Si cree que ninguna de estas plantillas es aplicable a la aplicación que está creando, puede comenzar con una pantalla en blanco.

Una vez que haya elegido una plantilla para su nueva pantalla, la verá agregada en la parte inferior de su vista de árbol.

También hay Temas, de los que hemos hablado en un tutorial reciente.

También puede seleccionar cualquier texto en su aplicación y cambiar la fuente, el tamaño de la fuente y el color de la fuente, o ponerlo en negrita, cursiva o subrayado.

También puede elegir cómo desea que se alinee su texto. Puede tenerlo alineado a la izquierda, alineado a la derecha o centrado.

La cinta de inserción le permite agregar o insertar cosas en entornos de Power Apps.

Por ejemplo, si desea insertar un elemento de etiqueta, puede simplemente hacer clic en el botón que dice Etiqueta e insertará ese elemento por usted.

También le permite insertar un botón.

Hay diferentes tipos de cuadros de texto que puede usar aquí. Simplemente haga clic en el menú desplegable debajo de Texto y podrá insertar entradas de texto, texto HTML, entrada de lápiz, etc.

También hay diferentes tipos de entradas, como cuadros combinados, selectores de fechas, listas, cuadros, casillas de verificación y controles deslizantes.

Puedes elegir diferentes tipos de galerías. En este momento, estamos usando una galería vertical para nuestra aplicación. Pero también puede tener una galería horizontal e incluso podría insertar imágenes en la pantalla.

La cinta Insertar también le permite agregar tablas de datos, que se analizarán a fondo en otro tutorial.

Aquí es donde también puede insertar formularios. Si recuerda la pantalla Editar en la aplicación que estamos creando, proporciona un formulario donde los usuarios pueden agregar datos manualmente a la aplicación. Simplemente haga clic en Formularios debajo de la cinta Insertar y podrá agregar otro formulario debajo de sus pantallas.

En cuanto a los medios, puede insertar imágenes, escáneres de códigos de barras, videos y audio. Aquí también puede darle a la aplicación la capacidad de activar la cámara, el micrófono y otras funciones del usuario.

Otras cosas que puede agregar con la cinta Insertar son gráficos, iconos y objetos personalizados.

Pasemos a la cinta Ver. Esto le permite ver variables, fuentes de datos y otras cosas relevantes para sus entornos de Power Apps.

Finalmente, la cinta Acción le permite realizar varias automatizaciones. Dado que esta es una parte más avanzada del tema, la analizaremos en un tutorial diferente.

Cambiar las propiedades de los elementos de la aplicación

Lo último de lo que quiero hablar es el lado derecho de la pantalla, que muestra el panel Propiedades.

Cada elemento utilizado en la aplicación tiene propiedades correspondientes. Digamos que queremos cambiar el encabezado de la aplicación que dice Table1. Puede hacer clic en el elemento específico aquí en el panel izquierdo para LblAppName1 o hacer clic en el elemento mismo en la aplicación para resaltarlo.

Una vez que el elemento esté resaltado, verá automáticamente las propiedades de ese elemento en el lado derecho.

Cada elemento tiene un conjunto diferente de propiedades. Cuando observa LblAppName1, se clasifica como una etiqueta como se indica sobre el nombre del elemento. Esto tiene una propiedad de texto donde puede cambiar el texto que aparece en la aplicación. También puede editar el texto directamente en este espacio.

Puede elegir el tamaño de fuente, el peso de fuente, el estilo de fuente, etc.

Los diferentes tipos de elementos también tienen diferentes conjuntos de propiedades. Veamos el ícono de actualización aquí en la aplicación. Si observa la vista de árbol, este es el elemento llamado IconRefresh1.

Cuando observa el panel de propiedades, puede ver que está categorizado como un icono. También tiene un conjunto diferente de propiedades como el icono utilizado, la rotación, el modo de visualización, etc.

Lo bueno de Microsoft Power Apps es que puede editar estas propiedades de dos maneras. Puede configurarlos de forma estática o dinámica.

Si volvemos al elemento Table1 y vamos a la propiedad Text, puedo editarlo directamente y cambiarlo a algo como Hello World. Eso cambiará automáticamente lo que aparece en la etiqueta real de la aplicación.

Lo que acabo de hacer fue cambiar la propiedad estáticamente.

Ahora, si observas la parte superior donde está la barra de fórmulas, verás que también puedes elegir diferentes propiedades en el menú desplegable del lado izquierdo.

Entonces, si elijo la propiedad de texto y escribo Hello World, hace lo mismo.

Aquí es donde puede cambiarlo dinámicamente. Aunque hay muchas formas de crear un cambio dinámico, te mostraré un ejemplo simple usando la función IF .

En la barra de fórmulas, escribiré IF(1=1), “Hello World”, “Table 1”). Básicamente, esto significa que si la declaración es verdadera, haga que Hello World aparezca en la etiqueta. Si no, haz que muestre Table1 .

Dado que esto se establece dinámicamente, también puedo hacer que esta condición sea falsa. Entonces, si cambio esto y escribo 1 = 0, automáticamente cambiará la etiqueta a Table1.

Hacer que las propiedades sean dinámicas significa que sus usuarios pueden cambiar estas propiedades en función de ciertos parámetros. Por ejemplo, podría permitir que los usuarios editen los títulos por sí mismos y luego almacenar esos cambios en una variable. Entonces, esta fórmula podría llamar a esa variable para establecer el título de este texto.

También puedes cambiar otras cosas. Por ejemplo, si hacemos clic en la entrada superior de la galería de Andy Chapman, puedo continuar y verificar cómo se mide la altura de esta entrada.

Puede ver que la altura de esta galería se establece dinámicamente para que sea la altura del padre menos la posición Y de la galería real. Esto significa que el tamaño de esta entrada es igual a la altura de la aplicación de arriba a abajo menos las coordenadas Y del propio elemento real. Entonces, si la altura es 100 de arriba a abajo, y el punto Y está en 10, entonces está configurando dinámicamente la altura en 90.

Este concepto es importante porque simplemente podría ir a las propiedades y cambiar manualmente el tamaño.

Pero diferentes aplicaciones tienen diferentes tamaños. Los diferentes elementos también tendrán diferentes coordenadas. Si configuro una altura estática, estropeará toda la aplicación en el momento en que cambie cualquier otra cosa.

Power Apps: Primeros pasos con esta herramienta revolucionaria
Cómo crear una cuenta de Power Apps | Tutorial de LuckyTemplates
Introducción a Power Apps: definición, características, funciones e importancia

Conclusión

Ver cómo se presenta todo en los entornos de Power Apps muestra aún más cuán intuitiva y fácil de usar es realmente esta herramienta. Desde la forma en que se muestra cada elemento y pantalla hasta la facilidad de cambiar cada propiedad para cada elemento, estos entornos de Power Apps definitivamente permiten a cualquier persona crear su propia aplicación y hacer que sus propios procesos sean mucho más eficientes.

Por supuesto, Power Apps no es solo para principiantes que recién comienzan a descubrir cuán útiles pueden ser las aplicaciones en su campo. También hay muchas funciones avanzadas que los usuarios más avanzados disfrutarían. Los cubriré en otros tutoriales.

Mis mejores deseos,

Enrique