Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

anakareng1582 — Tue, 18 Apr 2023 23:35:44 GMT

Buen día

Comparto Resumen, elaborado por Ana Karen Garcia Braulio.

Tema: -Interfaces 103-

Este módulo esta basado en crear una interfaz dinámica.

type: Se utiliza para hacer referencia a la estructura de datos dentro de una expresión.
a!forEach: Evalúa una expresión para cada elemento de una lista y devuelve una nueva matriz de los resultados.

Grid Editable: Los Grid Editable son una herramienta poderosa en Appian. Con él se puede crear tablas que los usuarios pueden editar directamente desde la interfaz.
Lista Dinámica: Se agrego una consulta a la interfaz y se utilizaron los datos consultados para completar los radio buttons de las direcciones.
Enlace Dinámico: Define un vínculo que desencadena actualizaciones de una o más variables. Los enlaces se pueden usar en gráficos, cuadrículas, navegadores de jerarquía, imágenes, campos de enlace, hitos, selectores y texto enriquecido.

Existe la posibilidad de reutilizar interfaces ya creadas para facilitar el tiempo de diseño, evitar posibles errores, permitir una navegación más sencilla y reducir el código realizado en la interfaz. Es sencillo reutilizar las interfaces, se realiza mediante reglas.
Para poder agregar valores en una lista con los botones, se usa la función append(), que permitirá guardar valores en una lista ya creada.
Una grilla editable permite el almacenar mucha información y que esta pueda ser alterada en cualquier momento de la ejecución de la aplicación, actualizar, eliminar y agregar nuevos datos.

Quedo pendiente para cualquier duda o comentario.

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

rodrigoandress6801 — Wed, 17 Aug 2022 03:49:36 GMT

blancac0001

Buen día,

Agrupando interfaces 101, 102 y 103:

Las interfaces entregadas por Appian, terminan siendo el complemento adecuado a todo el desarrollo de procesos y gestión de información que un usuario pueda requerir, con un estilo básico pero sobrio cuando de procesos de negocio se trata; las interfaces permiten aplicar desde un diseño minimalista y ágil hasta diseños complejos sin perder el enfoque en la mejora de la experiencia de usuario, punto importante para que cada actor que interviene en el proceso pueda centrarse en su negocio y no preocupase por las falencias de las plataformas.

Por otra parte las interfaces para el desarrollador pueden llegar a verse como las expresiones mas complejas pero aprendiendo a utilizarlas puede sacársele el mayor provecho a crear módulos agiles, independientes, reutilizables y dinámicos para poder innovar cada vez mas en la creación de experiencias nuevas al usuario y entrega de funcionalidades rápidamente.

Saludos,

community.appian.com/.../Interfaces_5F00_102_5F00_103.pdf

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

jesusalbertog459854 — Thu, 11 Aug 2022 13:38:14 GMT

Hola aliciam0003

adjunto resumen día 12 - Interfaces 103: Build Dynamic Interfaces

– Jesús Alberto Guzmán Cruz

Interfaces 103

En este te tema habla sobre cómo crear interfaces con listas dinámicas, enlaces dinámicos y cuadricula editable, en el modo diseñador de Appian, con el uso de plantillas, variables locales, y funciones.

Lista dinámica:

Utiliza botones de radio se completarán dinámicamente con los valores consultados desde una base de datos.

La función a!forEach en Appian tiene una matriz de datos que necesita para recorrer una expresión, esta función se adapta a sus necesidades

La función if() son útiles cuando queremos crear una declaración condicional, donde se devuelve una expresión si una declaración es verdadera y la otra si su declaración es falsa

Enlace dinámico:

Los enlaces dinámicos se usan comúnmente para proporcionar a los usuarios opciones interactivas en una interfaz basada en hacer clic en una imagen de enlace o diseño de tarjeta, por ejemplo, en una creación editable, es posible que un usuario desee agregar una cantidad de filas o eliminarlas, ya que no podemos predecir lo que el usuario necesita y proporcionarle opciones estáticas, el enlace dinámico permite que el formulario muestre un conjunto de campos cuando el usuario hace clic en ese link o en el enlace dinámico en un ícono de texto enriquecido se puede usar para eliminar elementos no deseados. Usar variables locales para mostrar y ocultar secciones de una interfaz.

