opt: 播放器音量&亮度控制条

This commit is contained in:
guozhigq
2024-09-15 01:16:30 +08:00
parent ad1428b28f
commit 8aebf463e5
2 changed files with 67 additions and 93 deletions

View File

@ -26,6 +26,7 @@ import 'widgets/app_bar_ani.dart';
import 'widgets/backward_seek.dart';
import 'widgets/bottom_control.dart';
import 'widgets/common_btn.dart';
import 'widgets/control_bar.dart';
import 'widgets/forward_seek.dart';
import 'widgets/play_pause_btn.dart';
@ -484,104 +485,27 @@ class _PLVideoPlayerState extends State<PLVideoPlayer>
/// 音量🔊 控制条展示
Obx(
() => Align(
child: AnimatedOpacity(
curve: Curves.easeInOut,
opacity: _volumeIndicator.value ? 1.0 : 0.0,
duration: const Duration(milliseconds: 150),
child: Container(
alignment: Alignment.center,
decoration: BoxDecoration(
color: const Color(0x88000000),
borderRadius: BorderRadius.circular(64.0),
),
height: 34.0,
width: 70.0,
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
height: 34.0,
width: 28.0,
alignment: Alignment.centerRight,
child: Icon(
_volumeValue.value == 0.0
? Icons.volume_off
: _volumeValue.value < 0.5
? Icons.volume_down
: 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),
),
),
),
const SizedBox(width: 6.0),
],
),
),
),
() => ControlBar(
visible: _volumeIndicator.value,
icon: _volumeValue.value < 1.0 / 3.0
? Icons.volume_mute
: _volumeValue.value < 2.0 / 3.0
? Icons.volume_down
: Icons.volume_up,
value: _volumeValue.value,
),
),
/// 亮度🌞 控制条展示
Obx(
() => Align(
child: AnimatedOpacity(
curve: Curves.easeInOut,
opacity: _brightnessIndicator.value ? 1.0 : 0.0,
duration: const Duration(milliseconds: 150),
child: Container(
alignment: Alignment.center,
decoration: BoxDecoration(
color: const Color(0x88000000),
borderRadius: BorderRadius.circular(64.0),
),
height: 34.0,
width: 70.0,
child: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
height: 30.0,
width: 28.0,
alignment: Alignment.centerRight,
child: Icon(
_brightnessValue.value < 1.0 / 3.0
? Icons.brightness_low
: _brightnessValue.value < 2.0 / 3.0
? Icons.brightness_medium
: 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: 6.0),
],
),
),
),
() => ControlBar(
visible: _brightnessIndicator.value,
icon: _brightnessValue.value < 1.0 / 3.0
? Icons.brightness_low
: _brightnessValue.value < 2.0 / 3.0
? Icons.brightness_medium
: Icons.brightness_high,
value: _brightnessValue.value,
),
),

View File

@ -0,0 +1,50 @@
import 'package:flutter/material.dart';
class ControlBar extends StatelessWidget {
final bool visible;
final IconData icon;
final double value;
const ControlBar({
Key? key,
required this.visible,
required this.icon,
required this.value,
}) : super(key: key);
@override
Widget build(BuildContext context) {
Color color = const Color(0xFFFFFFFF);
return Align(
child: AnimatedOpacity(
curve: Curves.easeInOut,
opacity: visible ? 1.0 : 0.0,
duration: const Duration(milliseconds: 150),
child: IntrinsicWidth(
child: Container(
padding: const EdgeInsets.fromLTRB(10, 2, 10, 2),
decoration: BoxDecoration(
color: const Color(0x88000000),
borderRadius: BorderRadius.circular(64.0),
),
height: 34.0,
child: Row(
children: <Widget>[
Icon(icon, color: color, size: 18.0),
const SizedBox(width: 4.0),
Container(
constraints: const BoxConstraints(minWidth: 30.0),
child: Text(
'${(value * 100.0).round()}%',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 13.0, color: color),
),
)
],
),
),
),
),
);
}
}