Видеоплеер

Виджет VideoPlayer используется для показа видео из загруженных активов или URL-ссылки. Виджет VideoPlayer может воспроизводить различные видеоформаты, включая, но не ограничиваясь ими, MP4, MOV, WAV, MPEG, JPEG motion photo и так далее.

Вот как вы можете добавить виджет VideoPlayer в свой проект:

• Перетащите виджет VideoPlayer с вкладки Base Elements (в панели виджетов) или добавьте его непосредственно из дерева виджетов.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Video Player.
• Найдите свойство Path и введите URL—адрес нового видео.

По умолчанию виджет настроен на воспроизведение видео из интернета. Однако вы можете изменить это, чтобы использовать видео, загруженное непосредственно в ваше приложение.

Вот как можно изменить тип видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Видеоплеер«.
• Найдите выпадающий список Тип видео. Нажмите на Network (внутри выпадающего списка) и выберите Asset.
• Теперь найдите свойство Asset Video, нажмите на кнопку Upload Video, выберите видео и загрузите его.

Если вы хотите использовать одно и то же видео несколько раз в своем приложении, вам не нужно загружать одно и то же видео несколько раз. Загруженное видео можно использовать и для других виджетов VideoPlayer.

Чтобы использовать загруженное видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Видеоплеер«.
• Найдите выпадающий список Тип видео. Нажмите на Сеть (внутри выпадающего списка) и выберите Актив.
• Нажмите на Нет выбора актива (внутри раскрывающегося списка) и выберите видео.

Панель свойств можно использовать для настройки внешнего вида и поведения виджета.

Здесь приведены инструкции по добавлению вставки.

Здесь приведены инструкции по настройке выравнивания.

Чтобы изменить высоту и ширину видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Видеоплеер«.
• Найдите параметры Ширина и Высота.
• Существует три способа задать размеры видео:
  • Чтобы установить точный размер, выберите PX и введите нужные значения.
  • Чтобы задать размеры в процентах от размера экрана, выберите % и введите нужное значение.
  • Чтобы сделать высоту или ширину видеоролика равной высоте или ширине экрана, просто нажмите на значок бесконечности ().

Установка соотношения сторон для VideoPlayer позволяет показывать видео в определенном соотношении сторон. Высота виджета определяется путем применения заданного соотношения сторон к ширине, выраженной как отношение ширины к высоте. Например, при установке значения 1,7 видео будет отображаться в соотношении сторон 16:9.

Чтобы установить соотношение сторон:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Видеоплеер«.
• Найдите свойство Aspect Ratio, если вы хотите установить соотношение сторон 16:9, введите значение 1,7 (просто разделите 16 на 9).

Свойство AutoPlay позволяет вам настроить, должно ли видео начать воспроизводиться сразу после загрузки. По умолчанию это свойство отключено, и для начала просмотра видео необходимо нажать на кнопку воспроизведения.

Чтобы включить/выключить автовоспроизведение видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Video Player.
• Найдите свойство Auto Play, установите/отмените флажок, чтобы включить или отключить автовоспроизведение.

Свойство Loop Video позволяет вам настроить, должно ли видео после окончания воспроизводиться снова. По умолчанию это свойство включено, и видео продолжает воспроизводиться после его окончания.

Чтобы включить/выключить зацикливание видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Video Player.
• Найдите свойство Loop Video, установите/отмените флажок, чтобы включить или отключить зацикливание видео.

Свойство Show Controls позволяет вам настроить, должен ли плеер показывать элементы управления над видео, такие как кнопка воспроизведения-паузы, полоса поиска и так далее. По умолчанию это свойство включено, и все элементы управления видео видны над видео.

Чтобы показать/скрыть элементы управления видео:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Video Player.
• Найдите свойство «Показывать элементы управления«, установите/отмените флажок, чтобы показать или скрыть элементы управления над видео.

Свойство Allow Full Screen позволяет настроить, должен ли плеер показывать значок полноэкранного режима в элементах управления видео. По умолчанию это свойство включено, и пользователи могут открывать видео в полноэкранном режиме, нажав на полноэкранный значок в правом нижнем углу проигрывателя.

Чтобы включить/выключить полноэкранный значок:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела Video Player.
• Найдите свойство Allow Full Screen, установите/отмените флажок, чтобы показать/скрыть значок полноэкранного режима.

Свойство Include Speed Playback Menu позволяет настроить, должен ли плеер показывать меню скорости воспроизведения. Меню скорости воспроизведения помогает пользователям увеличивать или уменьшать скорость видео. По умолчанию это свойство отключено.

Чтобы отобразить меню скорости воспроизведения:

• Выберите виджет VideoPlayer в дереве виджетов или в области холста.
• Перейдите в редактор свойств (в правой части экрана) и прокрутите вниз до раздела «Видеоплеер«.
• Найдите свойство Include Playback Speed Menu, отметьте его (щелкните по нему).

Чтобы выполнить какое-либо действие по щелчку на видео, добавьте действие в FlutterFlow. Инструкции по добавлению действия вы можете найти здесь.

Чтобы показать данные, извлеченные из коллекции Firestore, и документ в виджете, убедитесь, что вы:
Понимаете структурирование базы данных Firebase.

• Выполнили все шаги в разделе «Настройка Firebase» для вашего проекта.
• Извлекли данные из коллекции или документа.
• Наконец, чтобы отобразить данные в виджете, выполните следующие шаги.

Инструкции по отображению/скрытию виджета находятся здесь.