Cuadricula editable:

Las cuadrículas editables son una herramienta poderosa en Appian. Con él, podrá crear tablas que los usuarios pueden editar directamente desde la interfaz. Hemos construido una interfaz con una cuadrícula que permitirá a los usuarios agregar y eliminar filas de información simplemente haciendo clic en un link “agregar ítem nuevo” y en otro link “eliminar”, para ello se hace uso de las funciones a!save, append y remove.

community.appian.com/.../4745.Ejercicio-103-_2D00_01-_2D00_-Jes_FA00_s-Alberto-Guzm_E100_n-Cruz.pdf

community.appian.com/.../1273.Ejercicio-103-_2D00_02-_2D00_-Jes_FA00_s-Alberto-Guzm_E100_n-Cruz.pdf

community.appian.com/.../8130.Ejercicio-103-_2D00_03-_2D00_-Jes_FA00_s-Alberto-Guzm_E100_n-Cruz.pdf

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

Marco Antonio Flores — Thu, 11 Aug 2022 02:48:53 GMT

Marco Antonio Flores Flores.

Marco Polo, en esta lección es la continuación de la anterior con respecto al tema de interfaces, ahora se habla acerca de las "Interfaces Dinámicas" y como construirlas.

Se habla que podemos trabajar sobre una plantilla ya existente, de esta manera podemos observar su estructura y usar variables locales en la misma, estas son usadas para proporcionar listas dinámicas con la ayuda de forEach().

Se habla acerca de vinculos dinámicos que permiten darle dinamismo a nuestros campos por si en algún momento sufre cambios en la entrada de los datos y estos se actualizan en automático.

Existe una función de añadir: La cual es una herramienta que se nos recomienda tener en cuenta para añadirla en nuestra caja de herramientas kde habilidades, ya que permite fusionar un nuevo elemento en una lista de valores.

Se muestra un enlace dinámico el cual permite mostrar un nuevo conjunto de campos a un usuario , tambien se usa un contructor el cual define la estructura de la variable local para determinar la visibilada del componente. Se configura el componente de texto el cual ya se podría usar para añadir texto e iconos y permitiendole guardar un valor en una o más variables.

Posterior a esto se muestra con un ejemplo como es que se puede crear y editar una "Cuadrícula Editable", de esta manera se identifica como es que se agrega, actualiza y elimina un elemento en una matriz de valores CDT, esta es una forma de brindarles a los usuarios la capacidad de interactuar facilmente con una lista de elementos que exponen todos los campos de cada elemento para ediciones fluidas, inserciones o eliminaciones en un solo componente.

Se explica que la cuadrícula ya incluye enlaces dinámicos para agregar y eliminar filas, cabe recalcar que cada fila incluye un componente diferente para cada campo.

Para poder agregar datos o valores en una lista con botones, usamos la función append(), la cual permite guardar los datos en nuestra lista ya creada.

También esta la opción de poder reutilizar interfaces que ya estan creadas previamente y de esta manera se puede agilizar tiempo de diseño, estas reutilización se puede llevar a cabo con la utilización correcta de reglas.

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

josediegos — Wed, 10 Aug 2022 02:26:54 GMT

Marco Polo Martínez Badillo

RESUMEN JOSE DIEGO SANCHEZ PEREZ

Interfaces 103: Build Dynamic Interfaces

Para poder generar una interfaz dinámica podemos hacer uso de varios métodos para que los componentes puedan generar un estilo dinámico, en este caso se realizaron tres formas para construir una interfaz dinámica.

Lista Dinámica:

Se agrego una consulta a la interfaz y se utilizaron los datos consultados para completar los radio buttons de las direcciones. También se utilizaron las funciones condicionales if() y a!forEach(), la variable de función fv!item para formatear cada elemento del array de los datos devueltos y por último se guardó el valor de la dirección seleccionada en la entrada de la regla.

Enlace Dinámico:

