Power Apps: aliadas de tu empresa

Todo inicia en un evento Convergence en 2015 en Barcelona, cuando Microsoft presentó las Power Apps, basadas en ofrecer un servicio hacia las empresas para crear aplicaciones como, por ejemplo, el registro de transacciones diarias, formato de aprobación de horas extras en el departamento de Recursos Humanos, control de citas para salones de belleza, catálogo de productos y servicios, envío de mensajes a WhatsApp, entre otras.

Luego de la pandemia, muchos curiosos decidieron explorar el área de tecnología porque todo en su entorno cambió de un día para otro. En ese punto, descubrieron las bondades de Power Apps, orientadas hacia desarrolladores para crear aplicaciones personalizadas, transformando operaciones empresariales manuales en procesos digitales para ser automatizados. Asimismo, las aplicaciones creadas en Power Apps se ejecutan sin problema alguno en un explorador y dispositivos móviles (tableta o teléfono).

Ventajas de aprender Power Apps

• No requieres conocimientos en lenguajes de programación.
• Permite conectar con distintos servidores de base de datos como Excel, SharePoint, SQL Server, Dynamics 365, entre otros.
• Ahorras tiempo y recursos para estructurar y diseñar las aplicaciones.
• Eres capaz de administrar el contenido compartido con tus compañeros para que accedan desde cualquier dispositivo.

Microsoft tiene la opción de crear cuentas gratuitas con un plan de 3 meses para desarrolladores, lo que permite utilizar una serie de aplicaciones limitadas. Por otra parte, tiene niveles de aprendizaje guiado donde acumulas puntos al finalizar cada unidad de un módulo, como se muestra a continuación:

Por ejemplo, personalizar una aplicación de lienzo en Power Apps, tiene 6 unidades con videotutoriales y su respectiva evaluación, los cuales corroborará tu dominio. Si los apruebas con éxito acumulas puntos o XP, logros y trofeos. Este sistema nos motiva a seguir aprendiendo y haciendo más unidades hasta ser expertos creando aplicaciones que, en un futuro, serán la solución a diversos problemas.

Power Apps ofrece plantillas hacia los usuarios mediante varias soluciones. Con este proyecto, aprenderás a crear una galería de productos para comparar.

Una vez que inicies sesión te aparecerá esta pantalla para que actives tu creatividad al máximo. Ahora te enseñaré cómo crear una aplicación con SharePoint.

El primer paso es seleccionar la tercera opción para crear la aplicación de tres pantallas (celular, tablet y computadora de escritorio) en SharePoint.

Microsoft ofrece servicios en la nube mediante SharePoint, una aplicación para crear listas y bibliotecas modernas y almacenar archivos y documentos que luego serán compartidos con otros espectadores, clientes y asociados.

Luego de presionar el botón Crear nos solicitará la conexión.

Debemos conectar con la lista que creamos en SharePoint. En el panel izquierdo. buscamos la cuarta opción, Datos, y luego vamos a Agregar Datos. Presionamos el botón Conectores, que te llevará a Conectar a un sitio de SharePoint.

Seleccionamos la primera opción:

Escribimos el nombre del sitio (ListadeProductos). Los otros campos son llenados automáticamente. Hacemos clic en Next.

Como último requisito, debemos agregar la cuenta donde se almacenarán los datos.

Ahora bien, ya hemos conseguido crear el sitio y procedemos a importar los datos de Excel. Para ello seguiremos estos pasos:

1.- Hacemos clic en + New, que seguidamente desplegará un menú.

2.- Seleccionamos la primera opción, List.

Seguimos con la creación de la tabla ListaFlorida en Excel, donde obtendremos los valores para el registro de los productos disponibles de la siguiente manera:

• Name: Nombre de los productos.
• CategoryId: Es el número asignado para cada empresa que está relacionado al producto.
• Category: Nombre de la empresa que vende el producto.
• Price: Precio del producto.
• Image: Link donde está almacenada la imagen del producto.
• Overview: Una breve descripción del producto.
• __PowerAppId__: Serie de caracteres que el propio sistema de Power Apps asigna en cada registro para que no existan duplicados.

3.- A continuación, vamos a From Excel, donde buscamos la carpeta en nuestra PC donde está guardado el archivo.

4.- Pulsamos el botón Next y nos aparecerá una ventana pidiéndonos una descripción de la lista.

¡Enhorabuena!, ya hemos creado la lista en SharePoint desde Excel.

Es recomendable que, al crear una aplicación, hagamos clic en el botón Guardar o CTRL+S para que se active el autoguardado y no pierdas tu avance.

Para este proyecto, seleccionaremos una aplicación vacía de modo de agregar estos elementos:

Esta aplicación en Power Apps consta de dos pantallas. La primera es una ScreenHome que se muestra a continuación:

La segunda es llamada ScreenComparar que se activará por medio del botón Comparar 0 Item(s) que está en la parte inferior derecha, que a su vez será visible los productos seleccionados en la pantalla anterior.

Inicialmente va un encabezado con el título del proyecto Pedido de Productos y, del lado derecho, un saludo y el nombre del desarrollador: Hola, Ana González.

Vamos a la pestaña Insertar 2 veces etiqueta de texto. Del lado derecho tiene un panel de propiedades para personalizar cada segmento de la aplicación. Es muy intuitiva porque, en ocasiones, tiene textos explicativos de cada función.

