添加插件
pubspec.yaml
chewie: ^1.0.0
video_player: ^2.0.2
封装播放器
video_view.dart
class VideoView extends StatefulWidget {
final String url; // 播放地址
final String cover; // 封面
final bool autoPlay; // 是否自动播放
final bool looping; // 是否循环
final double aspectRatio; // 宽高比
const VideoView(this.url,
{Key key, this.cover, this.autoPlay, this.looping, this.aspectRatio})
: super(key: key);
@override
_VideoViewState createState() => _VideoViewState();
}
class _VideoViewState extends State<VideoView> {
VideoPlayerController _videoPlayerController;
ChewieController _chewieController;
// 封面 (FractionallySizedBox:可控制组件在水平/垂直方向上填充满父容器)
get _placeHolder => FractionallySizedBox(
widthFactor: 1,
child: cacheImage(widget.cover),
);
// 进度条颜色设置
get _progressColors => ChewieProgressColors(
playedColor: primary,
bufferedColor: primary,
handleColor: Colors.grey,
backgroundColor: primary[50],
);
@override
void initState() {
super.initState();
_videoPlayerController = VideoPlayerController.network(widget.url);
_chewieController = ChewieController(
//要播放的视频的控制器
videoPlayerController: _videoPlayerController,
// 缩放比
aspectRatio: widget.aspectRatio,
// 是否自动播放
autoPlay: widget.autoPlay,
// 封面
looping: widget.looping,
// 进度条颜色
placeholder: _placeHolder,
// 进度条颜色
materialProgressColors: _progressColors,
// 是否静音
allowMuting: false,
// 是否显示播放速度
allowPlaybackSpeedChanging: false,
customControls: MaterialControls(
showLoadingOnInitialize: false,
showBigPlayIcon: false,
bottomGradient: blackLinearGradient(),
));
}
@override
void dispose() {
super.dispose();
_videoPlayerController.dispose();
_chewieController.dispose();
}
@override
Widget build(BuildContext context) {
double screenWidth = MediaQuery.of(context).size.width; // 播放器宽度
double screenHeight = screenWidth / widget.aspectRatio; // 播放器高度
return Container(
width: screenWidth,
height: screenHeight,
color: Colors.grey,
child: Chewie(
controller: _chewieController,
),
);
}
}