Define un vínculo que desencadena actualizaciones de una o más variables. Los enlaces se pueden usar en gráficos, cuadrículas, navegadores de jerarquía, imágenes, campos de enlace, hitos, selectores y texto enriquecido.

En esta interfaz se crearon variables locales para aceptar nuevos valores temporales del usuario.

Específicamente se creó una variable local para establecer el indicador de visibilidad de un componente. Después se utilizó la función a!save para configurar un botón para aceptar una lista compleja de guardados. Se configuro un enlace dinámico que pueda funcionar como un botón para guardar un valor en una o más variables.

Grid Editable:

Los Grid Editable son una herramienta poderosa en Appian. Con él se puede crear tablas que los usuarios pueden editar directamente desde la interfaz.

En esta interfaz se usaron rules inputs y variables locales para aceptar los valores del usuario. Para configurar y hacer referencia a los componentes de una fila en una Grid Editable se hizo uso de la función de a!forEach y la variable fv!item.

Para agregar o eliminar las filas de información se puede hacer uso de las funciones a!save, append y remove para indicarle a Appian cómo actualizar las rule inputs.

Se tienen que usar expresiones para definir los valores de los campos calculados.

Evidencia de la actividad Build a Dynamic List y Build a Dynamic Link

Evidencia de la actividad Build an Editable Grid

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

erickdavidt7585 — Wed, 10 Aug 2022 01:02:06 GMT

Buena noche Marco Polo Martínez Badillo

Adjunto mi resumen sobre lo que entendí del tema y mis evidencias de los ejercicios

Interfaces 103: Build Dynamic Interfaces

En esta elección se aprendió sobre los vínculos dinámicos y sobre cómo podemos modificar parte del código a través de variables locales también se aprendieron algunas funciones específicas para que nuestras interfaces sean más dinámicas, también un nuevo componente que fue interesante fue el componente “box” i dentro de las funciones, fue interesante conocer cómo podemos ocultar y agregar otros elementos, Incluso traer datos desde un cdt, para mandar a llamar info de la bd o cdt se debe crerar una regla de expresión que jale el cdt o record type y después en el modo de expresión instanciar. La función append se usa más que nada para que cuando un usuario de click en un botón de agregar, llene un formulario y aparezca un nuevo campo en el mismo formulario, en el ejemplo, se utiliza para agregar direcciones; se puede crear una condición usando variables locales para mostrar u ocultar un componente del layout, también hacen mención sobre que se pueden crear vínculos dinámicos con rich text.

La función type! se utiliza para hacer referencia a la estructura de datos dentro de una expresión. En este caso, usamos type! para mapear la información ingresada por los usuarios a los elementos de nuestro CDT.

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

Jordi Brayan — Wed, 10 Aug 2022 00:50:36 GMT

Hola Marco Polo Martínez Badillo

Dentro de todo el contenido que muestra en esta sección habla sobre cómo construir interfaces dinámicas de manera correcta desde cero lo cual muestra diferentes aspectos a considerar a través del diseño de toda la aplicación. Otro aspecto del cual nos habla es de como modificar los templates a través de variables locales lo cual ayuda a poder almacenar datos de manera interna y que solo se pueden usar dentro de esa interfaz y lo podemos utilizar para poder probar las funcionalidades de los componentes con los que estemos trabajando en la aplicación.

Nos muestra como reconocer los componentes clave de una Grid Editable, así como también a poder identificar como agregar, actualizar o eliminar un elemento en una matriz de valores de un CDT. Otro aspecto importante que también nos menciona es a como adaptar una plantilla para poder usar sus propias estructuras de datos.

También nos habla de cómo crear listas dinámicas para poder usarlas dentro de los componentes como las listas desplegables y utilizar esos valores. Nos muestran también como poder crear links y secciones dinámicas donde podemos ocultar algunas secciones o componentes a través de estas opciones, lo cual resulta muy útil dentro de los formularios para poder ocultar información si es que no lo especifica al momento del llenado y demás funciones que se le pueden dar a esas opciones dentro del entorno de Appian.

