1 of 128

Taller

Power Apps

Ing. Alexis David Casas Riveros

2 of 128

Objetivos

  • Crear y diseñar aplicaciones con Microsoft Power Apps
  • Entender los diferentes widgets en Power Apps
  • Descubrir el concepto NoCode a través de la Microsoft Power Platform
  • Crear nuestra primera aplicación integrada com Power Automate, Teams y Outlook.

3 of 128

Ing. Alexis David

Casas Riveros

¡Hola a todos! Mi nombre es Alexis Casas Riveros, y hoy estaré guiándolos en el aprendizaje de Power Apps, una herramienta poderosa para crear aplicaciones personalizadas sin necesidad de programación.

  • Mi experiencia con Power Apps y herramientas No Code:
    • He implementado soluciones tecnológicas utilizando Power Apps para automatizar procesos en empresas de diversos sectores, como Fintech, Agroindustrial y Consumo Masivo.
    • He desarrollado aplicaciones que optimizan flujos de trabajo, reducen tiempos de ejecución y mejoran la eficiencia operativa.
    • Como docente en UNMSM – CERSEU, he impartido cursos sobre Power Apps y otras herramientas No Code, ayudando a estudiantes y profesionales a dominar estas tecnologías para aplicarlas en sus propios proyectos.
  • ¿Por qué aprender Power Apps?
    • Facilidad de uso: Power Apps permite crear aplicaciones funcionales sin necesidad de ser un experto en programación.
    • Integración con otras herramientas: Se integra perfectamente con Microsoft 365, SharePoint, Power Automate y otras plataformas, lo que la hace ideal para automatizar procesos empresariales.
    • Ahorro de tiempo y costos: Con Power Apps, puedes desarrollar soluciones personalizadas en cuestión de horas o días, en lugar de semanas o meses

4 of 128

5 of 128

Plataformas No Code

Crear una solución digital sin ser un programador; Citizen Developer

6 of 128

¿Cómo obtener una cuenta de Power Apps premium de forma gratuita?

Para ingresar y crearte la cuenta free entra a este enlace 😏

7 of 128

Creamos nuestra primera conexión

  1. Descarga los siguientes archivos y guárdalos en tu onedrive
    • Link de descarga aquí 😎

  1. Para conocimiento la lista de todas las fórmular de Power Apps, se encuentra en este link: Lista de formulas en Power Apps

8 of 128

Funciones con Formulario

Formula: SubmitForm(Nombre del Formulario)

Concepto: Registra una nueva fila en un formulario.

Ejemplo: SubmitForm(Form2)

Registra una nueva fila en el Form2

9 of 128

Widget: Boton (Btn)

Fórmula: Navigate(‘Nombre de la Pantalla’)

Concepto: Nos redirige a otra pantalla.

Ejemplo:

Navigate(‘Screen1’)

Nos redirige a la pantalla Screen1

Fórmula: Launch(“URL”)

Concepto: Para mostrar enlaces externos

Ejemplo:

Launch(“https://globaltechup.com”)

Nos redirige a la página de TechUp

10 of 128

Widget: Label (Txt)

  • Función: User().

Ejemplo:

User().FullName : Muestra el nombre completo del usuario

User().Email : Muestra el correo del usuario

Today(), nos muestra la fecha de hoy.

11 of 128

Funciones de Fecha y Hora

Función: IsToday(nombre del widget.formato)

Concepto: Nos devuelve un valor True si la fecha a verificar es la del día de hoy.

Ejemplo:

IsToday(fecha.Text): False, ya que la fecha del día de hoy no es 22/03/2025

Day(fecha)Month(fecha) || Year(fecha) || Now() || Hour(time)

Minute(Now()) || Date(año;mes;día) || Date(22;03;2025)

Para mayor documentación revisar link 💪🏻

12 of 128

Propiedades de Color

RGBA(255; 255; 255; 1)

% de Transparencia

13 of 128

Funciones de Texto

Función: Concatenate(“Texto”;”Texto”; ….)

Ejemplo:

Concatenate(“Alexis”;”Casas”): Alexis Casas

Cuando extrae de una etiqueta de texto:

Concatenate(Label1.Text): Rosario Elizabeth Lindo Pascual

Len(“Texto”): Devuelve el número de caracteres

14 of 128

Funciones Texto parte 2

StartsWith(“Texto”;inicio)

Concepto: Devuelve verdadero si el texto proporcionado comienza con la cadena inicio proporcionada.

Ejemplo: StarsWith(“Hola como estas”;”Hola”) : True.

EndsWith(“Texto”;final)

Concepto: Devuelve verdadero si el texto proporcionado termina con la cadena final proporcionada.

Ejemplo: EndsWith(“Hola como estas”;”Hola”) : False.

15 of 128

Funciones numéricas

Max(número;número;…)

Concepto: Devuelve el valor máximo

Min (número;número;…)

Concepto: Devuelve el valor mínimo

Sum(número;número;…)

Concepto: Devuelve la suma de todos los valores numéricos

IsNumeric(valor):

Concepto: Devuelve verdadero si el valor es un número.

16 of 128

Función: Imprimir y Notificaciones

Print()

Concepto: Permite imprimir la página a presentar

Notify(Texto;Tipo de Notificación; tiempo de espera)

    • Tipos de Notificación:
      • NotificationType.Information : Mensaje informativo
      • NotificationType.Success : Mensaje Exitoso
      • NotificationType.Warning : Mensaje de Alerta en amarillo
      • NotificationType.Error : Mensaje de Error en rojo

Tener en cuenta que el tiempo de espera es en milisegundos.

17 of 128

Condiciones y Comprobación de Datos

  • If (prueba lógica; resultado_verdadero; resultado_falso)

  • IsMatch ( Texto1 ; Texto2 ): Compara que las dos cadenas de texto sean iguales entonces dará como resultado True.

  • IsBlank(Texto1): Comprueba que el valor sea vacío, entonces dará True.

18 of 128

Colecciones Estáticas en Power Apps

Genera una nueva tabla dentro de la misma aplicación que se almacenará en la memoria caché.

Collect(NombreTabla; {Columna1: Texto1; Columna2: Texto2})

Ejemplo:

Collect(Clientes;{Nombre: "Alexis";Apellido: "Casas"})

19 of 128

Colecciones Dinámicas en Power Apps

Vamos a crear dos etiquetas de texto para poder registrar los datos, como se vee en la imagen:

El botón tendrá la siguiente función:

Collect(ClientesDinamicos;{Nombre: TxtNombre.Text;Apellido: TxtApellido.Text})

Si le queremos agregar una notificación agregaremos:

;;Notify("Se guardo correctamente";NotificationType.Information)

20 of 128

Colecciones en Galerias

21 of 128

Eliminar Elementos de una Galería (Registros)

Remove (Colección; Elemento)

Concepto: Elimina elementos de una colección

Ejemplo:

Remove(ClientesDinamicos;ThisItem)

22 of 128

Eliminar Elementos Dinámicos

Ejemplo:

Remove(ClientesDinamicos;{Nombre: TxtNombre.Text;Apellido: TxtApellido.Text}). Elimina texto desde un objeto entrada de datos.

Remove(ClientesDinamicos;ThisItem). Elimina desde la misma coleccion con un icono.

Elimina uno a uno los que cumplen con la función.

23 of 128

Eliminar Elementos y Condiciones

RemoveIf ( Colección; Condición; ….)

Concepto: Borra a todos los que cumplen la condición.

Ejemplo: RemoveIf(ClientesDinamicos;Nombre = TxtNombre.Text)

Nota: Tener en cuenta que Nombre es uno de los campos de la colección de ClientesDinamicos.

Reset ( Objeto1; Objeto2; ….)

Concepto: Restablece un control al valor de su propiedad por default.

Ejemplo: Reset(TxtNombre);;Reset(TxtApellido)

24 of 128

Limpiar Datos

Clear (Colección)

Concepto: Limpia todos los datos de una colección

Ejemplos: Clear(ClientesDinamicos)

ClearCollect(Colección; {elemento; …}) : Limpia y reemplaza los datos con otros elementos.

Ejemplo:

ClearCollect(ClientesDinamicos; {Nombre:"Alexis";Apellido:"Casas"})

25 of 128

Caso de Uso: SOLICITUDES DE MATERIALES

  • Solicitud de material de oficina.
  • Gestionar un proceso de aprobaciones.
  • Enviar notificaciones.
  • Actualización de estado de los pedidos.

Herramientas a usar:

  • Microsoft Power Apps
  • Microsoft Power Automate
  • Microsoft Lists
  • Aprobaciones de Microsoft Teams

Enunciado de Ejercicio

26 of 128

Filter aplicado a Colecciones

Nos permite filtrar apartir de cuadros de Texto o datos fijos.

Filter(Colección; elemento; elemento2; ...)

Ejemplo: Filter (Clientes;Nombre = TxtFiltro.Text), filtra lo que se coloque en el cuadro de texto de manera completa.

27 of 128

Filter aplicado a Colecciones parte 2

Como mostrar toda la tabla cuando no hay escrito nada, de la siguiente manera:

Ejemplo: If(IsBlank(TxtFiltro.Text);Clientes;Filter(Clientes; Nombre = TxtFiltro.Text))

, filtra lo que se coloque en el cuadro de texto de manera completa y cuando esta vacío muestra toda la tabla

28 of 128

Filter aplicado a Colecciones parte 3

Como filtrar con solo una parte de la palabra que quieres buscar, de la siguiente manera:

Search(Colección; Texto; Columna; ...)

Ejemplo: Search(Clientes;TxtFiltro_1.Text;Nombre;Apellido)

, filtra lo que se coloque en el cuadro de texto de manera completa, cuando esta vacío muestra toda la tabla, y si se escribe parte de la palabra a buscar

29 of 128

Filter aplicado a Colecciones parte 4

Para obtener un valor buscado en una colección apartir de un dato, se usará lo siguiente:

LookUp(Origen; Condición1; ...)

Ejemplo:

LookUp(Clientes;Nombre=TxtFiltro_1.Text).Apellido

, encuentra un dato en la colección o tabla apartir de otro valor, muy parecido a como funciona el buscarv en Excel.

30 of 128

Variable Global

Una variable global puede mostrarse y usarse en toda la aplicación (en todas las pantallas de la aplicación).

Ejemplo: Set(VariableGlobal;100)

31 of 128

Función: UpdateContext

Se utiliza para crear o actualizar variables de contexto.

Sintaxis:

UpdateContext({NombreVariable1: Valor1, NombreVariable2: Valor2, ...})

Ejemplo:

UpdateContext({textoGuardado: InputTexto.Text});Actualiza la variable de contexto textoGuardado con el valor del texto del cuadro de texto InputTexto.

UpdateContext({mostrarTexto: true}); actualiza una variable booleana para controlar la visibilidad del texto en la etiqueta (opcional, pero útil para ejemplos más complejos).

32 of 128

Ordenar Elementos

Se utiliza para ordenar elementos con variables de contexto.

Sintaxis:

UpdateContext({NombreVariable1: Valor1, NombreVariable2: Valor2, ...})

Ejemplo:

UpdateContext({ordenarelementos: Sort(Clientes; Nombre)})

Actualiza la variable de contexto textoGuardado con el valor del texto del cuadro de texto InputTexto.

33 of 128

Actualizar elementos y condiciones

Se utiliza para modificar elementos de manera masiva en una colección.

Sintaxis:

UpdateContext(DataSource, Condition, {ChangeRecord1: Valor1, ...})

Ejemplo:

UpdateIf(Clientes; Nombre = "Alexis";{Nombre: TxtNombre_3.Text})

Actualiza la variable de contexto textoGuardado con el valor del texto del cuadro de texto InputTexto.

34 of 128

Eliminar Duplicados

Se utiliza para extraer valores únicos de una columna.

Sintaxis:

Distinct(Origen, NombreColumna)

Ejemplo:

Distinct(Clientes;Nombre)

Muestra los valores únicos.

35 of 128

Fórmulas con Columnas

Fórmula

Descripción

AddColumns (IceCreamSales, Revenue, UnitPrice*QuantitySold)

Añade la columna Revenue a la tabla, Unit Price * QuantitySold es evaluado y el resultado se muestra en una columna.

DropColumns(IceCreamSales, UnitPrice)

Excluye la columna UnitPrice de la tabla. Usa esta función para eliminar columnas.

ShowColumns(IceCreamSales, Flavor)

Incluye solo la columna Flavor en la tabla, usa esta función para solamente mostrar la columna Flavor..

RenameColumns(IceCreamSales, UnitPrice, Price, QuantitySold, Number)

Renombra la columna UnitPrice y QuantitySold en el resultado, y los renombra con Price y Number respectivamente.

DropColumns( RenameColumns (AddColumns (IceCreamSales, Revenue, UnitPrice*Quantity), UnitPrice, Price),Quantity)

  1. Añade una columna Revenue con el siguiente calculo: UnitPrice * Quantity
  2. Renombra UnitPrice por Price
  3. Excluye la columna Quantity

36 of 128

Fórmulas con Columnas

Se crea una variable apartir de una tabla Clientes, y se elimina una de sus columnas.

37 of 128

Estados en los Formularios de Power Apps

Modo Predeterminado en el Formulario:

  • Nuevo: Registra nuevos filas en las tablas.
  • Editar: Llama a un registro y permite editarlo.
  • Vista: Visauliza el registro de un formulario y no permite editarlos.

38 of 128

Funciones en los Formularios - Nuevo

  • SubmitForm(Form1),registra un nuevo dato desde un formulario, para ello el formulario debe estar en modo NUEVO.
  • NewForm(Form1), inicializa el formulario en modo NUEVO.

39 of 128

Funciones en Formularios - Visualización

  • ViewForm(Form1),cambia el formulario a modo visualización.
  • NavigateForm(NombrePantalla), redirige a otra pantalla.
  • Gallery1.Selected, muestra la opción seleccionada en el formulario, para esto debes activar la propiedad “Item”

1

2

40 of 128

Funciones en Formularios - Edición

  • EditForm(Form1),cambia el formulario a modo Edición.
  • NavigateForm(NombrePantalla), redirige a otra pantalla.
  • Gallery1.Selected, muestra la opción seleccionada en el formulario, para esto debes activar la propiedad “Item”

1

2

41 of 128

Funciones en Formularios - Eliminar

  • Remove(Form1;Gallery2.Selected),elimina el dato seleccionado mostrado en el formulario.

42 of 128

Notificaciones Pop-Up (Diseño)

  • UpdateContext({visibilidad: true},se crea una variable local esto nos servirá para mostrar el pop-up.

43 of 128

Notificaciones Pop-Up (Fórmula)

  • UpdateContext({visibilidad: false},Botón No. Esto aplicará que toda la visibilidad del pop-up se vuelva a ocultar.
  • Remove(Tabla1;Gallery2.Selected);;Navigate(Parte6Principal);;UpdateContext({visibilidad: false}), Botón Sí. Elimina el registro seleccionado,, se dirige a la tabla principal y oculta el pop-up.
  • Group; selecciona los elementos del pop-up

44 of 128

Notificaciones Pop-Up (Fórmula)

El Group creado se selecciona y se modifica la propiedad “Visible”, añadimos la variable local “visibilidad”.

45 of 128

Gestión de Roles en Power Apps

  1. Se muestra la galería de la tabla “Heroes”; contiene un buscados que filtra por el nombre y además solo será visible los datos que coincidan con el dato de la columna creador.

46 of 128

Caso de Práctico: Digitalización de Firmas

  • Registrar Datos del usuario (firma)
  • Transformación a imagen de la firma
  • Automatización de documentos PDF.
  • Integración y proceso automático.

Herramientas a usar:

  • Microsoft Power Apps
  • Microsoft Power Automate
  • One Drive

Enunciado de Ejercicio

47 of 128

Estructura y Navegación de la App

  1. Ingresar el objeto/widget de firma manuscrita

2. Agregar los demás objetos, que se nuestran en la figura acontinuación

48 of 128

Crear variable para almacenar contenido

  1. Creamos una variable, recopilamos el contenido de la entrada manuscrita hacia la variable “firmadigital”.

Set(firmadigital;JSON(PenInput1.Image;JSONFormat.IncludeBinaryData))

El resultado es la imagen en base 64.

x

49 of 128

Obtener contenido de imágenes

  1. Del resultado de la última formula, vete a buscar la “,” (coma) en la cadena de texto y toma la parte de atrás.

Last(Split(firmadigital;",").Value).Value

x

50 of 128

Obtener contenido de imágenes

  1. Del resultado de la formula, hace lo mismo que el anterior pero no toma la “,”.

Mid(firmadigital;24;Len(firmadigital)-24)

x

51 of 128

Proceso de Power Automate

  1. Activamos el proceso de Power Automate, y recuerda el orden de los datos para el paso de la información en Power Apps.

Recuerda que el orden va a ser el mismo que coloques en la fórmula cuando hagas el paso de parámetros.

52 of 128

Proceso de Power Automate Parte 2

  1. En la ruta donde irá colocado la información.
  2. Aprovechamos el nombre pasarlo a imagen.
  3. Contenido que esta en formato 64 lo pasamos a binario
  1. Añadimos el paso de One Drive.

Guardamos el flujo por último.

53 of 128

Proceso de Power Automate Parte 3

  1. ¿Cómo llamo la función del proceso desde Power Apps? Usamos la Función Run.

FirmasApps.Run(TxtFecha.Text;TxtNombre.Text;Mid(firmadigital;24;Len(firmadigital)-24))

54 of 128

Recepción de Parámetros

Ejecuta la función y se obtendrá que la imagen aparecerá dentro de la carpeta que elegiste.

55 of 128

Documento Base

Ejecutamos la pestaña desarrollador en el documento y añadimos la opción de “control de contenido de texto sin formato” en la fecha y cliente; en el caso de la firma será el “control de contenido de imagen”

56 of 128

Firma de Contrato

Agregamos un nuevo paso a nuestro flujo en power Apps, esto lo hacemos escogiendo One Drive y la función “Obtener contenido de Archivo” o “Get File Content”. En archivo colocamos al identificador haciendo uso del que ya fue creado.

57 of 128

Configuración de Región

Para encontrar ciertas funciones en power automate es mejor cambiar la configuración temporalmente a Inglés y dejarlo en País Estados Unidos.

58 of 128

Añadimos Nueva Función

Agregamos un nuevo paso que lo encontraremos como “Populate a Microsoft Word template” en la plataforma de Power Automate, completo la ubiación de la plantilla dinámica.

59 of 128

Añadimos Nueva Función Parte 2

Agregamos los parámetros que ya llevamos teniendo de la función anterior, como se vee en la imagen.

60 of 128

Añadimos Nueva Función Parte 3

Agregamos la función de agregar un archivo, con los siguientes datos

61 of 128

Añadimos Nueva Función Parte 4

Previamente a correr la aplicación, actualizaremos el flujo de power automate dentro de aplicación de power apps, el resultado se verá de la siguiente manera.

62 of 128

Listas desplegables en Cascada

  1. Seleccionamos la opción de Lista desplegable o DropDown, dependiendo la configuración regional.

2. Agregamos el origen de datos

Tener en cuenta que si es excel deberá estar con formato Tabla.

63 of 128

Listas desplegables en Cascada Parte 2

Añadimos la función “Distinct” para que me extraiga valores únicos del origen, y elegimos la columna a mostrar.

Para la primera lista desplegable.

Para la segunda lista desplegable.

Distinct(Filter(Table1;Marca = cmb_Marca.Selected.Value); Modelo)

64 of 128

Listas desplegables en Cascada Parte 3

Para que la lista desplegable se vuelva en selección única, se cambiará la propiedad “SelectMultiple” a False

65 of 128

Listas desplegables en Cascada Parte 4 - DisplayMode

Para que la lista desplegable no se pueda editar si su predecesor, no tiene valor alguno

66 of 128

Listas desplegables en Cascada Parte 5 - Reset

Reinicia a los valores por defecto de cada uno de los objetos o widgets.

67 of 128

Caso de Práctico: Listas Desplegables

  • Buscador de 3000 productos
  • Listas desplegables para las búsquedas personalizadas

Herramientas a usar:

  • Microsoft Power Apps
  • Sharepoint
  • One Drive

Enunciado de Ejercicio

68 of 128

Advertencia: Función Search

La función Search, permite hacer búsquedas de hasta 2000 registros como máximo, una vez pasado el límite se recomienda usar otro tipo de funciones.

69 of 128

Función en lista desplegable

Esta formula se aplica a las listas desplegables y se añade sort para ordenar alfabeticamente.

70 of 128

Personalización en Formularios (Avanzado) - Caso de Uso

  • Registro y Seguimiento de Tickets.
  • Edición de los registros de Tickets.
  • Responsive en Celular, PC y Tablet.
  • Objetos de Control Personalizados.

Herramientas a usar:

  • Microsoft Power Apps
  • Sharepoint (Files)

Enunciado de Ejercicio

71 of 128

Personalización en Formularios - Cargar Data

Tener en cuenta que:

No importar la opción de Responsable y la Opción Activo.

72 of 128

Personalización en Formularios - Data Cargada

73 of 128

Personalizar el diseño de la Galería

74 of 128

Personalizar el diseño de la Galería Parte 1

En la propiedad “Ajustar recuento”, se puede disponer de la cantidad de columnas que tendrá la galería.

75 of 128

Personalizar el diseño de la Galería Parte 2

Se aconseja llevar la galería en un container para tener el control del tamaño y además de los contornos del objeto.

76 of 128

Personalizar el diseño de la Galería Parte 3

La función Text(), ayuda a darle un formato a fechas, números enteros o decimales u otros valores para poder personalizar la presentación.

77 of 128

Personalizar el diseño de la Galería Parte 4

Función ViewForm(); vista de formulario

Función EditForm(); edición de formulario

78 of 128

Personalización en Formularios - Parte 1

Vamos a cargar el formulario por defecto, y veremos que ya contamos con algunos objetos de control personalizados.

79 of 128

Personalización en Formularios - Botón de Selección

Cambiamos el Cuadro Combinado por botón de selección, además configuramos el objeto.

Enlista los items de la tabla, y muestra los datos de la columna 4

Botón de Selección

Agarramos el DataCard y en la propiedad Update actualizamos el nombre del objeto

1

2

3

80 of 128

Personalización en Formularios - Botón de Selección

Botón de Selección

En la propiedad “Default”, recordar colocar el valor seleccionado por la galeria previamente, como muestra en la figura.

2

1

Cambiamos en sentido horizontal.

81 of 128

Personalización en Formularios - Control Deslizante

En la propiedad “Max”, cambiamos el valor por 4 (cantidad de items a elegir en la columna propiedad).

Control Deslizante

2

1

Cambiamos en sentido horizontal.

82 of 128

Personalización en Formularios - Control Deslizante

En la propiedad “Default”, usaremos la fórmula Switch(cambiar_valor; comparar_valor_1; comparar_resultado_1; …)

Control Deslizante

1

Cambiamos en sentido horizontal.

El objeto lo dejamos de “solo lectura” para el usuario.

83 of 128

Personalización en Formularios - Cuadro de Lista

Cambiamos el “Cuadro Combinado” por “Cuadro de Lista”, además configuramos el objeto.

Enlista los items de la tabla, y muestra los datos de la columna 3

Cuadro de Lista

Agarramos el DataCard y en la propiedad Update actualizamos el nombre del objeto

1

2

3

84 of 128

Personalización en Formularios - Cuadro de Lista

Cuadro de Lista

En la propiedad “Default”, recordar colocar el valor seleccionado por la galeria previamente, como muestra en la figura.

2

1

Arreglar los errores, seleccionando el objeto

85 of 128

Lista desplegable en Formularios

Dentro de cada formulario se puede agregar combobox o cuadro combinado y a este objeto cambiarle los errores como se vee en la pantalla.

86 of 128

Personalización en Formularios - Cuadro Combinado

En la propiedad “Default”, colocar la formula Choices()

1

Activamos las propiedades selección múltiple y búsqueda y cambiamos el texto a aparecer.

Cuadro Combinado

2

87 of 128

Personalización en Formularios - Alternar

En la propiedad “Default” del Toggle, colocamos el valor por defecto que viene de la tabla.

Además usamos las propiedades FalseText y TrueText para establecer que valores se muestra en la etiqueta.

1

Resolviendo los errores al seleccionar el objeto de control añadido al formulario.

2

Alternar

88 of 128

Personalización en Formularios - Organización del Formulario

Organizar el formulario de acuerdo a la imagen, tener en cuenta que se pueden introducir titulos y subtitulos dentro del formulario.

89 of 128

Personalización en Formularios - Resultado Final

90 of 128

Diseño Responsive Parte 1

Para hacer responsive un diseño tenemos que empezar a usar los contenedores.

Colocamos el contenedor en la parte superior de la vista de árbol y en la propiedad Width y Height colocamos Parent.Width y Parent.Height

91 of 128

Diseño Responsive Parte 2

Colocamos primero contenedor vertical y dentro de este, el contenedor horizontal y desactivamos para el contedor horizontal la propiedad de Altura Flexible.

92 of 128

Diseño Responsive Parte 3

Acomodamos el diseño como se muestra en la Vista Árbol para obtener el resultado mostrado, si es necesario editamos las propiedades Width y Height.

93 of 128

Diseño Responsive Parte 4

Activamos ancho flexible para que se pueda regular al cambiar de dispositivos.

94 of 128

Diseño Responsive Parte 5

Introducimos nuestro formulario y el botón en el contenedor principal, la vista de árbol se verá de la siguiente manera.

Activar el ajuste en columnas del formulario

95 of 128

Diseño Responsive Parte 5

Activamos en todos los DataCard la propiedad “Ajuste del Ancho” en activado o true.

Verifica que las entradas de texto del formulario tengan esta fórmula.

96 of 128

Gestión de Roles - 1era Opción

Filtramos nuestra vista galería con la función User().FullName ; como se visualiza en la imagen.

1

97 of 128

Gestión de Roles - 2da Opción

Para ejecutar la variable local, le damos clic a “Ejecutar la regla OnStart.

Toma el dato del nombre completo del usuario al iniciar la aplicación.

1

2

98 of 128

Gestión de Roles - 2da Opción

3

Filtramos nuestra vista galería con la variable así como se ve en la figura; como se visualiza en la imagen.

Tener en cuenta que:

La gran diferencia, es que los datos se filtraran una vez que se inicialice la aplicación, si aplicamos sin el paso anterior el usuario verpa toda la lista completa y recién se aplicaría el filtro.

99 of 128

Gestión de Roles - 2da Opción (Vers Completa)

Para ejecutar la variable local, le damos clic a “Ejecutar la regla OnStart.

Toma el dato del usuario al iniciar la aplicación.

1

2

100 of 128

Gestión de Roles - 2da Opción

3

Filtramos nuestra vista galería con la variable así como se ve en la figura; como se visualiza en la imagen.

En este caso podemos usar la variable como la función User().FullName

101 of 128

Gestión de Roles - Usuario de Office 365

Nos permite acceder a los perfiles de usuario de la organización a través de la cuenta de Office 365.

1

102 of 128

Gestión de Roles - Usuario de Office 365

Permite agregar una gran información de los usuarios, y luego corremos la regla OnStart.

2

103 of 128

Gestión de Roles - Usuario de Office 365

3

Tener en cuenta que:

Al revisar la variable se observará una gran información del usuario.

104 of 128

Gestión de Roles - Usuario de Office 365

4

Filtramos nuestra vista galería con la variable así como se ve en la figura; como se visualiza en la imagen.

En este caso podemos usar la variable como la función User().FullName, aunque en esta oportunidad será más completa.

105 of 128

Gestión de Roles - Usuario de Office 365 (Filtro de jobTitle)

En esta oportunidad aplicamos el jobTitle, y podemos filtrar aplicando la siguiente función.

106 of 128

Ocultar o Mostrar Objetos (Permisos)

Todos los objetos cuentas con la propiedad Visible, el cual el resultado es un dato booleano (true/false), y su resultado en el objeto es mostrar u ocultar el objeto el objeto que lo contiene.

107 of 128

Ocultar o Mostrar Objetos (Permisos)

Nos apoyaremos de las funciones Lower, Upper, y Proper para modificar el texto, en este caso usaremos la función Proper el cual convierte el texto a que las primeras letras de cada palabra esten en mayusculas.

108 of 128

Visualizar documentos

Tener en cuenta que:

Para visualizar documentos es necesario que la galería este conectada a un directorio de archivos, no una lista.

El documento se verá y nosotros podemos mostrarlo con la propiedad ThisItem.Miniatura.Large, esta se puede redimensionar para que se vea

109 of 128

Visualizar documentos

Tener en cuenta que:

Se puede mostrar el archivo en una imagen, aplica principalmente para imágenes en png y jpg, en el caso de PDF o Excel solo visualiza la primera página.

110 of 128

Visualizar documentos - Visible

Por lo tanto aplicamos en la propiedad Visible la siguiente fórmula para el objeto imagen; If(Or(Lower(Right(Gallery1.Selected.'File name with extension';3))="png";Lower(Right(Gallery1.Selected.'File name with extension';3))="jpg");true;false)

La formula Lower ayuda a que el texto esté en minúsculas y lo compare con otro texto en el mismo formato, esto ayuda a filtrar errores humanos al editar el formato en mayúsculas.

111 of 128

Visor PDF

Objeto que permite visualizar un documento PDF

Colocamos la fórmula a presentar en la imagen para poder visualizar el objeto cada vez que aparezca un PDF, u otro archivo que no sea png o jpg.

112 of 128

Visor PDF

Agregamos Mostrar Controles, para que el usuario pueda interactuar con el documento.

En la propiedad Document colocamos esta fórmula y tenemos que corregir que el valor thumbnail sea reemplazado por PDF.

113 of 128

Visor PDF - Visualizar documentos de Office no PDF

La fórmula Substitute(Gallery1.Selected.Miniatura.Large;"/thumbnail";"/pdf")

nos permite visualizar documentos como PPT, Word, Excel, entre otros, a excepción de PDF’s y csv.

114 of 128

Visor PDF - Visualizar documentos tipo PDF

En nuestro directorio, agregamos una nueva columna y elegimos la opción hipervínculo de formato imagen.

1

115 of 128

Visor PDF - Visualizar documentos tipo PDF

Abrimos alguna imagen o archivo y copiamo el link hasta el nombre de nuestro directorio.

3

2

Pegamos el enlace y añadimos el nombre del archivo más su extensión.

116 of 128

Visor PDF - Visualizar documentos tipo PDF

Abrimos alguna imagen o archivo y copiamo el link hasta el nombre de nuestro directorio.

3

2

Pegamos el enlace y añadimos el nombre del archivo más su extensión.

117 of 128

Visor PDF - Visualizar documentos tipo PDF

Agregamos un label y a la propiedad Text, le colocamos lo siguiente en su fórmula.

3

2

Pegamos el enlace y añadimos el texto que sacamos de la etiqueta como cadena y añadimos &EncodeUrl(Gallery1.Selected.’Ruta de acceso completa’

118 of 128

Visor PDF - Visualizar documentos tipo PDF

La fórmula se verá de la siguiente manera en la imagen.

Si requiero que me muestre los archivos de office como de los PDF’s entonces la fórmula será la siguiente:

4

5

119 of 128

Visor de Archivos Adjuntos de una Lista

La diferencia con el anterior modo, es que los archivos que usaremos serán mostrados apartir de una lista, tener en cuenta que la columna “attachments” puedes adjuntar múltiples archivos a la misma columna.

120 of 128

Visor de Archivos Adjuntos de una Lista

El formulario se verá de la siguiente manera:

Formulario

Galería

121 of 128

Visor de Archivos Adjuntos de una Lista

Muestra el primer Item de los archivos adjuntos adjuntos en la lista de Sharepoint

Se mostrará las imágenes solo si están en el primer archivo adjunto.

122 of 128

Visor de Archivos Adjuntos de una Lista

Muestra el primer Item de los archivos adjuntos adjuntos en la lista de Sharepoint, incluyendo los PDF’s y otros tipos de archivo.

"https://everisgroup-my.sharepoint.com/_layouts/15/getpreview.ashx?path="&First(ThisItem.Attachments).AbsoluteUri

Se mostrará todos los tipos de archivos, acepta hasta 42 tipos de documentos entre ellos los PDF’s.

Considera la lista del Sharepoint.

123 of 128

Visor de Archivos Adjuntos de una Lista

Agregamos una nueva galería para mostrar todos los archivos adjuntos de un registro, como se vee en la figura; para ello habrá que considerar dos propiedades.

De la 2da galería a mostrar los archivos, se irá a la propiedad Items:

Gallery1.Selected.Attachments

(Mostrará la lista de archivos adjuntos en la segunda galería).

Y en la propiedad Image de la 2da galería se colocará lo siguiente:

"https://everisgroup-my.sharepoint.com/_layouts/15/getpreview.ashx?path="&ThisItem.AbsoluteUri

124 of 128

Visor de Archivos Adjuntos de una Lista (Resultado)

125 of 128

Componente Personalizado

Descargemos el componente personalizado a continuación en el siguiente link.

Importamos el componente

Actualizamos el link de nuestra lista de Sharepoint

126 of 128

Componente Personalizado (Vista)

Agregamos el componente y en la propiedad Items, colocamos Gallery1.Selected.Attachments

Permite descargar y también ver en PDF los archivos, además de video mp4 y audio mp3.

127 of 128

Componente Personalizado (Formulario)

Agregamos el componente a la vista donde tenemos el formulario y en la propiedad Items, colocamos DataCardValue9.Attachments

Donde nos permitirá apartir del objeto de control de formulario mostrar todos los archivos adjuntos colocados y poder visualizarlos.

128 of 128

Componente Personalizado (Formulario)

Resultado Final