Flutter (веб) video_player Автозапуск

Кто-нибудь знает, что мне нужно сделать, чтобы мои видео воспроизводились автоматически после загрузки моего веб-сайта flutter?

Единственное, что мне пока удалось, - это заставить их воспроизводиться / зацикливаться, если я обновляю страницу вручную.

Я уверен, что это что-то простое, но после 3 месяцев, когда я вообще не кодировал, я немного заржавел ...

В данный момент я звоню _videoPlayerController.play() внутри FutureBuilder

class VideoWithChild extends StatefulWidget {
  final String videoSource;
  final FractionalOffset alignment;
  final TextAlign textAlign;
  final Widget child;

  const VideoWithChild(
      {Key key, this.videoSource, this.alignment, this.textAlign, this.child})
      : super(key: key);

  @override
  _VideoWithChildState createState() =>
      _VideoWithChildState(videoSource, alignment, textAlign, child);
}

class _VideoWithChildState extends State<VideoWithChild> {
  final String videoSource;
  final TextAlign textAlign;
  final Widget child;
  final FractionalOffset alignment;
  VideoPlayerController _videoPlayerController;
  Future<void> _initializeVideoPlayerFuture;
  VoidCallback listener;

  _VideoWithChildState(
      this.videoSource, this.alignment, this.textAlign, this.child);

  @override
  void initState() {
    _videoPlayerController = VideoPlayerController.asset(videoSource);
    _initializeVideoPlayerFuture = _videoPlayerController.initialize();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    print('build');
    return FutureBuilder(
      future: _initializeVideoPlayerFuture,
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.done &&
            _videoPlayerController.dataSource.isNotEmpty) {
              print('connection state');
          _videoPlayerController.play();
          _videoPlayerController.setLooping(true);
          return AspectRatio(
            aspectRatio: _videoPlayerController.value.aspectRatio,
            child: Stack(
              children: <Widget>[
                VideoPlayer(_videoPlayerController),
                LayoutBuilder(
                  builder: (context, constraints) {
                    return Align(alignment: alignment, child: child);
                  },
                )
              ],
            ),
          );
        } else {
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: Center(
                child: CircularProgressIndicator(
              valueColor: AlwaysStoppedAnimation<Color>(
                Color(0xff49148c),
              ),
            )),
          );
        }
      },
    );
  }

  @override
  void dispose() {
    print('dispose');
    super.dispose();
    _videoPlayerController.dispose();
  }
}

flutter dart flutter-web
person Chris    schedule 29.01.2020    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Chrome или другие браузеры могут не поддерживать автоматическое воспроизведение видео, как указано здесь. и упомянутые video_player_web автором здесь.

Однако вы можете запустить его автоматически, если отключите звук. Основываясь на ответе post, вы можете использовать WidgetsBinding.instance.addPostFrameCallback для автоматическое воспроизведение вашего видео. В вашем initState методе попробуйте добавить следующие строки.

WidgetsBinding.instance.addPostFrameCallback((_) {
      // mutes the video
      _videoPlayerController.setVolume(0); 
      // Plays the video once the widget is build and loaded.
      _videoPlayerController.play();
    });

Однако, если вы хотите, чтобы видео воспроизводилось после загрузки всего веб-сайта, вы можете сделать это в javascript, используя свойство body tags onload, как определено здесь.

person Abhilash Chandran    schedule 29.01.2020
comment
Прекрасно, спасибо за ответ - ваше решение работает отлично! - person Chris; 30.01.2020