Además, nos muestra cómo crear un Editable Grid para poder agregar componentes dentro del mismo y a su vez agregar las configuraciones necesarias para darle la funcionalidad que nosotros le especifiquemos, en esta sección nos desglosa mucha información sobre este componente el cual tiene grandes aplicaciones de uso y una gran opción dentro del desarrollo de Appian para una aplicación. También nos enseña nuevamente sobre la reutilización de interfaces donde tiene grandes ventajas para los desarrolladores que pueden obtener diseños hechos anteriormente y los cuales son utilizables para una nueva app.

community.appian.com/.../1385.Exercise-01-Build-a-Dynamic-List.pdf

community.appian.com/.../6683.Exercise-02-Build-a-Dynamic-Link.pdf

community.appian.com/.../3022.Exercise-03-Build-an-Editable-Grid.pdf

Jordi Brayan Vicente Moreno

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

schavez — Wed, 10 Aug 2022 00:45:44 GMT

Buenas noches blancac0001

community.appian.com/.../8306.Day-12.docx

Presentado por Santiago Chavez Zapata

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

josebernardov5381 — Tue, 09 Aug 2022 23:51:38 GMT

community.appian.com/.../2330.Welcome-to-build-Dynamic-Interfaces_2D00_Resumen.pdf

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

josebernardov5381 — Tue, 09 Aug 2022 23:51:19 GMT

Marco Polo Martínez Badillo

Muy buenas tardes comparto mi resumen.

José Bernardo Valdés Hernández

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

pavelgabrielm6540 — Tue, 09 Aug 2022 23:46:32 GMT

Marco Polo Martínez Badillo

Construir interfaces dinámicas:

En este ejercicio nuestros botones de radio serán rellenados dinámicamente por los valores de las direcciones consultadas desde una base de datos.
En este ejercicio, aprenderemos a utilizar la función de bucle a!forEach para aplicar una estructura específica a todas las direcciones consultadas. También aprenderemos a utilizar la función condicional if() para mostrar el campo de la unidad sólo si la información de la unidad está disponible. Configuraremos nuestro formulario para guardar la dirección seleccionada por el usuario en la entrada de la regla.

a!forEach

Evalúa una expresión para cada elemento de una lista y devuelve una nueva matriz de los resultados. Devuelve cualquier tipo de matriz.

Editable Grids

Las cuadrículas editables son una potente herramienta en Appian. Con ella, podrá construir tablas que los usuarios pueden editar directamente desde la interfaz. En este ejercicio, construiremos una cuadrícula que permitirá a los usuarios añadir y eliminar las filas de información simplemente haciendo clic en el enlace Añadir nuevo elemento o en el botón rojo X de borrar.

A continuación le adjunto mi evidencia.

Elaborado por Pavel Gabriel Morales Montane

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

josealbertoc5443 — Tue, 09 Aug 2022 23:43:34 GMT

aliciam0003

José Castillo

Resumen

Es posible modificar detalles en la configuración de los componentes haciendo uso de las variables locales, estas almacenan valores que pueden ser utilizados para mostrar una u otra información dentro de las interfaces, por medio de consultas u otras formas de obtener información. Con ayuda de funciones se pueden guardar la información dentro de las variables locales en los rules inputs y así pasar la información a otro objeto en appian.

Las variables locales pueden ser usados para darle una mejor funcionalidad a la función forEach(), para permitir realizar listas dinámicas en donde se muestren valores recorriendo un arreglo de datos.

Se usan vínculos dinámicos para permitir al usuario una interacción con las diferentes opciones que se desean mostrar, basadas en un clic sobre una imagen, un texto, etc. Comúnmente se hace uso de las vínculos de la siguiente manera:

Crear la variable local que almacene los datos
Construir la sección en donde se añadirán las cosas
Crear un vínculo dinámico para mostrar u ocultar datos
Configurar el botón de añadido
Mostrar u ocultar los componentes agregados.

Para poder agregar valores en una lista con los botones, se usa la función append(), que permitirá guardar valores en una lista ya creada. Para añadir un link dinámico a un elemento en la interfaz se hace agregando la función a!dynamicLink().

