Cómo comenzar con los formularios dinámicos
Objetivos de aprendizaje
Después de completar esta unidad, podrá:
- Explicar las diferencias entre las páginas de registro basadas en Dynamic Forms y las páginas de registro estándar.
- Enumerar los beneficios de Dynamic Forms.
- Migrar una página de registro a Dynamic Forms.
- Explicar cómo se muestran las páginas basadas en Dynamic Forms en dispositivos móviles.
Nota
El reto práctico para esta insignia está localizado al japonés, español (LATAM) y portugués (Brasil). Para cambiar el idioma de su Trailhead Playground, siga estas instrucciones. Puede que la localización esté desactualizada. Si no aprueba el reto con las instrucciones localizadas, cambie el idioma a inglés y la configuración local a Estados Unidos, y vuelva a intentarlo.
Consulte la insignia Trailhead en su idioma para aprender a aprovechar la experiencia traducida de Trailhead.
Accesibilidad
Esta unidad requiere algunas instrucciones adicionales para los usuarios de lectores de pantalla. Para acceder a una versión detallada para lectores de pantalla de esta unidad, haga clic en el siguiente vínculo.
Abrir las instrucciones para lectores de pantalla de Trailhead
Antes de empezar
Esta unidad se basa en la página de registro que creó en la unidad anterior. Primero complete la unidad anterior y use la misma página de registro para recorrer esta unidad.
¿Qué es Dynamic Forms?
Dynamic Forms lleva al Generador de aplicación Lightning a un nivel completamente nuevo. Le permite a usted, el administrador de Salesforce, crear experiencias sumamente flexibles y dinámicas, que a sus usuarios les encantarán, mediante la configuración de campos y secciones de detalles de registros dentro del Generador de aplicación Lightning.
Imagine su organización de Salesforce hoy. Tal vez tenga varias versiones ligeramente distintas de una página para admitir diferentes perfiles o tipos de registros. Además, tal vez tenga diseños de página con más de 100 campos porque diferentes tipos de usuarios utilizan campos diferentes en el mismo objeto. Cuantos más campos haya en el diseño de su página, más se convertirá el componente Record Detail (Detalles de registro) en un bloque monolítico de campos que no podrá personalizar.
Dynamic Forms divide el componente Record Detail (Detalles de registro) en sus páginas Lightning en componentes de sección y campo individuales que puede colocar en cualquier lugar de la página, incluso en fichas separadas y secciones de acordeón. Puede utilizar reglas de visibilidad para mostrar a sus usuarios finales solo los campos que necesitan ver, cuando necesitan verlos.
Dynamic Forms ofrece:
- Una actualización instantánea de los diseños de página. Puede colocar campos y secciones donde desee.
- Diseños dinámicos: Utilice reglas de visibilidad para mostrar y ocultar campos y secciones.
- Gestión de diseño más sencilla:
- Administre los campos y secciones de sus páginas en el Generador de aplicación Lightning sin tocar el editor de diseño de página.
- Reduzca la cantidad de diseños de página y tipos de registros que necesita definiendo reglas de visibilidad de componentes.
- Asigne una página Lightning sin tener que asignar también un diseño de página.
¿Cómo funciona Dynamic Forms?
Dynamic Forms agrega una nueva ficha al panel de componentes: Fields (Campos). La ficha Fields (Campos) contiene el componente Field Section (Sección de campo) y una lista de campos. Puede colocar el componente Field Section (Sección de campo) en cualquier lugar de la página y puede colocar campos en cualquier lugar dentro del componente Field Section (Sección de campo).
Puede empezar a utilizar Dynamic Forms de dos maneras.
- Cree una nueva página de registro de Lightning. Luego, haga clic en la ficha Fields (Campos) en el panel del componente Generador de aplicación Lightning y comience a arrastrar secciones y campos a cualquier lugar que desee en la página.
- Abra una página de registro existente y, con solo unos pocos clics, migre los detalles de su registro utilizando el asistente de migración de Dynamic Forms.
En esta unidad, exploramos la segunda opción: la migración de páginas.
Dynamic Forms (versión de escritorio y móvil) es compatible con la mayoría de los objetos estándar habilitados para LWC, pero no con todos ellos. Consulte Migración de LWC para páginas de inicio de registros a fin de obtener una lista de objetos habilitados para LWC. Si abre una página de registro para un objeto en el Generador de aplicación Lightning y no se muestra la ficha Fields (Campos) en el panel de componentes, Dynamic Forms no es compatible con ese objeto. Por ejemplo, el objeto Note (Nota) no admite Dynamic Forms porque tiene un diseño fijo. Dynamic Forms no se admite en objetos que no estén habilitados para LWC. Por ejemplo, las campañas, los productos y las tareas, que no están habilitados para LWC, aún usan información del diseño de página.
Migrar una página de registro a Dynamic Forms
Con Dynamic Forms, puede migrar los campos y secciones de sus páginas de registro existentes como componentes individuales en el Generador de aplicación Lightning. Luego, puede configurarlos como el resto de los componentes de la página y mostrar a sus usuarios únicamente los campos y secciones que necesitan.
¡Es sencillo! Veamos el proceso.
- En Configuración, ingrese
Generador de aplicacionesen el cuadro Búsqueda rápida y, a continuación, seleccione Generador de aplicaciones Lightning. - Abra la página New Opportunity (Nueva oportunidad) que creó en la última unidad.
- Haga clic en la ficha Details (Detalles) y luego haga clic en los detalles del registro.
Esto selecciona el componente Record Detail (Detalles de registro) y muestra sus propiedades en el panel de propiedades. - En el panel de propiedades, haga clic en Upgrade Now (Actualizar ahora) para iniciar el asistente de migración de Dynamic Forms.
- Siga el asistente, seleccione Opportunity Layout (Diseño de oportunidad) y luego haga clic en Finish (Finalizar).
- Haga clic en Save (Guardar).
¡Espere! Aparentemente, falta un campo obligatorio. Si guarda la página sin los campos obligatorios y los campos obligatorios que faltan no tienen valores, los usuarios no podrán guardar un registro después de crearlo, editarlo o clonarlo.
- Haga clic en Cancel (Cancelar) y averigüemos qué falta.
- Haga clic en la ficha Fields (Campos) en la paleta de componentes.
En los campos universalmente obligatorios, falta Forecast Category (Categoría de pronóstico) en la ficha Details (Detalles). ¿Qué falta? Cuando migra campos desde un diseño, si los campos universalmente obligatorios para el objeto no estaban presentes en el diseño desde el que migró, no se agregan automáticamente. Si echa un vistazo a la página Opportunity Layout (Diseño de oportunidad), podrá ver que la categoría de pronóstico no está allí. - Haga clic en la ficha Details (Detalles) y arrastre el campo Forecast Category (Categoría de pronóstico) a la sección Opportunity Information (Información de oportunidad).
- Guarde la página de nuevo.
¿Por qué elegir un diseño de página en el asistente de actualización cuando la ficha Fields (Campos) tiene todos los campos que necesita? Podría solo arrastrar todos esos campos manualmente a la página. Pero, si elige un diseño de página, el asistente de actualización toma los campos y secciones de ese diseño de página y los agrega automáticamente a su página. ¡Solo unos pocos clics y listo!
Aquí está la página migrada. Cada sección es un componente, al igual que cada campo dentro de la sección.
El componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) se agregó al final de la página y se eliminó el componente Record Detail (Detalles de registro) original. Eso es intencional y lo exploraremos más adelante.
Si le parece que los campos dentro de las secciones están un poco dispersos, no se equivoca. La vista previa del Generador de aplicación Lightning ignora la configuración de densidad para las secciones de campo. La vista previa del Generador de aplicación Lightning siempre muestra la configuración Comfy para las secciones de campo. La configuración de densidad adecuada se aplica cuando la página se muestra a sus usuarios.
Personalizar la página
Aunque haya dividido el detalle del registro en componentes de campo individuales, todavía hay bastantes campos en la página, lo que puede causar problemas de rendimiento. Una forma de evitarlo es mover los campos de menor prioridad a fichas o secciones de acordeón cuyo contenido no sea visible cuando se carga la página.
Vamos a optimizar la página. En primer lugar, elimine la sección vacía Other Information (Otra información).
- Haga clic en la ficha Details (Detalles) en el lienzo.
- Desplace el cursor sobre la sección Other Information (Otra información) y haga clic en
para eliminarla.
A continuación, agregue una ficha nueva.
- Haga clic en la ficha Details (Detalles).
- En el panel Tabs properties (Propiedades de fichas), haga clic en Add Tab (Agregar ficha). Se mostrará un nuevo elemento de ficha Details (Detalles).
- Haga clic en la nueva ficha Details (Detalles).
- En la lista Tab Label (Etiqueta de ficha), seleccione Custom (Personalizada).
Es posible que tenga que desplazarse hacia arriba en la lista Tab Label (Etiqueta de ficha) para encontrar Custom (Personalizado) en la parte superior. - Para Custom Label (Etiqueta personalizada), ingrese
More Details(Más detalles) y luego haga clic en Done (Listo). - En el panel de propiedades, arrastre la nueva ficha More Details (Más detalles) por sobre la ficha Activity (Actividad).
Ahora, mueva las secciones de campo de Details (Detalles) a More Details (Más detalles).
- En el lienzo, haga clic en la ficha Details (Detalles) y contraiga la sección Opportunity Information (Información de oportunidad), reduciendo el espacio vertical para arrastrar por sobre este en el siguiente paso.
- En la sección Additional Information (Información adicional), haga clic en
y arrastre la sección a la ficha More Details (Más detalles). - Haga lo mismo con la sección Description Information (Información de descripción) y colóquela debajo de la sección Additional Information (Información adicional).
- En la sección Additional Information (Información adicional), coloque el campo Tracking Number (Número de seguimiento) debajo de Delivery/Installation Status (Estado de entrega/instalación).
- Haga clic en la sección Description Information (Información de descripción).
- En el panel de propiedades de la sección Description Information (Información de descripción, quite la palabra “Information” de la etiqueta de la sección. Sí, este es un cambio bastante pequeño (y aburrido). Pero, con Dynamic Forms, puede nombrar las secciones de campo como desee. ¡Sea creativo!
La sección Additional Information (Información adicional) tiene cinco campos, pero los usuarios no necesitan ver el campo Main Competitor(s) (Competidor[es] principal[es]). Ahí es donde Dynamic Forms se destaca. Puede personalizar la sección, dejando solo los campos relevantes, aquí en el Generador de aplicación Lightning, sin usar el editor de diseño de página en absoluto.
Por último, elimine los campos innecesarios.
- En la sección Additional Information (Información adicional), desplace el cursor sobre el campo Main Competitor(s) (Competidor[es] principal[es]) y haga clic en
para eliminarlo. - Haga clic en la ficha Detalles.
- Expanda la sección Opportunity Information (Información de oportunidad) y, a continuación, elimine el campo Primary Campaign Source (Fuente principal de la campaña).
- Elimine el campo Next Step (Paso siguiente).
¿Ve cómo se ajusta automáticamente la columna? - Arrastre el campo Stage (Etapa) sobre el campo Close Date (Fecha de cierre).
- Guarde la página.
Los cambios que realizó aquí son un ejemplo sencillo de lo que puede hacer con Dynamic Forms. En el caso de las páginas que tienen 100 campos o más en el bloque Record Detail (Detalles del registro) original, este tipo de optimización puede mejorar significativamente el rendimiento de la página. Las páginas con menos campos para mostrar se cargan más rápido. Además, sus usuarios no tienen que desplazarse tanto para acceder a los campos que necesitan.
Haga que su página de registro habilitada para formularios dinámicos sea compatible con dispositivos móviles
Como parte del proceso de migración de la página, el componente Record Detail (Detalles de registro) se elimina de la página. Cuando migra una página de registro que admite los factores de forma de escritorio y teléfono a Dynamic Forms, se agrega un componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) a la página.
El componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) muestra el componente Record Detail (Detalles de registro) original en un contenedor solo para dispositivos móviles. Por lo tanto, en las páginas compatibles con el escritorio y el teléfono, los usuarios de escritorio ven los componentes Field Section (Sección de campo) y los usuarios móviles ven el componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles).
Pero espere… Esa no es realmente una situación ideal, ¿verdad? Queremos que nuestros usuarios de dispositivos móviles vean el mismo conjunto de campos seleccionados que los usuarios de escritorio. Afortunadamente, hay una solución para eso: Dynamic Forms en dispositivos móviles.
Vamos a adaptar las páginas de registro habilitadas para Dynamic Forms en la organización para dispositivos móviles.
- En Setup (Configuración), ingrese
Mobile(Móvil) en el cuadro Quick Find (Búsqueda rápida) y, a continuación, seleccione Salesforce Mobile App. - Habilite Dynamic Forms on Mobile (Dynamic Forms en dispositivos móviles).
Con solo pulsar un interruptor, las páginas de registro que usan Dynamic Forms ahora pueden mostrar los mismos campos personalizados tanto a los usuarios de escritorio como a los de dispositivos móviles. Cualquier página de registro futura que cree y actualice para usar Dynamic Forms después de este punto mostrará automáticamente los campos personalizados en dispositivos móviles y no contendrá el componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles).
Sin embargo, debido a que la página de nueva oportunidad se creó antes de que activáramos el interruptor, hay una cosa más para hacer antes de que esté lista para dispositivos móviles. Si habilita Dynamic Forms en dispositivos móviles y la página de registro habilitada para Dynamic Forms existente incluye un componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles), los usuarios seguirán viendo solo el componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) desde su dispositivo móvil. Vamos a solucionar esto.
Para ofrecer a los usuarios de dispositivos móviles la misma experiencia de Dynamic Forms que a los usuarios de escritorio, debe eliminar el componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) de las páginas existentes.
- En Configuración, ingrese
Generador de aplicacionesen el cuadro Búsqueda rápida y, a continuación, seleccione Generador de aplicaciones Lightning. - Haga clic en Edit (Modificar) junto a la nueva página de oportunidad.
- Haga clic en la ficha Details (Detalles) en el lienzo.
- Desplace el mouse sobre el componente Record Detail - Mobile (Detalles de registro - Dispositivos móviles) y haga clic en para eliminarlo.
- Guarde la página.
Echaremos un vistazo a la página de nuevas oportunidades terminada tanto en computadoras de escritorio como en dispositivos móviles en la próxima unidad.
Ahora que sabe algo sobre lo que puede hacer Dynamic Forms, ¡pruébelo en su propia organización!
¿Quiere estar al día con las últimas noticias sobre Dynamic Forms? Únase a la comunidad Dynamic Forms and Actions Trailblazer Community, donde los equipos de producto responden a sus preguntas, inquietudes y comentarios. También puede ver la hoja de ruta de Dynamic Forms y Actions allí.
