fix: 全屏手势被遮挡导致难以触发;回调竖向手势触发范围(1:1:1),避免亮度音量调整困难;调高手势灵敏度;屏蔽过于顶部的手势

This commit is contained in:
orz12
2024-08-18 17:14:11 +08:00
parent a008747a36
commit 4fc5913633

View File

@@ -523,16 +523,20 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
scaleEnabled: true, // 启用缩放 scaleEnabled: true, // 启用缩放
minScale: 1.0, minScale: 1.0,
maxScale: 2.0, maxScale: 2.0,
panAxis: PanAxis.aligned,
onInteractionStart: (ScaleStartDetails details) { onInteractionStart: (ScaleStartDetails details) {
// 如果起点太靠上则屏蔽
if (details.localFocalPoint.dy < 40) return;
if (details.pointerCount == 2) { if (details.pointerCount == 2) {
interacting = true; interacting = true;
} }
_initialFocalPoint = details.localFocalPoint; _initialFocalPoint = details.localFocalPoint;
// print("_initialFocalPoint$_initialFocalPoint");
_gestureType = null; _gestureType = null;
}, },
onInteractionUpdate: (ScaleUpdateDetails details) { onInteractionUpdate: (ScaleUpdateDetails details) {
if (interacting) return; if (interacting || _initialFocalPoint == Offset.zero) return;
Offset cumulativeDelta = Offset cumulativeDelta =
details.localFocalPoint - _initialFocalPoint; details.localFocalPoint - _initialFocalPoint;
if (details.pointerCount == 2 && cumulativeDelta.distance < 1.5) { if (details.pointerCount == 2 && cumulativeDelta.distance < 1.5) {
@@ -547,20 +551,20 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
_playerKey.currentContext!.findRenderObject() as RenderBox; _playerKey.currentContext!.findRenderObject() as RenderBox;
if (_gestureType == null) { if (_gestureType == null) {
if (cumulativeDelta.distance < 1.5) return; if (cumulativeDelta.distance < 1) return;
if (cumulativeDelta.dx.abs() > 4 * cumulativeDelta.dy.abs()) { if (cumulativeDelta.dx.abs() > 3 * cumulativeDelta.dy.abs()) {
_gestureType = 'horizontal'; _gestureType = 'horizontal';
} else if (cumulativeDelta.dy.abs() > } else if (cumulativeDelta.dy.abs() >
4 * cumulativeDelta.dx.abs()) { 3 * cumulativeDelta.dx.abs()) {
// _gestureType = 'vertical'; // _gestureType = 'vertical';
final double totalWidth = renderBox.size.width; final double totalWidth = renderBox.size.width;
final double tapPosition = details.localFocalPoint.dx; final double tapPosition = details.localFocalPoint.dx;
final double sectionWidth = totalWidth / 4; final double sectionWidth = totalWidth / 3;
if (tapPosition < sectionWidth) { if (tapPosition < sectionWidth) {
// 左边区域 // 左边区域
_gestureType = 'left'; _gestureType = 'left';
} else if (tapPosition < sectionWidth * 3) { } else if (tapPosition < sectionWidth * 2) {
// 全屏 // 全屏
_gestureType = 'center'; _gestureType = 'center';
} else { } else {
@@ -596,20 +600,15 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
setBrightness(result); setBrightness(result);
} else if (_gestureType == 'center') { } else if (_gestureType == 'center') {
// 全屏 // 全屏
const double threshold = 5; // 滑动阈值 const double threshold = 2; // 滑动阈值
// void fullScreenTrigger(bool status) async {
// EasyThrottle.throttle(
// 'fullScreen', const Duration(milliseconds: 1000), () {
// _.triggerFullScreen(status: status);
// });
// }
double cumulativeDy = double cumulativeDy =
details.localFocalPoint.dy - _initialFocalPoint.dy; details.localFocalPoint.dy - _initialFocalPoint.dy;
if (cumulativeDy > threshold) { if (cumulativeDy > threshold) {
_gestureType = 'center_down'; _gestureType = 'center_down';
// print('center_down:$cumulativeDy');
} else if (cumulativeDy < -threshold) { } else if (cumulativeDy < -threshold) {
_gestureType = 'center_up'; _gestureType = 'center_up';
// print('center_up:$cumulativeDy');
} }
} else if (_gestureType == 'right') { } else if (_gestureType == 'right') {
// 右边区域 // 右边区域
@@ -627,10 +626,10 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
_.onChangedSliderEnd(); _.onChangedSliderEnd();
_.seekTo(_.sliderPosition.value, type: 'slider'); _.seekTo(_.sliderPosition.value, type: 'slider');
} }
void fullScreenTrigger(bool status) async { void fullScreenTrigger(bool status) {
EasyThrottle.throttle( EasyThrottle.throttle(
'fullScreen', const Duration(milliseconds: 1000), () { 'fullScreen', const Duration(milliseconds: 500), () async {
_.triggerFullScreen(status: status); await _.triggerFullScreen(status: status);
}); });
} }
@@ -695,46 +694,49 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
), ),
/// 时间进度 toast /// 时间进度 toast
Obx( IgnorePointer(
() => Align( ignoring: true,
child: Align(
alignment: Alignment.topCenter, alignment: Alignment.topCenter,
child: FractionalTranslation( child: FractionalTranslation(
translation: const Offset(0.0, 1.0), // 上下偏移量(负数向上偏移) translation: const Offset(0.0, 1.0), // 上下偏移量(负数向上偏移)
child: AnimatedOpacity( child: Obx(
curve: Curves.easeInOut, () => AnimatedOpacity(
opacity: _.isSliderMoving.value ? 1.0 : 0.0, curve: Curves.easeInOut,
duration: const Duration(milliseconds: 150), opacity: _.isSliderMoving.value ? 1.0 : 0.0,
child: IntrinsicWidth( duration: const Duration(milliseconds: 150),
child: Container( child: IntrinsicWidth(
alignment: Alignment.center, child: Container(
decoration: BoxDecoration( alignment: Alignment.center,
color: const Color(0x88000000), decoration: BoxDecoration(
borderRadius: BorderRadius.circular(64.0), color: const Color(0x88000000),
), borderRadius: BorderRadius.circular(64.0),
height: 34.0, ),
padding: const EdgeInsets.only(left: 10, right: 10), height: 34.0,
child: Row( padding: const EdgeInsets.only(left: 10, right: 10),
mainAxisAlignment: MainAxisAlignment.center, child: Row(
children: [ mainAxisAlignment: MainAxisAlignment.center,
Obx(() { children: [
return Text( Obx(() {
Utils.timeFormat( return Text(
_.sliderTempPosition.value.inSeconds), Utils.timeFormat(
style: textStyle, _.sliderTempPosition.value.inSeconds),
); style: textStyle,
}), );
const SizedBox(width: 2), }),
const Text('/', style: textStyle), const SizedBox(width: 2),
const SizedBox(width: 2), const Text('/', style: textStyle),
Obx( const SizedBox(width: 2),
() => Text( Obx(
_.duration.value.inMinutes >= 60 () => Text(
? printDurationWithHours(_.duration.value) _.duration.value.inMinutes >= 60
: printDuration(_.duration.value), ? printDurationWithHours(_.duration.value)
style: textStyle, : printDuration(_.duration.value),
style: textStyle,
),
), ),
), ],
], ),
), ),
), ),
), ),
@@ -744,50 +746,53 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
), ),
/// 音量🔊 控制条展示 /// 音量🔊 控制条展示
Obx( IgnorePointer(
() => Align( ignoring: true,
child: AnimatedOpacity( child: Align(
curve: Curves.easeInOut, child: Obx(
opacity: _volumeIndicator.value ? 1.0 : 0.0, () => AnimatedOpacity(
duration: const Duration(milliseconds: 150), curve: Curves.easeInOut,
child: Container( opacity: _volumeIndicator.value ? 1.0 : 0.0,
alignment: Alignment.center, duration: const Duration(milliseconds: 150),
decoration: BoxDecoration( child: Container(
color: const Color(0x88000000), alignment: Alignment.center,
borderRadius: BorderRadius.circular(64.0), decoration: BoxDecoration(
), color: const Color(0x88000000),
height: 34.0, borderRadius: BorderRadius.circular(64.0),
width: 70.0, ),
child: Row( height: 34.0,
mainAxisSize: MainAxisSize.min, width: 70.0,
mainAxisAlignment: MainAxisAlignment.center, child: Row(
children: <Widget>[ mainAxisSize: MainAxisSize.min,
Container( mainAxisAlignment: MainAxisAlignment.center,
height: 34.0, children: <Widget>[
width: 28.0, Container(
alignment: Alignment.centerRight, height: 34.0,
child: Icon( width: 28.0,
_volumeValue.value == 0.0 alignment: Alignment.centerRight,
? Icons.volume_off child: Icon(
: _volumeValue.value < 0.5 _volumeValue.value == 0.0
? Icons.volume_down ? Icons.volume_off
: Icons.volume_up, : _volumeValue.value < 0.5
color: const Color(0xFFFFFFFF), ? Icons.volume_down
size: 20.0, : Icons.volume_up,
), color: const Color(0xFFFFFFFF),
), size: 20.0,
Expanded(
child: Text(
'${(_volumeValue.value * 100.0).round()}%',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13.0,
color: Color(0xFFFFFFFF),
), ),
), ),
), Expanded(
const SizedBox(width: 6.0), child: Text(
], '${(_volumeValue.value * 100.0).round()}%',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13.0,
color: Color(0xFFFFFFFF),
),
),
),
const SizedBox(width: 6.0),
],
),
), ),
), ),
), ),
@@ -795,51 +800,54 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
), ),
/// 亮度🌞 控制条展示 /// 亮度🌞 控制条展示
Obx( IgnorePointer(
() => Align( ignoring: true,
child: AnimatedOpacity( child: Align(
curve: Curves.easeInOut, child: Obx(
opacity: _brightnessIndicator.value ? 1.0 : 0.0, () => AnimatedOpacity(
duration: const Duration(milliseconds: 150), curve: Curves.easeInOut,
child: Container( opacity: _brightnessIndicator.value ? 1.0 : 0.0,
alignment: Alignment.center, duration: const Duration(milliseconds: 150),
decoration: BoxDecoration( child: Container(
color: const Color(0x88000000), alignment: Alignment.center,
borderRadius: BorderRadius.circular(64.0), decoration: BoxDecoration(
), color: const Color(0x88000000),
height: 34.0, borderRadius: BorderRadius.circular(64.0),
width: 70.0, ),
child: Row( height: 34.0,
mainAxisSize: MainAxisSize.min, width: 70.0,
mainAxisAlignment: MainAxisAlignment.center, child: Row(
children: <Widget>[ mainAxisSize: MainAxisSize.min,
Container( mainAxisAlignment: MainAxisAlignment.center,
height: 30.0, children: <Widget>[
width: 28.0, Container(
alignment: Alignment.centerRight, height: 30.0,
child: Icon( width: 28.0,
_brightnessValue.value < 1.0 / 3.0 alignment: Alignment.centerRight,
? Icons.brightness_low child: Icon(
: _brightnessValue.value < 2.0 / 3.0 _brightnessValue.value < 1.0 / 3.0
? Icons.brightness_medium ? Icons.brightness_low
: Icons.brightness_high, : _brightnessValue.value < 2.0 / 3.0
color: const Color(0xFFFFFFFF), ? Icons.brightness_medium
size: 18.0, : Icons.brightness_high,
), color: const Color(0xFFFFFFFF),
), size: 18.0,
const SizedBox(width: 2.0),
Expanded(
child: Text(
'${(_brightnessValue.value * 100.0).round()}%',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13.0,
color: Color(0xFFFFFFFF),
), ),
), ),
), const SizedBox(width: 2.0),
const SizedBox(width: 6.0), Expanded(
], child: Text(
'${(_brightnessValue.value * 100.0).round()}%',
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 13.0,
color: Color(0xFFFFFFFF),
),
),
),
const SizedBox(width: 6.0),
],
),
), ),
), ),
), ),