Una grilla editable permite el almacenar mucha información y que esta pueda ser alterada en cualquier momento de la ejecución de la aplicación, actualizar, eliminar y agregar nuevos datos. De la mismo forma que al usar una lista dinámica, en las grillas también se puede usar la función forEach(), para un recorrido de los datos mostrados. También está la posibilidad de usar la función Remove(), para eliminar elementos de la grilla o la función append(), para agregar elementos.

Ejercicio

community.appian.com/.../2465.Ejercicio-Interfaces-Parte-2.pdf

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

daliam6103 — Tue, 09 Aug 2022 23:39:17 GMT

Excelente Tarde Marco Polo Martínez Badillo

Interfaces 3: Build Dynamic Interfaces

Aprendimos a configurar una variable local para poder realizar una consulta, mostrar y ocultar secciones de una interfaz, crear enlaces dinámicos con variables locales, usar la función a!save para insertar una nueva dirección en las listas de direcciones, así como utilizar la función a!forEach y poder realizar una lista de opciones dinámica.

La función a!forEach en Appian.

Usada para definir la estructura de cada línea de dirección como por ejemplo una matriz de datos que necesita recorrer una expresión ya que puede crear una fila para cada elemento de dirección. Los parámetros necesarios son:

Los elementos
Una expresión para recorrerlos

Se puede basar en las siguientes variables de función:

fv!item (cualquier tipo) hace referencia al elemento actual.
fv!index (Integer) se refiere a la posición del elemento en la matriz.
fv!identifier (Any Type Array) hace referencia al identificador del elemento actual (si este elemento es un subconjunto de datos
fv!isFirst (booleano): verdadero para el primer elemento de la matriz de elementos; de lo contrario, falso.
fv!isLast (booleano): verdadero para el último elemento de la matriz de elementos; de lo contrario, falso.
fv!itemCount (Integer) hace referencia al número total de elementos (incluidos los nulos).

También aprendí que append() se utiliza para agregar elementos a una lista existente y type! para hacer referencia a la estructura de datos dentro de una expresión

Evidencias

RE: Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?

Orlando Sánchez — Tue, 09 Aug 2022 23:37:51 GMT

aliciam0003

Resumen Interfaces 103 – Building Dynamic Interfaces

Orlando Sánchez Acuña

Modificar una plantilla usando variables locales

Las interfaces se pueden crear a partir de plantillas, las cuales tienen diferentes diseños y se puede hacer uso de local variables y rule inputs. Las variables locales son usadas para almacenar datos y mostrarlos en una interfaz.

Al utilizar la función a!save(), se pueden guardar los datos en una local variable como en un rule input. Además, en las variables locales se pueden usar consultas que obtengan datos de una base de datos, con la finalidad de mostrarlos en un formulario y evitar establecer valores como opciones.

Crear una lista dinámica

Una consulta devuelve varios datos, en ese sentido, se puede usar la función a!forEach(), de tal manera que se pueda recorrer un registro de datos, independientemente de la cantidad.

Para crear una lista dinámica se deben seguir los siguientes pasos:

Crear variables para almacenar los valores.
Construir una sección de formulario para ingresar los nuevos datos.
Crear un enlace dinámico que muestre y oculte la sección.
Configurar los botones de agregar para añadir la actualización.
Mostrar y ocultar los componentes de la interfaz cuando el usuario quiera agregar un nuevo registro.

Un type constructor es como una función, pero en lugar de modificar datos, brinda estructura a los datos, similar a un CDT. Esto permite recolectar los datos de los campos de un formulario en una variable local.

Editable Grid

Una rejilla editable proporciona visualizar datos dinámicamente, además, el usuario puede interactuar con los datos haciendo uso de funcionalidades como actualizar, eliminar y agregar nuevos registros mediante enlaces dinámicos.

Reusing interfaces

Las interfaces se pueden usar en otras interfaces (gráficos, formularios, etc) como componentes, de esta manera se puede configurar y obtener un mejor rendimiento al crear una nueva interfaz.

community.appian.com/.../0474.RF_5F00_01-Build-a-Dinamic-List.pdf

community.appian.com/.../8080.RF_5F00_02-_2D00_-Build-a-Dinamic-Link.pdf

community.appian.com/.../1055.RF_5F00_03-Build-and-Editable-Grid.pdf