feat: 简单实现弹幕功能

This commit is contained in:
guozhigq
2023-08-29 23:10:22 +08:00
parent 5f730af347
commit dfbe3b1f6c
23 changed files with 646 additions and 241 deletions

View File

@ -21,6 +21,7 @@ class VideoDetailController extends GetxController
/// 路由传参
String bvid = Get.parameters['bvid']!;
int cid = int.parse(Get.parameters['cid']!);
RxInt danmakuCid = 0.obs;
String heroTag = Get.arguments['heroTag'];
// 视频详情
Map videoItem = {};
@ -73,6 +74,7 @@ class VideoDetailController extends GetxController
// 默认记录历史记录
bool enableHeart = true;
var userInfo;
late bool isFirstTime = true;
@override
void onInit() {
@ -100,6 +102,7 @@ class VideoDetailController extends GetxController
localCache.get(LocalCacheKey.historyPause) == true) {
enableHeart = false;
}
danmakuCid.value = cid;
}
showReplyReplyPanel() {
@ -193,6 +196,7 @@ class VideoDetailController extends GetxController
bvid: bvid,
cid: cid,
enableHeart: enableHeart,
isFirstTime: isFirstTime,
);
}
@ -233,7 +237,6 @@ class VideoDetailController extends GetxController
currentDecodeFormats = VideoDecodeFormatsCode.fromString(setting.get(
SettingBoxKey.defaultDecode,
defaultValue: VideoDecodeFormats.values.last.code))!;
print(currentDecodeFormats.description);
try {
// 当前视频没有对应格式返回第一个
bool flag = false;
@ -287,6 +290,7 @@ class VideoDetailController extends GetxController
defaultST = Duration(milliseconds: data.lastPlayTime!);
if (autoPlay.value) {
await playerInit();
isShowCover.value = false;
}
} else {
if (result['code'] == -404) {

View File

@ -418,6 +418,7 @@ class VideoIntroController extends GetxController {
Get.find<VideoDetailController>(tag: Get.arguments['heroTag']);
videoDetailCtr.bvid = bvid;
videoDetailCtr.cid = cid;
videoDetailCtr.danmakuCid.value = cid;
videoDetailCtr.queryVideoUrl();
// 重新请求评论
try {

View File

@ -31,9 +31,10 @@ class VideoIntroPanel extends StatefulWidget {
class _VideoIntroPanelState extends State<VideoIntroPanel>
with AutomaticKeepAliveClientMixin {
final VideoIntroController videoIntroController =
Get.put(VideoIntroController(), tag: Get.arguments['heroTag']);
late String heroTag;
late VideoIntroController videoIntroController;
VideoDetailData? videoDetail;
late Future? _futureBuilderFuture;
// 添加页面缓存
@override
@ -42,6 +43,11 @@ class _VideoIntroPanelState extends State<VideoIntroPanel>
@override
void initState() {
super.initState();
/// fix 全屏时参数丢失
heroTag = Get.arguments['heroTag'];
videoIntroController = Get.put(VideoIntroController(), tag: heroTag);
_futureBuilderFuture = videoIntroController.queryVideoIntro();
videoIntroController.videoDetail.listen((value) {
videoDetail = value;
});
@ -57,15 +63,20 @@ class _VideoIntroPanelState extends State<VideoIntroPanel>
Widget build(BuildContext context) {
super.build(context);
return FutureBuilder(
future: videoIntroController.queryVideoIntro(),
future: _futureBuilderFuture,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
if (snapshot.data == null) {
return const SliverToBoxAdapter(child: SizedBox());
}
if (snapshot.data['status']) {
// 请求成功
return Obx(
() => VideoInfo(
loadingStatus: false,
videoDetail: videoIntroController.videoDetail.value),
loadingStatus: false,
videoDetail: videoIntroController.videoDetail.value,
heroTag: heroTag,
),
);
} else {
// 请求错误
@ -79,7 +90,11 @@ class _VideoIntroPanelState extends State<VideoIntroPanel>
);
}
} else {
return VideoInfo(loadingStatus: true, videoDetail: videoDetail);
return VideoInfo(
loadingStatus: true,
videoDetail: videoDetail,
heroTag: heroTag,
);
}
},
);
@ -89,8 +104,10 @@ class _VideoIntroPanelState extends State<VideoIntroPanel>
class VideoInfo extends StatefulWidget {
final bool loadingStatus;
final VideoDetailData? videoDetail;
final String? heroTag;
const VideoInfo({Key? key, this.loadingStatus = false, this.videoDetail})
const VideoInfo(
{Key? key, this.loadingStatus = false, this.videoDetail, this.heroTag})
: super(key: key);
@override
@ -98,7 +115,8 @@ class VideoInfo extends StatefulWidget {
}
class _VideoInfoState extends State<VideoInfo> with TickerProviderStateMixin {
final String heroTag = Get.arguments['heroTag'];
// final String heroTag = Get.arguments['heroTag'];
late String heroTag;
late final VideoIntroController videoIntroController;
late final VideoDetailController videoDetailCtr;
late final Map<dynamic, dynamic> videoItem;
@ -117,7 +135,7 @@ class _VideoInfoState extends State<VideoInfo> with TickerProviderStateMixin {
@override
void initState() {
super.initState();
heroTag = widget.heroTag!;
videoIntroController = Get.put(VideoIntroController(), tag: heroTag);
videoDetailCtr = Get.find<VideoDetailController>(tag: heroTag);
videoItem = videoIntroController.videoItem!;

View File

@ -10,6 +10,7 @@ import 'package:pilipala/common/widgets/sliver_header.dart';
import 'package:pilipala/http/user.dart';
import 'package:pilipala/models/common/search_type.dart';
import 'package:pilipala/pages/bangumi/introduction/index.dart';
import 'package:pilipala/pages/danmaku/view.dart';
import 'package:pilipala/pages/video/detail/introduction/widgets/menu_row.dart';
import 'package:pilipala/pages/video/detail/reply/index.dart';
import 'package:pilipala/pages/video/detail/controller.dart';
@ -41,7 +42,6 @@ class _VideoDetailPageState extends State<VideoDetailPage>
Get.put(VideoIntroController(), tag: Get.arguments['heroTag']);
PlayerStatus playerStatus = PlayerStatus.playing;
// bool isShowCover = true;
double doubleOffset = 0;
Box localCache = GStrorage.localCache;
@ -49,11 +49,15 @@ class _VideoDetailPageState extends State<VideoDetailPage>
late double statusBarHeight;
final videoHeight = Get.size.width * 9 / 16;
late Future _futureBuilderFuture;
// 自动退出全屏
late bool autoExitFullcreen;
@override
void initState() {
super.initState();
statusBarHeight = localCache.get('statusBarHeight');
autoExitFullcreen =
setting.get(SettingBoxKey.enableAutoExit, defaultValue: false);
videoSourceInit();
appbarStreamListen();
}
@ -63,7 +67,7 @@ class _VideoDetailPageState extends State<VideoDetailPage>
_futureBuilderFuture = videoDetailController.queryVideoUrl();
if (videoDetailController.autoPlay.value) {
plPlayerController = videoDetailController.plPlayerController;
playerListener();
plPlayerController!.addStatusLister(playerListener);
}
}
@ -79,23 +83,15 @@ class _VideoDetailPageState extends State<VideoDetailPage>
}
// 播放器状态监听
void playerListener() {
plPlayerController!.onPlayerStatusChanged.listen(
(PlayerStatus status) async {
playerStatus = status;
if (status == PlayerStatus.playing) {
videoDetailController.isShowCover.value = false;
} else {
// 播放完成停止 or 切换下一个
if (status == PlayerStatus.completed) {
// 当只有1p或多p未打开自动播放时播放完成还原进度条展示控制栏
plPlayerController!.seekTo(Duration.zero);
plPlayerController!.onLockControl(false);
plPlayerController!.videoPlayerController!.pause();
}
}
},
);
void playerListener(PlayerStatus? status) {
if (status == PlayerStatus.completed) {
// 结束播放退出全屏
if (autoExitFullcreen) {
plPlayerController!.triggerFullScreen(status: false);
}
// 播放完展示控制栏
plPlayerController!.onLockControl(false);
}
}
// 继续播放或重新播放
@ -110,11 +106,11 @@ class _VideoDetailPageState extends State<VideoDetailPage>
plPlayerController = videoDetailController.plPlayerController;
videoDetailController.autoPlay.value = true;
videoDetailController.isShowCover.value = false;
playerListener();
}
@override
void dispose() {
plPlayerController!.removeStatusLister(playerListener);
plPlayerController!.dispose();
super.dispose();
}
@ -128,6 +124,7 @@ class _VideoDetailPageState extends State<VideoDetailPage>
}
videoDetailController.defaultST = plPlayerController!.position.value;
videoIntroController.isPaused = true;
plPlayerController!.removeStatusLister(playerListener);
plPlayerController!.pause();
super.didPushNext();
}
@ -135,12 +132,14 @@ class _VideoDetailPageState extends State<VideoDetailPage>
@override
// 返回当前页面时
void didPopNext() async {
videoDetailController.isFirstTime = false;
videoDetailController.playerInit();
videoIntroController.isPaused = false;
if (_extendNestCtr.position.pixels == 0) {
await Future.delayed(const Duration(milliseconds: 300));
plPlayerController!.play();
}
plPlayerController!.addStatusLister(playerListener);
super.didPopNext();
}
@ -187,120 +186,127 @@ class _VideoDetailPageState extends State<VideoDetailPage>
builder: (context, boxConstraints) {
double maxWidth = boxConstraints.maxWidth;
double maxHeight = boxConstraints.maxHeight;
return Hero(
tag: videoDetailController.heroTag,
child: Stack(
children: [
FutureBuilder(
future: _futureBuilderFuture,
builder: ((context, snapshot) {
if (snapshot.hasData &&
snapshot.data['status']) {
return Obx(
() => videoDetailController
.autoPlay.value
? PLVideoPlayer(
return Stack(
children: [
FutureBuilder(
future: _futureBuilderFuture,
builder: ((context, snapshot) {
if (snapshot.hasData &&
snapshot.data['status']) {
return Obx(
() => !videoDetailController
.autoPlay.value
? const SizedBox()
: PLVideoPlayer(
controller: plPlayerController!,
headerControl: HeaderControl(
controller:
plPlayerController!,
headerControl: HeaderControl(
controller:
plPlayerController,
videoDetailCtr:
videoDetailController,
plPlayerController,
videoDetailCtr:
videoDetailController,
),
danmuWidget: Obx(
() => PlDanmaku(
key: Key(
videoDetailController
.danmakuCid.value
.toString()),
cid: videoDetailController
.danmakuCid.value,
playerController:
plPlayerController!,
),
)
: const SizedBox(),
);
} else {
return const SizedBox();
}
}),
),
Obx(
() => Visibility(
visible: videoDetailController
.isShowCover.value,
child: Positioned(
top: 0,
left: 0,
right: 0,
child: NetworkImgLayer(
type: 'emote',
src: videoDetailController
.videoItem['pic'],
width: maxWidth,
height: maxHeight,
),
),
),
);
} else {
return const SizedBox();
}
}),
),
Obx(
() => Visibility(
visible:
videoDetailController.isShowCover.value,
child: Positioned(
top: 0,
left: 0,
right: 0,
child: NetworkImgLayer(
type: 'emote',
src: videoDetailController
.videoItem['pic'],
width: maxWidth,
height: maxHeight,
),
),
),
),
/// 关闭自动播放时 手动播放
Obx(
() => Visibility(
visible: videoDetailController
.isShowCover.value &&
videoDetailController
.isEffective.value &&
!videoDetailController
.autoPlay.value,
child: Stack(
children: [
Positioned(
top: 0,
left: 0,
right: 0,
child: AppBar(
primary: false,
foregroundColor: Colors.white,
/// 关闭自动播放时 手动播放
Obx(
() => Visibility(
visible: videoDetailController
.isShowCover.value &&
videoDetailController
.isEffective.value &&
!videoDetailController.autoPlay.value,
child: Stack(
children: [
Positioned(
top: 0,
left: 0,
right: 0,
child: AppBar(
primary: false,
foregroundColor: Colors.white,
backgroundColor:
Colors.transparent,
actions: [
IconButton(
tooltip: '稍后再看',
onPressed: () async {
var res = await UserHttp
.toViewLater(
bvid:
videoDetailController
.bvid);
SmartDialog.showToast(
res['msg']);
},
icon: const Icon(
Icons.history_outlined),
),
const SizedBox(width: 14)
],
),
),
Positioned(
right: 12,
bottom: 10,
child: TextButton.icon(
style: ButtonStyle(
backgroundColor:
Colors.transparent,
actions: [
IconButton(
tooltip: '稍后再看',
onPressed: () async {
var res = await UserHttp
.toViewLater(
bvid:
videoDetailController
.bvid);
SmartDialog.showToast(
res['msg']);
},
icon: const Icon(
Icons.history_outlined),
),
const SizedBox(width: 14)
],
MaterialStateProperty
.resolveWith((states) {
return Theme.of(context)
.colorScheme
.primaryContainer;
}),
),
),
Positioned(
right: 12,
bottom: 10,
child: TextButton.icon(
style: ButtonStyle(
backgroundColor:
MaterialStateProperty
.resolveWith(
(states) {
return Theme.of(context)
.colorScheme
.primaryContainer;
}),
),
onPressed: () => handlePlay(),
icon: const Icon(
Icons.play_circle_outline,
size: 20,
),
label: const Text('Play'),
onPressed: () => handlePlay(),
icon: const Icon(
Icons.play_circle_outline,
size: 20,
),
label: const Text('Play'),
),
],
)),
),
],
),
),
],
)),
),
],
);
},
),

View File

@ -499,6 +499,28 @@ class _HeaderControlState extends State<HeaderControl> {
// ),
// fuc: () => _.screenshot(),
// ),
SizedBox(
width: 34,
height: 34,
child: Obx(
() => IconButton(
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
),
onPressed: () {
_.isOpenDanmu.value = !_.isOpenDanmu.value;
},
icon: Icon(
_.isOpenDanmu.value
? Icons.subtitles_outlined
: Icons.subtitles_off_outlined,
size: 19,
color: Colors.white,
),
),
),
),
const SizedBox(width: 4),
Obx(
() => SizedBox(
width: 45,