Полноэкранное видео фон в Flutter при входе

Question

Я хочу отобразить видео на своей странице входа в систему, например Spotify, на котором вы можете воспроизводить видео и кнопки для входа или регистрации:

Это плагин, который я нашел до сих пор:

video_player 0.7.2 Но я думаю, что цель другая.

Я знаю, как отобразить изображение, но мне не удалось использовать плагин выше вместо изображения. Это то, что я сейчас использую изображение в качестве фона

body: new Container(
    height: MediaQuery.of(context).size.height,
    decoration: BoxDecoration(
      color: Colors.redAccent,
      image: DecorationImage(
        colorFilter: new ColorFilter.mode(
            Colors.black.withOpacity(0.1), BlendMode.dstATop),
        image: AssetImage('assets/my_image.jpg'),
        fit: BoxFit.cover,
      ),
    ),
    ...
  ..

Спасибо и хорошее кодирование

Answer 1

Единственный способ, которым я смог приблизиться к решению, - это что-то вроде этого.

Предполагается, что это видео 1920 x 1080, и вы используете video_player .

Container(
  width: *screen width*,
  height: *screen height*,
  child: Stack(
    children: <Widget>[
      Center(
        child: Transform.scale(
          scale: 3.9, //change this number as needed
          AspectRatio(
            aspectRatio: _controller.value.aspectRatio,
            child: VideoPlayer(_controller),
          ),
        ),
      ),
      *widgets will go on top of screen*
    ],
  ),
)

Найти правильный двойной масштаб - самая сложная часть, вам может понадобиться найти небольшое уравнение, которое можно адаптировать ко всем устройствам. Если вы найдете какие-либо опечатки или хотите добавить к нему, не стесняйтесь. Надеюсь, это поможет!

Answer 2

Может быть стек виджет является одним из решений.

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

     Stack(
        //alignment:new Alignment(x, y)
        children: <Widget>[
          new Container(
            //play video here
          ),
          new Container(
            //have your Ui here
          ),
        ],
      ),