El Flow & Paywall Builder incluye tres tipos de elementos multimedia en la categoría Media: Image, Video e Icon.

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 Vídeo en su lugar.

Un elemento de imagen puede tener una imagen diferente para cada idioma. Para mostrar una imagen distinta en modo oscuro, añade un archivo oscuro al elemento.

• Content mode — controla cómo la imagen rellena su contenedor cuando estableces su altura. Ver Tamaño de imagen.
• Use custom media ID — ver Custom media ID más abajo.

Tamaño de la imagen

Una imagen tiene sus propias proporciones, y el contenedor que le asignas puede no coincidir con ellas. Establece primero el ancho y luego decide el alto:

• Alto automático. La imagen mantiene su forma: el alto se calcula a partir del ancho que establezcas. El Content mode se desactiva porque no hay nada que recortar.
• Alto fijo o de relleno. El contenedor adquiere sus propias proporciones y el Content mode resuelve el desajuste:
  • Fit. Escala la imagen completa dentro del contenedor y deja espacio vacío.
  • Fill. Recorta lo que sobresale. Valor predeterminado.

Para mantener una imagen sin recortar en cualquier ancho de pantalla, usa el ancho Fill con la altura Auto. Con una altura fija, el recorte en la parte superior e inferior varía de un tamaño de pantalla a otro.

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 — controla cómo el vídeo rellena su contenedor cuando estableces su altura. Consulta Tamaño del vídeo.
• Loop — reproduce el vídeo en bucle continuo. 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 canvas muestra un fotograma estático. En el dispositivo en tiempo de ejecución, el vídeo se reproduce sin sonido por defecto. Con Loop activado, se repite indefinidamente.

Un elemento de vídeo puede tener un vídeo diferente para cada idioma. Para mostrar un vídeo distinto en modo oscuro, añade un archivo oscuro al elemento.

Tamaño del vídeo

Un vídeo tiene sus propias proporciones, y el contenedor que le asignes puede no coincidir con ellas. La altura determina lo que ocurre:

• Hug height. La altura sigue las proporciones propias del vídeo.
• Fixed o Fill height. La propiedad Aspect resuelve el desajuste:
  • Fit. Escala el vídeo completo dentro del contenedor y deja espacio vacío.
  • Fill. Recorta lo que se desborde. Valor por defecto.

Cuando Adapty no puede leer las proporciones de un vídeo al subirlo, muestra una advertencia: “Could not determine video dimensions. Set a fixed height to ensure the video displays correctly.” Dale al vídeo una altura fija, o asegúrate de que el contenedor que lo aloja tenga una. De lo contrario, su altura puede colapsar a 0.

Desencadenar una acción cuando el vídeo termina

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. Define el color del icono en el selector Color: elige un estilo de color guardado o establece un color personalizado. Solo puedes aplicar un estilo de capa con un color sólido.

Localizar medios

Los siguientes elementos y capas pueden tener un archivo distinto por configuración regional:

• Elementos de imagen y vídeo.
• Capas de imagen y vídeo en un relleno, como el fondo de una pantalla.
• Capas de imagen y vídeo de un estilo de color, en cada versión clara u oscura por separado.

Para subir un archivo localizado:

1. Si el panel Localizations está abierto, ciérralo para mostrar el panel de propiedades.
2. En la barra de herramientas inferior, establece Locale en la configuración regional de destino.
3. Selecciona el elemento, o haz clic en un área vacía de la vista previa para el fondo de pantalla.
4. En el panel de propiedades, sube el archivo localizado.
5. Vuelve a establecer Locale en la configuración regional predeterminada, para que las ediciones posteriores se apliquen a la configuración regional predeterminada de nuevo.

Para un estilo de color, reemplaza la imagen o el vídeo en el estilo mientras la configuración regional de destino esté activa.

En una configuración regional sin archivo propio, los usuarios ven el archivo de la configuración regional predeterminada. Para un estilo de color, cada versión recurre a la configuración regional predeterminada de forma independiente. También puedes subir un archivo para cada configuración regional en el panel Localizations.

Limitaciones

No puedes localizar iconos ni IDs de medios personalizados. Para localizar una imagen o vídeo que tiene un ID de medio personalizado, usa el ID para sustituir un archivo localizado en tiempo de ejecución.

ID de medio personalizado

Etiqueta un elemento de imagen o vídeo con un ID de medio personalizado para reemplazarlo en tiempo de ejecución desde el código de tu app. Úsalo para elementos visuales personalizados — por ejemplo, para mostrar el avatar seleccionado por el usuario.

El medio que subas en el Flow & Paywall Builder actúa como respaldo. Si tu código no proporciona un medio para ese ID en tiempo de ejecución, se muestra el respaldo en su lugar.

Un ID de medio personalizado solo puede sustituir un archivo por otro del mismo tipo: una imagen por una imagen, un vídeo por un vídeo. Si los tipos no coinciden, se muestra el respaldo.

Para habilitar un ID de medio personalizado en un elemento de imagen o vídeo:

1. Selecciona la casilla Use custom media ID bajo el área de carga.
2. Introduce un ID de medio.
3. Sube una imagen o vídeo de respaldo.

En el código de tu app, obtén el medio por su ID. Consulta Personalizar assets para ver la API del SDK.