flutter - 有没有办法在播放 youtube 视频的视频播放器中启用控件 flutter web

Question

我正在制作一个页面来显示来自 youtube 的大量视频，并且正在使用 ext_video_player在 flutter 的网络中。但现在我想启用显示控件。我也希望它可以用于一个应用程序。我在 this 看到了堆叠在流柱上。但是 chewie 播放器说它需要来自 video_player 而不是 ext_video_player 的视频 Controller 播放器。有没有其他方法可以做到这一点，以便它既适用于 flutter web 和应用程序，也允许 youtube 视频。由于某些原因，youtube 播放器插件不是一个选择。我连一个都做不到。代码使用 rn

class videoBox2 extends StatefulWidget {
  String Video;
  videoBox2(this.Video);
  @override
  _videoBox2State createState() => _videoBox2State(Video);
}

class _videoBox2State extends State<videoBox2> {
  String Video;
  bool error = false;
  _videoBox2State(this.Video);
  VideoPlayerController _controller;
  @override
  void dispose(){
    super.dispose();
    _controller.dispose();
  }
  @override
  void initState(){
    super.initState();
    _controller = VideoPlayerController.network(
      Video,
    );

    _controller.initialize().then((value) {
      setState(() {
      });
    });
    _controller.addListener(() {
      if (_controller.value.hasError) {
        setState(() {
          error = true;
          print(Video);
        });
      }
    });
  }
  @override
  Widget build(BuildContext context) {
    return error?Container(
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.all(Radius.circular(15))
        ),
        child: Image(fit:BoxFit.cover,image:NetworkImage("https://hiapseng-thailand.com/wp-content/themes/skywalker/facilities/video-placeholder.jpg"))
    ):GestureDetector(
        onTap:(){
          _controller.value.isPlaying?
          _controller.pause()
              :_controller.play();
        },
        child: Container(
          width:MediaQuery.of(context).size.width*0.7,
          decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.all(Radius.circular(15))
          ),
          child:  VideoPlayer(_controller),
        )
    );
  }
}

Answer 1

所以我最终做的是一个非常简单的技术。我导入了 chewie 视频播放器并从外部库中的 dart 插件打开了它的文件。然后我将所有 video_player/video_player.dart 更改为 ext_video_player/ext_video_player.dart。这是因为 ext_video_player 只是视频播放器的扩展

警告:- 这将影响您使用 chewie 播放器的所有项目。进行此更改，构建项目，然后删除更改

所以你要做的是转到外部库文件夹，然后打开 Dart 包，然后向下滚动到文件夹 chewie-0.12.0(或你正在使用的任何包)\

然后打开源文件夹，找到这些文件:-\

1. chewie_player.dart
2. cupertino_controls.dart
3. cupertino_progress_bar.dart
4. material_controls.dart
5. material_progress_bar.dart
6. player_with_controls.dart\

现在在所有这些文件中，你必须滚动到顶部并找到这一行

import 'package:video_player/video_player.dart';

并将其替换为

import 'package:ext_video_player/ext_video_player.dart';

请记住导入 ext_video_player包在 pubspec.yaml 中。阅读这个包的说明，但基本上你可以提供一个 youtube url 是VideoPlayer.network()事物。我希望这能解决你的问题。如果您愿意，您也可以为应用程序使用 WebView 或为网站使用 iframe，尽管不推荐这样做