Corfix Form Builder: cómo utilizar el componente «Foto»

1. Pestaña «Visualización»

La pestaña «Visualización» controla cómo se muestra el componente «Foto» al usuario.

• Etiqueta:

  • Este es el título visible del campo de carga de fotos que verán los usuarios. Es un campo obligatorio.

  • Ejemplo: «Subir fotos», «Imágenes del sitio», «Fotos de prueba».

• Posición de la etiqueta:

  • Determina dónde se muestra la etiqueta en relación con el área de subida (p. ej., arriba, a la izquierda, a la derecha, abajo).

  • Valor predeterminado: Arriba.

• Descripción:

  • Proporciona un texto explicativo adicional para el componente, que suele mostrarse debajo de la etiqueta.

  • Ejemplo: «Suba fotos del equipo dañado».

• Texto de ayuda:

  • Texto que aparece cuando el usuario pasa el ratón por encima del componente. Resulta útil para ofrecer ayuda rápida o contexto.

• Clase CSS personalizada:

  • Permite a los usuarios avanzados aplicar estilos personalizados al componente mediante clases CSS.

• Ocultar etiqueta:

  • Si se marca esta opción, no se mostrará la etiqueta del componente.

• Edición modal:

  • (Los detalles no se ven completamente en la captura de pantalla, pero suele referirse a las opciones de edición de las fotos subidas en una ventana modal emergente).

2. Pestaña «Archivo»

La pestaña «Archivo» ofrece ajustes específicos sobre cómo se gestionan las fotos, incluida la integración de la cámara web.

• Habilitar cámara web:

  • Si se marca esta casilla, permite a los usuarios capturar fotos directamente mediante la cámara web o la cámara de su dispositivo, en lugar de limitarse a subir archivos ya existentes.

• Ancho de la cámara web:

  • Establece el ancho (en píxeles) de la imagen en directo de la cámara web que se muestra durante la captura.

• Tamaño de visualización de la imagen:

  • Establece el ancho o la altura máximos (en píxeles) con los que se mostrará la imagen subida en el formulario tras su carga. Se trata de un ajuste de visualización, no del tamaño del archivo original.

• Tamaño en píxeles de la imagen:

  • Establece la dimensión máxima deseada (en píxeles) para la resolución de la imagen subida. Esto ayuda a controlar el tamaño del archivo de la imagen almacenada.

3. Pestaña «Datos»

La pestaña «Datos» gestiona cómo se tratan los datos de las fotografías subidas.

• Valores múltiples:

  • Si se marca, permite al usuario subir más de una foto a este componente. Esto resulta útil para capturar múltiples ángulos o momentos.

4. Pestaña «Validación»

La pestaña «Validación» define las reglas para el campo de subida de fotos.

• Obligatorio:

  • Si se marca esta casilla, el usuario deberá subir al menos una foto antes de enviar el formulario.

5. Pestaña «Condicional»

La pestaña «Condicional» le permite configurar reglas que determinan cuándo debe mostrarse u ocultarse este componente de foto en función de los valores de otros componentes del formulario.

• Simple:

  • Normalmente se trata de un botón de alternancia o un menú desplegable para elegir entre lógica condicional simple o avanzada.

• Este componente debe «Mostrar»:

  • Elija si el componente debe «Mostrarse» u «Ocultarse» (opciones implícitas) en función de la condición.

• Cuando el componente del formulario:

  • Seleccione otro componente de su formulario cuyo valor active la condición.

• Tenga el valor:

  • Especifique el valor exacto que debe tener el componente del formulario seleccionado para que se cumpla la condición.

  Ejemplo: Podría configurar una regla para que el componente «Subir fotos del incidente» solo se muestre cuando la casilla «¿Se ha producido un incidente?» esté marcada.

Panel de vista previa

El panel de vista previa, situado a la derecha del cuadro de diálogo, le muestra cómo aparecerá visualmente en su formulario el campo «Subir» para las fotos. Muestra el área de arrastrar y soltar y el enlace «Examinar», lo que le permite hacerse una idea en tiempo real de la interacción del usuario.

Acciones en la parte inferior del cuadro de diálogo:

• Guardar: guarda todos los cambios realizados en la configuración del componente de fotos.

• Cancelar: descarta cualquier cambio no guardado y cierra el cuadro de diálogo.

• Eliminar: Elimina el componente de foto del formulario.

Prácticas recomendadas para el componente «Foto»:

• Borrar etiqueta y descripción: utilice una etiqueta clara (por ejemplo, «Fotos del sitio») y una descripción para orientar a los usuarios sobre qué tipo de imágenes deben cargar.

• Habilitar la cámara web para uso sobre el terreno: Si los formularios se suelen rellenar in situ, active la opción «Cámara web» para capturar fotografías de forma rápida y directa.

• Permitir varias fotos: Para la mayoría de los casos en los que se requiera documentación visual, marque «Varios valores» para que los usuarios puedan subir todas las imágenes necesarias.

• Configure el tamaño en píxeles de la imagen: controle el «Tamaño en píxeles de la imagen» para equilibrar la calidad de la imagen con el tamaño del archivo, optimizando así el almacenamiento y los tiempos de carga, especialmente para los usuarios de dispositivos móviles.

• Utilice la visualización condicional: muestre el campo de subida de fotos únicamente cuando sea lógicamente necesario (por ejemplo, muestre «Subir fotos de los daños» solo si se ha marcado «Se han detectado daños»).