Compartir a través de


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.

Captura de pantalla de la acción Mostrar formulario personalizado.

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.

Captura de pantalla de los elementos del formulario disponibles.

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.

Captura de pantalla del contenido de un objeto personalizado.

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.

Captura de pantalla de una acción de formulario personalizado configurada.

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.

Captura de pantalla de un formulario personalizado de ejemplo.

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 Valor de texto Texto alternativo que describe la imagen
Color de fondo 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 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 Valor de texto, valor numérico El valor predeterminado del elemento de entrada
Mensaje de error 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 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 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 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 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 Valor de texto Nuevo bloque de texto Texto que se mostrará
Nombre 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 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 Valor booleano Falso Determina si esta entrada es necesaria o no
Valor cuando está desactivada Valor de texto Falso El valor cuando la alternancia está desactivada
Valor cuando está activada 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.