Crear formularios personalizados
Nota
La acción Mostrar formulario personalizado se basa en la tecnología Adaptive Cards. Acuda a esta página para obtener más información sobre las Adaptive Cards.
Los cuadros de mensaje le permiten solicitar a los usuarios que ingresen varias entradas, como texto, fechas y archivos, o que muestren información y resultados en la pantalla.
Aunque la mayoría de las acciones de este grupo pueden manejar escenarios donde se requiere una sola entrada, algunas automatizaciones pueden requerir una combinación de entradas y/o salidas. El mejor enfoque para abordar estos escenarios es la acción Mostrar formulario personalizado.
Para crear un formulario personalizado, implemente la acción Mostrar formulario personalizado y seleccione el botón Diseñador de formularios personalizados para abrir el diseñador de formularios.
En el lado izquierdo del diseñador, hay una lista con todos los elementos de entrada disponibles puede agregar al formulario, como entradas de texto, fecha y archivo, y algunos elementos no interactivos, como textos e imágenes.
Para agregar un elemento al formulario personalizado, haga doble clic en él o arrástrelo y suéltelo en el área de trabajo del diseñador. Use el panel de vista previa en la parte inferior de diseñador de formularios para ver cómo se verá el formulario configurado durante el tiempo de ejecución.
Después de agregar un elemento, puede gestionar todas las propiedades disponibles en el lado derecho de diseñador de formularios. Las propiedades disponibles pueden diferir según la naturaleza del elemento seleccionado.
Nota
Además de los elementos del formulario, diseñador de formularios proporciona algunas propiedades para configurar la apariencia del cuadro de diálogo principal del formulario personalizado. Para configurarlos, seleccione un espacio vacío en el área de trabajo y vea las propiedades disponibles en el panel respectivo.
Cuando un usuario completa un formulario personalizado, los datos proporcionados se almacenan en la variable CustomFormData de objeto personalizado. Para acceder al valor de un elemento de entrada específico almacenado en el objeto personalizado, utilice la siguiente notación: %CustomFormData['ElementID']%.
Importante
El identificador de cada elemento debe ser único y no puede estar vacío. Además, debe comenzar con una letra y puede contener letras latinas, números y espacios. No puede usar variables en los campos de identificación. Si se proporciona una identificación no válida, la última identificación válida utilizada se restaurará automáticamente después de cerrar y guardar el diseñador de formularios.
Nota
Puede encontrar más información sobre objetos personalizados en y cómo gestionarlos en Tipos de datos avanzados.
Además de los elementos de entrada y no interactivos, el diseñador de formularios proporciona algunas acciones para implementar funciones adicionales en sus formularios.
Considere las acciones como botones que le permiten ejecutar diferentes funciones según el botón que se presionó. Por ejemplo, utilice una acción Enviar como un botón guardar para recopilar y almacenar los datos de usuario proporcionados para su uso posterior en su flujo.
Nota
Las acciones solo se pueden agregar al final de la estructura del formulario, después de cualquier otro tipo de elemento de formulario.
Al igual que los demás elementos, cada acción tiene un identificador que lo describe de manera única. Cuando se selecciona una acción, su identificación se almacena en la variable ButtonPressed.
Cuando un formulario contiene varias acciones, utilice esta variable y condicionales para verificar cuál está presionado e implementar diferentes funcionalidades para cada escenario. Para obtener más información sobre la implementación de este comportamiento, consulte Gestionar formularios personalizados.
La siguiente captura de pantalla muestra cómo se ve el formulario personalizado configurado previamente cuando se ejecuta el flujo.
Elementos del formulario personalizado
| Nombre del elemento | Tipo | Especificaciones | Propiedades de diseño | Propiedades de validación | Propiedades de estilo | Imagen de fondo |
|---|---|---|---|---|---|---|
| Formulario personalizado | Diálogo primario | Nombre | Altura mínima en píxeles, alineación de contenido vertical | URL, Modo de relleno, Alineación horizontal, Alineación vertical | ||
| Entrada de texto | Entrada | ID, Etiqueta, Valor predeterminado, Multilínea, Estilo, Longitud máxima | Espaciado, Separador, Altura | Validación obligatoria, Mensaje de error, Patrón | ||
| Entrada numérica | Entrada | ID, Etiqueta, Valor predeterminado, Valor mínimo, Valor máximo | Espaciado, Separador, Altura | Validación obligatoria, Mensaje de error | ||
| Entrada de fecha | Entrada | ID, Etiqueta, Valor predeterminado, Valor mínimo, Valor máximo | Espaciado, Separador, Altura | Validación obligatoria, Mensaje de error | ||
| Entrada de tiempo | Entrada | ID, Etiqueta, Valor predeterminado, Valor mínimo, Valor máximo | Espaciado, Separador, Altura | Validación obligatoria, Mensaje de error | ||
| Alternar entrada | Entrada | ID, etiqueta, título, valor predeterminado, valor cuando está activado, valor cuando está desactivado | Espaciado, Separador, Ajustar altura | Validación obligatoria, Mensaje de error | ||
| Entrada del conjunto de opciones | Entrada | ID, Etiqueta, Valor predeterminado, Permitir selección múltiple, Estilo, Opciones | Espaciado, Separador, Altura, Encapsulado | Validación obligatoria, Mensaje de error | ||
| Entrada de archivo | Entrada | ID, Etiqueta, Valor predeterminado | Espaciado, Separador, Altura | Validación obligatoria, Mensaje de error | ||
| Bloque de texto | Elemento | ID, Texto | Espaciado, Separador, Alineación horizontal, Altura, Ajustar, Máximo de líneas, Máximo ancho | Tipo de fuente, Tamaño, Peso, Color, Sutil, Cursiva, Tachado | ||
| Imagen | Elemento | ID, URL, Texto alternativo | Espaciado, Separador, Alineación horizontal, Alto, Alto en píxeles, Ancho en píxeles, Tamaño | Estilo, Color de fondo | ||
| Enviar | Acción | ID, Título, Omitir las entradas proporcionadas | ||||
| Abrir URL | Acción | ID, Título, URL |
Propiedades del elemento de formulario personalizado
| Nombre de la propiedad | Opcional | Acepta | Predeterminado | Descripción |
|---|---|---|---|---|
| Permite selección múltiple | N/D | Valor booleano | Falso | Permite seleccionar varias opciones |
| Texto alternativo | Sí | Valor de texto | Texto alternativo que describe la imagen | |
| Color de fondo | Sí | Valor de texto | Aplica un fondo a una imagen transparente. Esta propiedad respetará el estilo de la imagen. Solo se aceptan valores hexadecimales en esta propiedad | |
| Elecciones | Sí | Título y Valor | Describe opciones para su uso en el conjunto de opciones. Consta de un título (texto para mostrar) y un valor (valor sin formato para la opción) | |
| Color | N/D | Predeterminado, Oscuro, Claro, Acento, Bueno, Advertencia, Atención | Predeterminado | Controla el color del texto |
| Valor predeterminado | Sí | Valor de texto, valor numérico | El valor predeterminado del elemento de entrada | |
| Mensaje de error | Sí | Valor de texto | Mensaje de error que se mostrará cuando se introduzca una entrada no válida | |
| Modo de relleno | N/D | Cubrir, Repetir horizontalmente, Repetir verticalmente, Repetir | Describe la manera en que la imagen debe rellenar el área | |
| Tipo de fuente | N/D | Predeterminado, monoespaciado | Predeterminado | Tipo de fuente que se usará para la representación |
| Altura | N/D | Automático, Estirar, Píxeles | Automático | Especifica el alto del elemento. La opción 'Píxeles' está disponible solo para elementos de imagen |
| Alto en píxeles | No | Valor numérico | 0 | Especifica la altura deseada de la imagen. La imagen se distorsionará para adaptarse a esa altura exacta. Esto anula la propiedad "Tamaño". El valor predeterminado de 0 determina que no se especifica ninguna altura en particular |
| Alineación horizontal | N/D | Izquierda, Centro, Derecha | Bloque de texto: izquierda Imagen: Izquierda |
Controla la posición horizontal de este elemento. Para formularios personalizados, describe cómo se debe alinear la imagen de fondo si debe estar recortada o si se usa el modo de relleno repetido |
| Identificador | No | Valor de texto | Depende del elemento | Identificador único del valor. Se utiliza para identificar la entrada recopilada cuando se realiza la acción Enviar. Si se usa temporalmente un id. no válido y el diseñador de formularios está cerrado, se aplicará el último id. válido usado |
| Omitir las entradas proporcionadas | N/D | Valor booleano | Falso | Si se habilita, esta acción cierra el formulario sin almacenar las entradas seleccionadas, funcionando como un botón Cancelar |
| Cursiva | N/D | Valor booleano | Falso | Si se habilita, pone el texto en cursiva |
| Etiqueta | Sí | Valor de texto | Etiqueta para esta entrada | |
| Largo máximo | No | Valor numérico | 0 | Especifica el número máximo de caracteres a recopilar. El valor predeterminado de 0 determina que no se especifica ninguna longitud máxima |
| Líneas máximas | No | Valor numérico | 0 | Especifica el número máximo de líneas que se mostrarán. El valor predeterminado de 0 determina que no se especifica ninguna línea máxima |
| Valor máximo | Sí | Valor de texto | Sugerencia de valor máximo. Para las entradas de fecha y hora, el valor debe expresarse en el formato regional de su máquina | |
| Ancho máximo | No | Valor numérico | 0 | Especifica el ancho máximo del bloque de texto en píxeles. El valor predeterminado de 0 determina que no se especifica ningún ancho máximo |
| Alto mínimo en píxeles | No | Valor numérico | 0 | Especifica el alto mínimo del formulario. El valor predeterminado de 0 determina que no se especifica ninguna altura mínima |
| Valor mínimo | Sí | Valor de texto | Sugerencia de valor mínimo. Para las entradas de fecha y hora, el valor debe expresarse en el formato regional de su máquina | |
| Multilínea | N/D | Valor booleano | Falso | Si se habilita, permite varias líneas de entrada |
| Patrón | Sí | Valor de texto | Expresión regular que indica el formato necesario de esta entrada de texto | |
| Separador | N/D | Valor booleano | False | Cuando se habilita, dibuja una línea de separación en la parte superior del elemento |
| Tamaño | N/D | Bloque de texto: Predeterminado, Pequeño, Mediano, Grande, Extra grande Imagen: Automático, Ampliar, Pequeño, Mediano, Grande |
Bloque de texto: Predeterminado Imagen: Automático |
Controla el tamaño del texto o la imagen |
| Espaciado | N/D | Predeterminado, Ninguno, Pequeño, Mediano, Grande, Extra grande, Acolchado | Predeterminado | Controla la cantidad de espaciado entre este elemento y el anterior |
| Tachado | N/D | Valor booleano | Falso | Si está habilitado, tacha el texto |
| Estilo | N/D | Entrada de texto: texto, teléfono, URL, correo electrónico Entrada de conjunto de opciones: Compacto, Ampliado Imagen: Predeterminado, Persona |
Entrada de texto: Texto Entrada del conjunto de opciones: Compacto Imagen: predeterminada |
El estilo de la sugerencia de texto, el conjunto de opciones o la imagen |
| Sutil | N/D | Valor booleano | Falso | Si se habilita, muestra texto en un tono ligeramente más suave para que parezca menos visible |
| Texto | Sí | Valor de texto | Nuevo bloque de texto | Texto que se mostrará |
| Nombre | Sí | Valor de texto | Activar entrada: Nueva entrada activada Enviar: Aceptar |
Título para el formulario personalizado o alternar o etiqueta para el botón que representa esta acción |
| Dirección URL | Sí | Valor de texto | La URL de la imagen (para el elemento de imagen y el formulario personalizado) o la URL para abrir (para la acción Abrir URL) | |
| Validación obligatoria | Sí | Valor booleano | Falso | Determina si esta entrada es necesaria o no |
| Valor cuando está desactivada | Sí | Valor de texto | Falso | El valor cuando la alternancia está desactivada |
| Valor cuando está activada | Sí | Valor de texto | Verdadero | El valor cuando la alternancia está activada |
| Alineación vertical | N/D | Superior, Centro, Inferior | Describe cómo se debe alinear la imagen si debe estar recortada o si se usa el modo de relleno repetido | |
| Alineación de contenido vertical | N/D | Superior, Centro, Inferior | Arriba | Define cómo se debe alinear verticalmente el contenido dentro del contenedor. Solo relevante para formularios de altura fija o formularios con una altura mínima especificada |
| Grosor | N/D | Predeterminado, Más claro, Más oscuro | Predeterminado | Controla el peso del texto |
| Ancho en píxeles | No | Valor numérico | 0 | El ancho en pantalla deseado de la imagen. Esto anula la propiedad "Tamaño". El valor predeterminado de 0 determina que no se especifica ningún ancho en particular |
| Ajuste | N/D | Valor booleano | False | Si está habilitado, permite que el texto se ajuste. De lo contrario, el texto se recorta |
Problemas y limitaciones conocidos
Asunto: El panel de vista previa parece funcionar como se esperaba cuando la propiedad URL contiene caracteres de porcentaje, pero se produce un error de validación valor no válido.
Solución alternativa: Este problema sucede porque Power Automate intenta resolver los caracteres de porcentaje como variables o expresiones. Para resolver este caso, almacene la URL en una variable anterior en el flujo, escape los caracteres de porcentaje y luego use esa variable en la propiedad URL. La vista previa no mostrará la imagen, pero se mostrará durante el tiempo de ejecución.