119ba920
liangchengyou
feat:视频播放器
|
1
|
import 'package:common_utils/common_utils.dart';
|
119ba920
liangchengyou
feat:视频播放器
|
2
|
import 'package:flutter/material.dart';
|
46675a89
吴启风
feat:过渡页-视频环节
|
3
|
import 'package:flutter_bloc/flutter_bloc.dart';
|
cb38bc90
liangchengyou
feat:视频跟读逻辑处理
|
4
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
119ba920
liangchengyou
feat:视频播放器
|
5
|
import 'package:video_player/video_player.dart';
|
91fe517a
liangchengyou
feat:看视频功能开发
|
6
|
import 'package:wow_english/common/extension/string_extension.dart';
|
46675a89
吴启风
feat:过渡页-视频环节
|
7
|
import 'package:wow_english/pages/video/lookvideo/bloc/look_video_bloc.dart';
|
934e2b47
liangchengyou
feat:权限调整+课程进度接口对接
|
8
|
import 'package:wow_english/route/route.dart';
|
4b358e22
liangchengyou
feat:调整文件结构
|
9
|
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
10
11
|
import '../../../section/subsection/base_section/event.dart';
import '../../../section/subsection/base_section/state.dart';
|
4b358e22
liangchengyou
feat:调整文件结构
|
12
|
import 'video_opera_widget.dart';
|
119ba920
liangchengyou
feat:视频播放器
|
13
14
|
class VideoWidget extends StatefulWidget {
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
15
16
17
18
19
20
|
const VideoWidget(
{super.key,
this.videoUrl = '',
this.typeTitle,
this.courseLessonId = '',
this.isTopic = false});
|
119ba920
liangchengyou
feat:视频播放器
|
21
22
|
final String videoUrl;
|
842b7132
liangchengyou
feat:磨耳朵/练习页面调整
|
23
|
final String? typeTitle;
|
934e2b47
liangchengyou
feat:权限调整+课程进度接口对接
|
24
|
final String courseLessonId;
|
46675a89
吴启风
feat:过渡页-视频环节
|
25
|
final bool isTopic;
|
119ba920
liangchengyou
feat:视频播放器
|
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
@override
State<StatefulWidget> createState() {
return _VideoWidgetState();
}
}
class _VideoWidgetState extends State<VideoWidget> {
VideoPlayerController? _controller;
String _currentTime = '00:00';
String _totalTime = '00:00';
double _playDegree = 0.0;
bool _hiddenTipView = false;
TimerUtil? timerUtil;
String formatDuration(Duration duration) {
String hours = duration.inHours.toString().padLeft(2, '0');
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
43
44
45
46
|
String minutes =
duration.inMinutes.remainder(60).toString().padLeft(2, '0');
String seconds =
duration.inSeconds.remainder(60).toString().padLeft(2, '0');
|
119ba920
liangchengyou
feat:视频播放器
|
47
48
49
50
51
|
return "$hours:$minutes:$seconds";
}
void _addListener() {
_controller!.addListener(() {
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
52
|
if (_controller!.value.isInitialized) {
|
119ba920
liangchengyou
feat:视频播放器
|
53
54
|
if (_controller!.value.isPlaying) {
setState(() {
|
66a7e3e7
吴启风
feat:退出课堂和结束课堂优化
|
55
|
double currentSecond = getCurrentPositionSeconds().toDouble();
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
56
57
58
|
int totalSecond =
_controller!.value.duration.inMinutes.remainder(60) * 60 +
_controller!.value.duration.inSeconds.remainder(60);
|
119ba920
liangchengyou
feat:视频播放器
|
59
|
_currentTime = formatDuration(_controller!.value.position);
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
60
|
_playDegree = currentSecond / totalSecond;
|
3840b7fe
liangchengyou
feat:更新设置页面
|
61
62
63
|
if (_playDegree > 1.0) {
_playDegree = 1.0;
}
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
64
|
if (_playDegree < 0) {
|
3840b7fe
liangchengyou
feat:更新设置页面
|
65
66
|
_playDegree = 0.0;
}
|
119ba920
liangchengyou
feat:视频播放器
|
67
|
});
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
68
69
70
71
72
73
74
|
} else if (widget.isTopic &&
//受限于video_player库没有唯一的播放完成状态标识,发现isBuffering=false的时候暂时是安全唯一的
_controller?.value.isBuffering == false &&
_controller!.value.isCompleted &&
_controller!.value.position.inSeconds ==
_controller!.value.duration.inSeconds) {
final lookVideoBloc = context.read<LookVideoBloc>();
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
75
76
77
78
79
80
81
82
83
|
lookVideoBloc.sectionComplete(
() {
popPage(data: {
'courseLessonId': widget.courseLessonId,
'currentTime': getCurrentPositionSeconds(),
'isCompleted': true,
'nextSection': widget.isTopic
});
} as VoidCallback, againSectionTap: (() {
|
c272c662
吴启风
fix: 崩溃修复
|
84
85
86
|
if (mounted && !lookVideoBloc.isClosed) {
lookVideoBloc.add(SectionAgainEvent());
}
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
87
|
}), context: context);
|
119ba920
liangchengyou
feat:视频播放器
|
88
89
90
91
92
93
|
}
}
});
}
//开始倒计时
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
94
95
96
|
void startTimer() {
if (timerUtil == null) {
timerUtil = TimerUtil(mInterval: 1000, mTotalTime: 1000 * 10);
|
119ba920
liangchengyou
feat:视频播放器
|
97
98
|
timerUtil!.setOnTimerTickCallback((int tick) {
double currentTick = tick / 1000;
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
99
100
|
if (currentTick.toInt() == 0) {
//倒计时结束
|
119ba920
liangchengyou
feat:视频播放器
|
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
|
setState(() {
_hiddenTipView = true;
});
timerUtil!.cancel();
timerUtil = null;
}
});
timerUtil!.startCountDown();
}
}
//取消倒计时
void cancelTimer() {
timerUtil!.cancel();
timerUtil = null;
}
|
91fe517a
liangchengyou
feat:看视频功能开发
|
118
119
|
void actionType(OperationType type) async {
if (type == OperationType.back) {
|
934e2b47
liangchengyou
feat:权限调整+课程进度接口对接
|
120
121
122
123
124
125
126
|
if (widget.courseLessonId.isEmpty) {
popPage();
} else {
if (_controller == null) {
popPage();
return;
}
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
127
128
|
popPage(data: {
'courseLessonId': widget.courseLessonId,
|
66a7e3e7
吴启风
feat:退出课堂和结束课堂优化
|
129
|
'currentTime': getCurrentPositionSeconds(),
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
130
|
});
|
934e2b47
liangchengyou
feat:权限调整+课程进度接口对接
|
131
|
}
|
91fe517a
liangchengyou
feat:看视频功能开发
|
132
133
134
135
136
137
|
} else if (type == OperationType.playState) {
if (_controller!.value.isPlaying) {
_controller!.pause();
} else {
_controller!.play();
}
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
138
|
setState(() {});
|
91fe517a
liangchengyou
feat:看视频功能开发
|
139
140
141
|
}
}
|
119ba920
liangchengyou
feat:视频播放器
|
142
143
144
|
@override
void initState() {
super.initState();
|
934e2b47
liangchengyou
feat:权限调整+课程进度接口对接
|
145
146
|
Uri uri = Uri.parse(widget.videoUrl);
_controller = VideoPlayerController.networkUrl(uri)
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
147
|
..initialize().then((_) {
|
119ba920
liangchengyou
feat:视频播放器
|
148
149
150
151
|
startTimer();
setState(() {
_currentTime = formatDuration(_controller!.value.position);
_totalTime = formatDuration(_controller!.value.duration);
|
46675a89
吴启风
feat:过渡页-视频环节
|
152
|
_controller!.setLooping(!widget.isTopic);
|
119ba920
liangchengyou
feat:视频播放器
|
153
154
155
156
157
158
159
160
161
|
_controller!.setVolume(100);
_controller!.play();
});
_addListener();
});
}
@override
Widget build(BuildContext context) {
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
162
163
164
165
166
167
|
return BlocListener<LookVideoBloc, BaseSectionState>(
listener: (context, state) async {
if (state is SectionAgainState) {
await _controller?.seekTo(Duration.zero);
_controller?.play();
}
|
119ba920
liangchengyou
feat:视频播放器
|
168
|
},
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
169
170
|
child: GestureDetector(
onTap: () {
|
91fe517a
liangchengyou
feat:看视频功能开发
|
171
|
setState(() {
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
172
173
174
175
176
177
178
179
|
_hiddenTipView = !_hiddenTipView;
if (!_hiddenTipView) {
startTimer();
} else {
if (timerUtil!.isActive()) {
cancelTimer();
}
}
|
91fe517a
liangchengyou
feat:看视频功能开发
|
180
|
});
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
181
182
183
184
185
186
187
188
189
190
191
192
193
194
|
},
onDoubleTap: () {
if (_controller!.value.isInitialized) {
if (_controller!.value.isPlaying) {
_controller!.pause();
} else {
_controller!.play();
}
setState(() {});
}
},
child: Center(
child: _controller!.value.isInitialized
? Stack(
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
|
alignment: Alignment.center,
children: [
SizedBox(
height: double.infinity,
width: double.infinity,
child: AspectRatio(
aspectRatio: _controller!.value.aspectRatio,
child: VideoPlayer(_controller!),
),
),
Offstage(
offstage: _hiddenTipView,
child: VideoOperaWidget(
title: widget.typeTitle ?? 'song',
degree: _playDegree,
totalTime: _totalTime,
currentTime: _currentTime,
isPlay: _controller!.value.isPlaying,
actionEvent: (OperationType type) {
actionType(type);
},
sliderChangeEvent: (double degree) {
int totalSecond = _controller!
.value.duration.inMinutes
.remainder(60) *
60 +
_controller!.value.duration.inSeconds
.remainder(60);
int positionSecond = (totalSecond * degree).toInt();
_controller!
.seekTo(Duration(seconds: positionSecond));
},
),
),
Offstage(
offstage: _controller!.value.isPlaying,
child: IconButton(
onPressed: () {
_controller!.play();
},
icon: Image.asset(
'video_stop'.assetPng,
width: 70.w,
height: 70.h,
),
),
)
],
)
|
aa0d2360
吴启风
feat:过渡页-视频环节(再来一次)
|
244
|
: Container(
|
1e22b7d1
吴启风
feat:儿歌/视频环节接口请求时机优化
|
245
246
247
248
249
250
251
|
color: Colors.white,
child: const CircularProgressIndicator(),
// Text(
// '视频加载中....',
// style: TextStyle(fontSize: 20.sp, color: Colors.black),
// ),
),
|
119ba920
liangchengyou
feat:视频播放器
|
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
|
),
),
);
}
@override
void dispose() {
_controller?.dispose();
_controller?.removeListener(() {});
if (timerUtil != null) {
timerUtil!.cancel();
timerUtil = null;
}
super.dispose();
}
|
66a7e3e7
吴启风
feat:退出课堂和结束课堂优化
|
267
268
269
270
271
272
|
///获取当前进度秒数
int getCurrentPositionSeconds() {
return (_controller!.value.position.inMinutes.remainder(60) * 60 +
_controller!.value.position.inSeconds.remainder(60));
}
|
119ba920
liangchengyou
feat:视频播放器
|
273
|
}
|