Изображения, видео и иконки

A flow screen with an image element on it

Flow Builder включает три типа медиаэлементов в категории Media: Image (изображение), Video (видео) и Icon (иконка).

Изображение

Загрузите файл .JPG, .PNG или .GIF размером до 20 МБ.

  • Aspect — управляет тем, как изображение вписывается в контейнер:
    • Fit — масштабирует изображение так, чтобы оно целиком помещалось в контейнер без обрезки.
    • Fill — растягивает изображение, заполняя контейнер.
    • Cover — масштабирует изображение так, чтобы оно покрывало контейнер, обрезая при необходимости. По умолчанию.
  • Use custom media ID — см. раздел Custom media ID ниже.

Видео

Загрузите файл .MP4 или .WEBM размером до 50 МБ и продолжительностью не более 30 секунд.

  • Aspect — Fit, Fill или Cover. По умолчанию Fill.
  • Loop — зациклить воспроизведение видео. Включено по умолчанию.
  • Use custom media ID — см. Произвольный медиа ID ниже.

Видео не воспроизводится в превью редактора — на канвасе отображается статичный кадр. На устройстве в рантайме видео воспроизводится без звука по умолчанию. При включённом Loop повторяется бесконечно.

Запустить действие по окончании видео

Основная статья: Действия

Элемент Video поддерживает триггер On playback finished, который срабатывает, когда видео заканчивается. Настройте его в панели Interactions, чтобы перейти на другой экран, показать CTA или выполнить любое другое действие.

Иконка

Выбор иконки из библиотеки Tabler Icons

Выбирайте иконки из встроенной библиотеки Tabler Icons — тысячи иконок в двух стилях:

  • Stroke — только контур.
  • Filled — сплошная заливка.

Ищите иконку по ключевому слову в пикере. Цвет иконки задаётся в пикере Color — выберите сохранённый стиль цвета или укажите произвольный.

Пользовательский медиа-ID

Вы также можете задать пользовательский медиа-ID для фона в виде изображения или видео.

Присвойте элементу изображения или видео пользовательский медиа-ID, чтобы заменять его во время выполнения из кода приложения. Используйте это для персонализированных визуальных материалов — например, для отображения выбранного пользователем аватара.

Медиафайл, загруженный в Flow Builder, используется как резервный вариант. Если ваш код не предоставляет медиафайл для этого ID во время выполнения, вместо него отображается резервный вариант.

Чтобы включить пользовательский медиа-ID для элемента изображения или видео:

  1. Установите флажок Use custom media ID под областью загрузки.
  2. Введите медиа-ID.
  3. Загрузите резервное изображение или видео.

В коде приложения получайте медиафайлы по их ID — см. Настройка ресурсов для SDK API.