Flutter视频播放、Flutter VideoPlayer 视频播放组件精要

1 添加依赖

  # 视频播放
  video_player: ^1.0.1

2 播放视频前的准备
2.1 网络访问权限
在 ios 目录下的 info.plist 清单文件中配置 iOS设置的http网络访问权限 :

NSAppTransportSecurity

  NSAllowsArbitraryLoads
  

如下图所示
Flutter视频播放、Flutter VideoPlayer 视频播放组件精要_第1张图片
在 android 目录下的 AndroidManifest.xml 清单文件中配置网络请求权限以及http的访问权限

    
    
    
    

Flutter视频播放、Flutter VideoPlayer 视频播放组件精要_第2张图片
networkSecurityConfig 配置的是 http访问权限



    

Flutter视频播放、Flutter VideoPlayer 视频播放组件精要_第3张图片
3 视频播放
视频资源的加载以及播放控制全部是通过 VideoPlayerController来操作的

3.1 视频资源的加载

VideoPlayerController  _playerController ;
  @override
  void initState() {
    super.initState();

    //网络链接
    //VideoPlayerController.network(url);
    //VideoPlayerController.file(File(url));
    //本地链接
    _videoPlayerController =
        VideoPlayerController.asset("asset资源路径");

   //调用初始化方法
   _videoPlayerController.initialize()
     //异步执行完的回调
     ..whenComplete(() {
       //刷新页面
       setState(() {});
     });

  }

3.2 视频播放组件

AspectRatio(
   //设置视频的大小 宽高比。长宽比表示为宽高比。例如,16:9宽高比的值为16.0/9.0
   aspectRatio: _videoPlayerController.value.aspectRatio,
   //播放视频的组件
   child: VideoPlayer(_videoPlayerController),
 ),
)

3.3 视频播放相关控制

    //获取当前视频播放的信息
    VideoPlayerValue videoPlayerValue = _videoPlayerController.value;

    //是否初始化完成
    bool initialized = videoPlayerValue.initialized;
    //是否正在播放
    bool isPlaying = videoPlayerValue.isPlaying;
    //当前播放的视频的宽高比例
    double aspectRatio = videoPlayerValue.aspectRatio;
    //当前视频是否缓存
    bool isBuffer = videoPlayerValue.isBuffering;
    //当前视频是否循环
    bool isLoop = videoPlayerValue.isLooping;
    //当前播放视频的总时长
    Duration totalDuration = videoPlayerValue.duration;
    //当前播放视频的位置
    Duration currentDuration = videoPlayerValue.position;
    if (initialized) {
      // 视频已初始化
      if (isPlaying) {
        // 正播放 --- 暂停
        _videoPlayerController.pause();
      } else {
        //暂停 ----播放
        _videoPlayerController.play();
      }
      setState(() {});
    } else {
      //未初始化
      _videoPlayerController.initialize().then((_) {
        // videoPlayerController.play();
        // setState(() {});
      });
    }

你可能感兴趣的:(androidflutter)