【flutter better_player_plus实现普通播放器功能】

引入better_player_plus: ^1.1.5

import 'package:better_player_plus/better_player_plus.dart';

late BetterPlayerController _videoController;
/// 进入后判断是否全屏
  bool get _isFullScreen =>
      MediaQuery.of(context).orientation == Orientation.landscape;

  Size get _window => MediaQueryData.fromView(window).size;
  
bool _isVideoInit = false;

  bool _isBuffering = false;
  

  void initState() {
    // TODO: implement initState
    super.initState();
    //BoxFit.contain + fullScreenByDefault=true + autoDetectFullscreenAspectRatio = true,设置后播放器播放时默认按视频的宽高比例放大填充父布局
    final betterPlayerConfiguration = BetterPlayerConfiguration(
          fit: BoxFit.contain,
          autoPlay: true,
          looping: true,
          fullScreenByDefault: true,
          autoDetectFullscreenAspectRatio: true,
          controlsConfiguration: const BetterPlayerControlsConfiguration(
            showControls: false, // 是否显示控制栏
            enableSkips: false, // 禁用快进/快退
          )
      );

     _videoController = BetterPlayerController(betterPlayerConfiguration,betterPlayerDataSource: dataSource);
     _videoController.addEventsListener(_videoListener);
    }

_videoListener(BetterPlayerEvent event) async {
    switch(event.betterPlayerEventType){
      case BetterPlayerEventType.initialized:
        setState(() {
          _isVideoInit = true;
          double? videoWidth = _videoController.videoPlayerController?.value.size?.width;
          double? videoHeight = _videoController.videoPlayerController?.value.size?.height;
          print('_videoWidth= $videoWidth  _videoHeight= $videoHeight');

          if(videoWidth != null && videoHeight != null){
            double aspectRatio = videoHeight / videoWidth;
            _logic.videoAspectRatio = aspectRatio;
          }
          _videoController.play();
        });
        break;
      case BetterPlayerEventType.progress:
        Duration res = _videoController.videoPlayerController!.value.position;
        Duration? totalDuration = _videoController.videoPlayerController?.value.duration;
        if (_videoController.isPlaying() == true && _key.currentState != null) {
          /// 减少build次数
          _key.currentState!.setPosition(
            position: res,
            totalDuration: totalDuration,
          );
        }
        break;
      case BetterPlayerEventType.bufferingStart:
        _isBuffering = true;
        break;
      case BetterPlayerEventType.bufferingEnd:
        _isBuffering = false;
        break;
        case BetterPlayerEventType.exception:
          esLoadingToast('视频加载失败');
          print('视频播放器问题:${_videoController.videoPlayerController!.value.errorDescription} =====');
        break;
        default:
          break;
    }
  }


  void dispose() {
    // TODO: implement dispose
    _videoController.removeEventsListener(_videoListener);
    _videoController.dispose();
    super.dispose();
  }



  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      backgroundColor: Colors.black,
      body: Container(
        width: _isFullScreen ? _window.width : double.infinity,
        height: _isFullScreen ? _window.height : double.infinity,
        alignment: Alignment.center,
        child: _isVideoInit != true || _isBuffering == true ? _coverImageView() : BetterPlayer(controller: _videoController)
    )
    );
  }

//视频封面
  _coverImageView({bool? showLoading}){
    return Stack(
      alignment: Alignment.center,
      children: [
        _logic.articleDetail!.articlePic != null
            ? Utils().roundedImage(_logic.articleDetail!.articlePic!.last.url, 2,
            fit: BoxFit.cover, borderColor: Colors.black)
            : SizedBox(width: double.infinity, height: double.infinity),
        CircularProgressIndicator(
          valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
          strokeWidth: 2,
        )
      ],
    );
  }



只配置fit: BoxFit.contain时,播放时显示区域虽然按视频比例,但是不会尽可能大的充满屏幕
在这里插入图片描述
BoxFit.contain + fullScreenByDefault=true + autoDetectFullscreenAspectRatio = true,播放时显示区域按视频比例比例尽可能大的充满屏幕
在这里插入图片描述

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值