fix: 顶部播放控制条重载,界面尺寸微调

This commit is contained in:
orz12
2024-03-22 13:41:11 +08:00
parent 74ac540753
commit 9943cc099b

View File

@@ -57,6 +57,7 @@ class _HeaderControlState extends State<HeaderControl> {
late StreamSubscription<bool> fullScreenStatusListener; late StreamSubscription<bool> fullScreenStatusListener;
late bool horizontalScreen; late bool horizontalScreen;
RxString now = ''.obs; RxString now = ''.obs;
late Timer clock;
@override @override
void initState() { void initState() {
@@ -89,6 +90,7 @@ class _HeaderControlState extends State<HeaderControl> {
void dispose() { void dispose() {
widget.floating?.dispose(); widget.floating?.dispose();
fullScreenStatusListener.cancel(); fullScreenStatusListener.cancel();
clock.cancel();
super.dispose(); super.dispose();
} }
@@ -1040,11 +1042,11 @@ class _HeaderControlState extends State<HeaderControl> {
} }
startClock() { startClock() {
Timer.periodic(const Duration(seconds: 1), (Timer t) { clock = Timer.periodic(const Duration(seconds: 1), (Timer t) {
if (!mounted) { if (!mounted) {
return; return;
} }
now.value = DateTime.now().toString().split(' ')[1].substring(0, 8); now.value = DateTime.now().toString().split(' ')[1].substring(0, 5);
}); });
} }
@@ -1053,224 +1055,229 @@ class _HeaderControlState extends State<HeaderControl> {
final _ = widget.controller!; final _ = widget.controller!;
// final bool isLandscape = // final bool isLandscape =
// MediaQuery.of(context).orientation == Orientation.landscape; // MediaQuery.of(context).orientation == Orientation.landscape;
return AppBar(
backgroundColor: Colors.transparent, return LayoutBuilder(builder: (context, boxConstraints) {
foregroundColor: Colors.white, return AppBar(
elevation: 0, backgroundColor: Colors.transparent,
scrolledUnderElevation: 0, foregroundColor: Colors.white,
primary: false, elevation: 0,
centerTitle: false, scrolledUnderElevation: 0,
automaticallyImplyLeading: false, primary: false,
titleSpacing: 10, centerTitle: false,
title: Row( automaticallyImplyLeading: false,
children: [ titleSpacing: 10,
SizedBox( title: Row(
width: 42, children: [
height: 34,
child: IconButton(
tooltip: '上一页',
icon: const Icon(
FontAwesomeIcons.arrowLeft,
size: 15,
color: Colors.white,
),
onPressed: () {
if (widget.controller!.isFullScreen.value) {
widget.controller!.triggerFullScreen(status: false);
} else if (MediaQuery.of(context).orientation ==
Orientation.landscape &&
!horizontalScreen) {
verticalScreenForTwoSeconds();
} else {
Get.back();
}
},
)),
if ((videoIntroController.videoDetail.value.title != null) &&
(isFullScreen ||
(!isFullScreen &&
MediaQuery.of(context).orientation ==
Orientation.landscape &&
!horizontalScreen))) ...[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ConstrainedBox(
constraints: BoxConstraints(
maxWidth: MediaQuery.of(context).orientation ==
Orientation.landscape
? 400
: 140,
maxHeight: 25),
child: Marquee(
text: videoIntroController.videoDetail.value.title!,
style: const TextStyle(
color: Colors.white,
fontSize: 16,
),
scrollAxis: Axis.horizontal,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 200,
velocity: 40,
startAfter: const Duration(seconds: 1),
showFadingOnlyWhenScrolling: true,
fadingEdgeStartFraction: 0,
fadingEdgeEndFraction: 0.1,
numberOfRounds: 1,
startPadding: 0,
accelerationDuration: const Duration(seconds: 1),
accelerationCurve: Curves.linear,
decelerationDuration: const Duration(milliseconds: 500),
decelerationCurve: Curves.easeOut,
),
),
if (videoIntroController.isShowOnlineTotal)
Text(
'${videoIntroController.total.value}人正在看',
style: const TextStyle(
color: Colors.white,
fontSize: 11,
),
)
],
),
] else ...[
SizedBox( SizedBox(
width: 42, width: 42,
height: 34, height: 34,
child: IconButton( child: IconButton(
tooltip: '返回主', tooltip: '上一',
icon: const Icon( icon: const Icon(
FontAwesomeIcons.house, FontAwesomeIcons.arrowLeft,
size: 15, size: 15,
color: Colors.white, color: Colors.white,
), ),
onPressed: () async { onPressed: () {
// 销毁播放器实例 if (widget.controller!.isFullScreen.value) {
// await widget.controller!.dispose(type: 'all'); widget.controller!.triggerFullScreen(status: false);
if (mounted) { } else if (MediaQuery.of(context).orientation ==
Navigator.popUntil( Orientation.landscape &&
context, (Route<dynamic> route) => route.isFirst); !horizontalScreen) {
verticalScreenForTwoSeconds();
} else {
Get.back();
} }
}, },
)), )),
], if ((videoIntroController.videoDetail.value.title != null) &&
const Spacer(), (isFullScreen ||
if ((isFullScreen && (!isFullScreen &&
MediaQuery.of(context).orientation == MediaQuery.of(context).orientation ==
Orientation.landscape) || Orientation.landscape &&
(!isFullScreen && !horizontalScreen))) ...[
MediaQuery.of(context).orientation == Orientation.landscape && Column(
!horizontalScreen)) ...[ crossAxisAlignment: CrossAxisAlignment.start,
// const Spacer(), children: [
// show current datetime ConstrainedBox(
Obx( constraints: BoxConstraints(
() => Text( maxWidth: boxConstraints.maxWidth / 2 - 60,
now.value, maxHeight: 25),
style: const TextStyle( child: Marquee(
color: Colors.white, text: videoIntroController.videoDetail.value.title!,
fontSize: 13, style: const TextStyle(
color: Colors.white,
fontSize: 16,
),
scrollAxis: Axis.horizontal,
crossAxisAlignment: CrossAxisAlignment.start,
blankSpace: 200,
velocity: 40,
startAfter: const Duration(seconds: 1),
showFadingOnlyWhenScrolling: true,
fadingEdgeStartFraction: 0,
fadingEdgeEndFraction: 0.1,
numberOfRounds: 1,
startPadding: 0,
accelerationDuration: const Duration(seconds: 1),
accelerationCurve: Curves.linear,
decelerationDuration: const Duration(milliseconds: 500),
decelerationCurve: Curves.easeOut,
),
),
if (videoIntroController.isShowOnlineTotal)
Text(
'${videoIntroController.total.value}人正在看',
style: const TextStyle(
color: Colors.white,
fontSize: 11,
),
)
],
),
] else ...[
SizedBox(
width: 42,
height: 34,
child: IconButton(
tooltip: '返回主页',
icon: const Icon(
FontAwesomeIcons.house,
size: 15,
color: Colors.white,
),
onPressed: () async {
// 销毁播放器实例
// await widget.controller!.dispose(type: 'all');
if (mounted) {
Navigator.popUntil(
context, (Route<dynamic> route) => route.isFirst);
}
},
)),
],
const Spacer(),
if ((isFullScreen &&
MediaQuery.of(context).orientation ==
Orientation.landscape) ||
(!isFullScreen &&
MediaQuery.of(context).orientation ==
Orientation.landscape &&
!horizontalScreen)) ...[
// const Spacer(),
// show current datetime
Obx(
() => Text(
now.value,
style: const TextStyle(
color: Colors.white,
fontSize: 13,
),
), ),
), ),
), const SizedBox(
const SizedBox(width: 15,), width: 15,
],
// ComBtn(
// icon: const Icon(
// FontAwesomeIcons.cropSimple,
// size: 15,
// color: Colors.white,
// ),
// fuc: () => _.screenshot(),
// ),
SizedBox(
width: 42,
height: 34,
child: IconButton(
tooltip: '发弹幕',
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
), ),
onPressed: () => showShootDanmakuSheet(), ],
icon: const Icon( // ComBtn(
Icons.add_comment_outlined, // icon: const Icon(
size: 19, // FontAwesomeIcons.cropSimple,
color: Colors.white, // size: 15,
), // color: Colors.white,
), // ),
), // fuc: () => _.screenshot(),
SizedBox( // ),
width: 42,
height: 34,
child: Obx(
() => IconButton(
tooltip: "${_.isOpenDanmu.value ? '关闭' : '开启'}弹幕",
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
),
onPressed: () {
_.isOpenDanmu.value = !_.isOpenDanmu.value;
SmartDialog.showToast(
_.isOpenDanmu.value ? '已临时开启弹幕' : '已临时关闭弹幕',
displayTime: const Duration(seconds: 1));
},
icon: Icon(
_.isOpenDanmu.value
? Icons.comment_outlined
: Icons.comments_disabled_outlined,
size: 19,
color: Colors.white,
),
),
),
),
if (Platform.isAndroid)
SizedBox( SizedBox(
width: 42, width: 42,
height: 34, height: 34,
child: IconButton( child: IconButton(
tooltip: '画中画', tooltip: '发弹幕',
style: ButtonStyle( style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero), padding: MaterialStateProperty.all(EdgeInsets.zero),
), ),
onPressed: () async { onPressed: () => showShootDanmakuSheet(),
bool canUsePiP = widget.floating != null &&
await widget.floating!.isPipAvailable;
widget.controller!.hiddenControls(false);
if (canUsePiP) {
final Rational aspectRatio = Rational(
widget.videoDetailCtr!.data.dash!.video!.first.width!,
widget.videoDetailCtr!.data.dash!.video!.first.height!,
);
await widget.floating!.enable(aspectRatio: aspectRatio);
} else {}
},
icon: const Icon( icon: const Icon(
Icons.picture_in_picture_outlined, Icons.add_comment_outlined,
size: 19, size: 19,
color: Colors.white, color: Colors.white,
), ),
), ),
), ),
SizedBox( SizedBox(
width: 42, width: 42,
height: 34, height: 34,
child: IconButton( child: Obx(
tooltip: "更多设置", () => IconButton(
style: ButtonStyle( tooltip: "${_.isOpenDanmu.value ? '关闭' : '开启'}弹幕",
padding: MaterialStateProperty.all(EdgeInsets.zero), style: ButtonStyle(
), padding: MaterialStateProperty.all(EdgeInsets.zero),
onPressed: () => showSettingSheet(), ),
icon: const Icon( onPressed: () {
Icons.more_vert_outlined, _.isOpenDanmu.value = !_.isOpenDanmu.value;
size: 19, setting.put(
color: Colors.white, SettingBoxKey.enableShowDanmaku, _.isOpenDanmu.value);
SmartDialog.showToast(
"${_.isOpenDanmu.value ? '开启' : '关闭'}弹幕",
displayTime: const Duration(seconds: 1));
},
icon: Icon(
_.isOpenDanmu.value
? Icons.comment_outlined
: Icons.comments_disabled_outlined,
size: 19,
color: Colors.white,
),
),
), ),
), ),
), if (Platform.isAndroid)
], SizedBox(
), width: 42,
); height: 34,
child: IconButton(
tooltip: '画中画',
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
),
onPressed: () async {
bool canUsePiP = widget.floating != null &&
await widget.floating!.isPipAvailable;
widget.controller!.hiddenControls(false);
if (canUsePiP) {
final Rational aspectRatio = Rational(
widget.videoDetailCtr!.data.dash!.video!.first.width!,
widget.videoDetailCtr!.data.dash!.video!.first.height!,
);
await widget.floating!.enable(aspectRatio: aspectRatio);
} else {}
},
icon: const Icon(
Icons.picture_in_picture_outlined,
size: 19,
color: Colors.white,
),
),
),
SizedBox(
width: 42,
height: 34,
child: IconButton(
tooltip: "更多设置",
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
),
onPressed: () => showSettingSheet(),
icon: const Icon(
Icons.more_vert_outlined,
size: 19,
color: Colors.white,
),
),
),
],
),
);
});
} }
} }