Imágenes, vídeos e iconos
El Flow & Paywall Builder incluye tres tipos de elementos multimedia en la categoría Media: Image, Video e Icon.
Para que una imagen o vídeo cubra toda la pantalla, incluyendo las áreas detrás del notch y el indicador de inicio, colócalo como fijo con todos los desplazamientos en 0 y selecciona Ignore safe area. Consulta Diseño y posicionamiento.
Imagen
Sube un archivo .JPG, .PNG o .WEBP de hasta 20 MB.
Los GIFs y WEBPs animados no son compatibles. Para añadir movimiento, usa un elemento Video en su lugar.
- Aspect — controla cómo se ajusta la imagen a su contenedor:
- Fit — escala la imagen para que encaje dentro del contenedor sin recortarla.
- Fill — estira la imagen para rellenar el contenedor.
- Cover — escala la imagen para cubrir el contenedor, recortándola si es necesario. Predeterminado.
- Use custom media ID — consulta Custom media ID a continuación.
Video
Sube un archivo .MP4 o .WEBM de hasta 50 MB y no más de 30 segundos. La resolución mínima del vídeo es de 640x640 píxeles.
- Aspect — Fit, Fill o Cover. El valor predeterminado es Fill.
- Loop — reproduce el vídeo en bucle de forma continua. Activado por defecto.
- Use custom media ID — consulta Custom media ID más abajo.
Los vídeos no se reproducen en la vista previa del editor: el lienzo muestra un fotograma estático. En el dispositivo en tiempo de ejecución, el vídeo se reproduce sin sonido de forma predeterminada. Con Loop activado, se repite indefinidamente.
Desencadenar una acción cuando el vídeo termina
Artículo principal: Acciones
El elemento Video admite un trigger On playback finished que se activa cuando el vídeo llega al final. Configúralo en el panel Interactions para navegar a otra pantalla, mostrar un CTA o ejecutar cualquier otra acción.
Icono
Elige entre la biblioteca integrada Tabler Icons, con miles de iconos en dos estilos visuales:
- Stroke — solo contorno.
- Filled — relleno sólido.
Busca en el selector por palabra clave para encontrar un icono. Configura el color del icono en el selector Color — elige un estilo de color guardado o establece un color personalizado.
Localizar contenido multimedia
Artículo principal: Añadir un idioma
Los elementos de imagen y vídeo pueden contener un archivo diferente por idioma. Activa el idioma de destino, selecciona el elemento y sube el archivo localizado en el panel de propiedades. Los idiomas que no tienen su propio archivo muestran el archivo del idioma predeterminado.
Limitaciones
No es posible localizar los siguientes elementos:
- Iconos
- El Fill de una pantalla o un contenedor — esto incluye los fondos de pantalla y la imagen o vídeo de fondo propio de un contenedor, configurados desde la sección Fill. Para variar una imagen o vídeo según el idioma, agrégala como elemento independiente de tipo Image o Video; estos sí admiten un archivo específico por idioma, tal como se describe en Localizar contenido multimedia.
- IDs de contenido multimedia personalizados
ID de multimedia personalizado
También puedes establecer un ID de multimedia personalizado para una imagen y un vídeo de fondo.
Etiqueta un elemento de imagen o vídeo con un ID de multimedia personalizado para intercambiarlo en tiempo de ejecución desde el código de tu app. Úsalo para contenido visual personalizado — por ejemplo, mostrar el avatar seleccionado por el usuario.
El contenido multimedia que subas en el Flow & Paywall Builder sirve como respaldo. Si tu código no proporciona contenido multimedia para el ID en tiempo de ejecución, se renderiza el respaldo en su lugar.
Para habilitar un ID de multimedia personalizado en un elemento de imagen o vídeo:
- Selecciona la casilla Use custom media ID bajo el área de carga.
- Introduce un ID de medio.
- Sube una imagen o vídeo de respaldo.
En el código de tu app, obtén los medios por su ID — consulta Personalizar assets para ver la API del SDK.