} else if (widget.type == VideoPlayerType.asset) {
_controller = VideoPlayerController.asset(widget.url);
} else {
_controller = VideoPlayerController.network(widget.url);
}
/// 加载资源完成时,监听播放进度,并且标记_videoInit=true加载完成
_controller.addListener(_videoListener);
await _controller.initialize();
setState(() {
_videoInit = true;
_videoError = false;
_controller.play();
});
}
这里有一个需要注意的点:_controller.addListener(_videoListener);
我们添加监听一定要在初始化之前添加,不然后续的加载状态无法响应。在监听函数中我们这里使用了GlobalKey去调用组件方法,刷新子组件时间显示的页面显示
void _videoListener() async {
if (_controller.value.hasError) {
setState(() {
_videoError = true;
});
} else {
Duration res = await _controller.position;
if (res >= _controller.value.duration) {
await _controller.seekTo(Duration(seconds: 0));
await _controller.pause();
}
if (_controller.value.isPlaying && _key.currentState != null) {
/// 减少build次数
_key.currentState.setPosition(
position: res,
totalDuration: _controller.value.duration,
);
}
}
}
4.2.2. 改变视频源
在传入的url发生改变的时候,重新初始化视频,这里我们就需要用到didUpdateWidget
这个生命周期:
@override
void didUpdateWidget(VideoPlayerUI oldWidget) {
if (oldWidget.url != widget.url) {
_urlChange(); // url变化时重新执行一次url加载
}
super.didUpdateWidget(oldWidget);
}
4.3. 完整代码
5. 视频控制按键VideoPlayerControl
5.1 轻触显示界面
该组件主要的功能就是,轻触屏幕会弹出操作按钮,过两秒后按钮会消失,这里我们就需要一个Timer定时器,