Volvemos a la acción Insertar Galería Vertical a la que llamaré GalleryFábricasLogos, donde se mostrarán los logos de las empresas y, al seleccionarlos, serán visibles los productos en la segunda Galería.

Los datos están creados en Excel y están distribuidos en dos tablas que luego se relacionarán. La primera Tabla, llamada ListaFlorida4, está compuesta por las siguientes columnas:

• NAME: Nombre de la empresa.
• CategoryID: Valor asignado a cada organización.
• Image: Link donde está almacenado el logo de la empresa.
• __PowerAppId__: Serie de caracteres que el propio sistema de Power Apps asigna en cada registro para que no existan duplicados.

Vamos al panel de Propiedades en la primera línea Origen de datos, seleccionamos ListaFlorida4, que contiene la tabla de Excel antes mencionada. Además, en la casilla Campos en el botón Editar hacemos clic en Image (la columna que contiene el link donde almacenamos la imagen).

Como solo quiero tener el logo, buscamos el campo Diseño y seleccionamos Dos columnas. Seguidamente, en la pestaña Avanzado debemos asegurarnos de que en las cajas de texto tengan esta información.

Los ítems ListaFlorida4 y Default First(ListaFlorida4) permiten que las imágenes se muestren al ejecutar la aplicación.

Ahora insertamos la segunda galería para visualizar los productos, nombres, precio y descripción llamada GalleryProductos.

Para tener el efecto de sombreado al presionar cada logo y que cambie el color de fondo, debemos ir hasta la última caja de texto, TemplateFill y colocar este comando:

If(ThisItem.IsSelected;ColorFade(LabelEncabezado.Fill;75%)).

Insertamos la segunda galería llamada GalleryProductos, la cual tendrá como origen de datos ListaFlorida, la cual explicaré detalladamente.

En la segunda tabla ListaFlorida obtendremos los valores para el registro de los productos disponibles de la siguiente manera:

• Name: Nombre de los productos.
• CategoryId: Es el número asignado para cada empresa que está relacionado al producto.
• Category: Nombre de la empresa que vende el producto.
• Price: Precio del producto.
• Image: Link donde está almacenada la imagen del producto.
• Overview: Una breve descripción del producto.
• __PowerAppId__: Serie de caracteres que el propio sistema de Power Apps asigna en cada registro para que no existan duplicados.

Avanzamos hacia la casilla Campos agregando los siguientes datos.

• Checkbox1: funciona para activar o desactivar el botón. En este caso, mientras esté seleccionado ese producto, se mostrará en la siguiente pantalla. En esta casilla vamos a escribir el siguiente comando para crear la colección Collect(collectcomparar;ThisItem), seleccionando OnCheck en la parte superior izquierda, donde recolectamos toda la información de cada producto de esta galería al estar activado.

Para ver la colección, nos vamos al menú que está del lado derecho de Tema.

Una vez seleccionado, nos mostrará los cinco primeros registros de la tabla ListaFlorida.

• Image1: imagen almacenada en la base de datos.
• Label4: formato que se le da al precio. Con el comando Text hacemos un llamado a la columna Price del archivo en Excel, agregándole el símbolo de la moneda y separador de miles y decimales: Text(ThisItem.Price;"[$-es]$###,00").
• Category: nombre de la empresa.
• Title1: nombre del producto.

El diseño de esta galería es Título y Subtítulo. Una de las ventajas de este formato es que añades un conjunto de elementos y éste se repetirá ajustándose en la galería.

En el precio tenemos un efecto: si el valor es mayor que 10, su color será rojo y, si es menor a 10, será negro. Puedes hacerlo con este comando If(ThisItem.Price>10;Color.DarkRed;Color.Black) en el panel Avanzado, casilla Color.

Debajo de esta GalleryProductos insertamos un botón para Limpiar o vaciar la selección. En el panel Avanzado agregamos una ACCIÓN OnSelect con este comando Clear(collectcomparar); así serán desactivados los botones de selección Comparar.

En la parte inferior derecha está el botón Comparar item(s). Vamos al panel Avanzado, agregamos una ACCIÓN OnSelect con el comando Navigate(ScreenComparar; ScreenTransition.Fade) para que, al pulsar este botón, nos lleve a la segunda pantalla y muestre los productos seleccionados.

Para el Texto usamos este comando "Comparar " & CountRows(collectcomparar) & " item(s)". Para ello, debemos crear una tabla para guardar esos datos a la que llamaremos collectcomparar.

Si has llegado a esta fase, te felicito, porque ya falta poco para finalizar este proyecto que he realizado para ti con mucho entusiasmo. Continuemos. Ahora creamos la otra pantalla duplicando la primera (ScreenHome). Para mantener el formato de encabezado y galerías busca en el panel izquierdo Vista de árbol, ScreenHome y Duplicar pantalla de la siguiente manera:

Eliminamos la GalleryFabricasLogos y ampliamos la GalleryComparar hasta cubrir todo el espacio. En el panel Propiedades, en el Origen de datos seleccionamos collectcomparar. Así, visualizamos la información de los productos cuando el checkbox Comparar esté activado. Y en el panel Avanzado en la casilla Items colocamos collectcomparar para que se ejecute el llamado de la colección.

Con esta imagen doy como terminado este bonito proyecto, que me encantó hacerlo. Me agrada la idea de que puedas aprender e implementar este conocimiento en tu área profesional y también en tu día a día. Espero que te haya gustado tanto como a mí.

¡Suerte y éxitos!