Day 12 ¿Que entendiste del tema: Interfaces 103: Build Dynamic Interfaces?
Discussion posts and replies are publicly visible
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.
Marco Polo Martínez Badillo
RESUMEN JOSE DIEGO SANCHEZ PEREZ
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
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.
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.
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.
PDF
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,
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.