This commit is contained in:
rang 2025-10-17 17:43:14 +08:00
parent 07aea41c6e
commit 4304af26dc
4 changed files with 433 additions and 438 deletions

View file

@ -31,8 +31,7 @@ class AudiobookPlayer extends HookConsumerWidget {
if (currentBook == null) {
return const SizedBox.shrink();
}
final itemBeingPlayed =
ref.watch(libraryItemProvider(currentBook.libraryItemId));
final itemBeingPlayed = ref.watch(libraryItemProvider(currentBook.libraryItemId));
final player = ref.watch(audiobookPlayerProvider);
final imageOfItemBeingPlayed = itemBeingPlayed.valueOrNull != null
? ref.watch(
@ -65,8 +64,7 @@ class AudiobookPlayer extends HookConsumerWidget {
themeOfLibraryItemProvider(
itemBeingPlayed.valueOrNull?.id,
brightness: Theme.of(context).brightness,
highContrast: appSettings.themeSettings.highContrast ||
MediaQuery.of(context).highContrast,
highContrast: appSettings.themeSettings.highContrast || MediaQuery.of(context).highContrast,
),
);
@ -88,14 +86,14 @@ class AudiobookPlayer extends HookConsumerWidget {
onDragDown: (percentage) async {
// preferred volume
// set volume to 0 when dragging down
await player
.setVolume(preferredVolume * (1 - percentage.clamp(0, .75)));
await player.setVolume(preferredVolume * (1 - percentage.clamp(0, .75)));
},
minHeight: playerMinHeight,
// subtract the height of notches and other system UI
maxHeight: playerMaxHeight,
controller: audioBookMiniplayerController,
elevation: 4,
duration: Duration(seconds: 3),
onDismissed: () {
// add a delay before closing the player
// to allow the user to see the player closing
@ -103,15 +101,13 @@ class AudiobookPlayer extends HookConsumerWidget {
player.setSourceAudiobook(null);
});
},
curve: Curves.easeOut,
curve: Curves.linear,
builder: (height, percentage) {
// at what point should the player switch from miniplayer to expanded player
// also at this point the image should be at its max size and in the center of the player
final miniplayerPercentageDeclaration =
(maxImgSize - playerMinHeight) /
(playerMaxHeight - playerMinHeight);
final bool isFormMiniplayer =
percentage < miniplayerPercentageDeclaration;
(maxImgSize - playerMinHeight) / (playerMaxHeight - playerMinHeight);
final bool isFormMiniplayer = percentage < miniplayerPercentageDeclaration;
if (!isFormMiniplayer) {
// this calculation needs a refactor
@ -211,17 +207,14 @@ class AudiobookChapterProgressBar extends HookConsumerWidget {
// now find the chapter that corresponds to the current time
// and calculate the progress of the current chapter
final currentChapterProgress = currentChapter == null
? null
: (player.positionInBook - currentChapter.start);
final currentChapterProgress =
currentChapter == null ? null : (player.positionInBook - currentChapter.start);
final currentChapterBuffered = currentChapter == null
? null
: (player.bufferedPositionInBook - currentChapter.start);
final currentChapterBuffered =
currentChapter == null ? null : (player.bufferedPositionInBook - currentChapter.start);
return ProgressBar(
progress:
currentChapterProgress ?? position.data ?? const Duration(seconds: 0),
progress: currentChapterProgress ?? position.data ?? const Duration(seconds: 0),
total: currentChapter == null
? player.book?.duration ?? const Duration(seconds: 0)
: currentChapter.end - currentChapter.start,
@ -232,8 +225,7 @@ class AudiobookChapterProgressBar extends HookConsumerWidget {
);
},
thumbRadius: 8,
buffered:
currentChapterBuffered ?? buffered.data ?? const Duration(seconds: 0),
buffered: currentChapterBuffered ?? buffered.data ?? const Duration(seconds: 0),
bufferedBarColor: Theme.of(context).colorScheme.secondary,
timeLabelType: TimeLabelType.remainingTime,
timeLabelLocation: TimeLabelLocation.below,

View file

@ -43,9 +43,9 @@ class PlayerWhenExpanded extends HookConsumerWidget {
earlyEnd,
)
.clamp(0.0, 1.0);
final currentChapter = ref.watch(currentPlayingChapterProvider);
final currentBookMetadata = ref.watch(currentBookMetadataProvider);
return Column(
children: [
// sized box for system status bar; not needed as not full screen
@ -104,10 +104,7 @@ class PlayerWhenExpanded extends HookConsumerWidget {
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: Theme.of(context)
.colorScheme
.primary
.withValues(alpha: 0.1),
color: Theme.of(context).colorScheme.primary.withValues(alpha: 0.1),
blurRadius: 32 * earlyPercentage,
spreadRadius: 8 * earlyPercentage,
// offset: Offset(0, 16 * earlyPercentage),
@ -131,128 +128,130 @@ class PlayerWhenExpanded extends HookConsumerWidget {
),
// the chapter title
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
top: AppElementSizes.paddingRegular * 4 * earlyPercentage,
// horizontal: 16.0,
),
// child: SizedBox(
// same as the image width
// width: imageSize,
child: currentChapter == null
? const SizedBox()
: Text(
currentChapter.title,
style: Theme.of(context).textTheme.titleLarge,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
// ),
),
),
// the book name and author
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
bottom: AppElementSizes.paddingRegular * earlyPercentage,
// horizontal: 16.0,
),
// child: SizedBox(
// same as the image width
// width: imageSize,
child: Text(
[
currentBookMetadata?.title ?? '',
currentBookMetadata?.authorName ?? '',
].join(' - '),
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context)
.colorScheme
.onSurface
.withValues(alpha: 0.7),
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
// ),
),
),
const Spacer(),
// the progress bar
Opacity(
opacity: earlyPercentage,
child: SizedBox(
width: imageSize,
if (earlyPercentage > 0.4)
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
top: AppElementSizes.paddingRegular * earlyPercentage,
left: AppElementSizes.paddingRegular * earlyPercentage,
right: AppElementSizes.paddingRegular * earlyPercentage,
top: AppElementSizes.paddingRegular * 4 * earlyPercentage,
// horizontal: 16.0,
),
child: const AudiobookChapterProgressBar(),
// child: SizedBox(
// same as the image width
// width: imageSize,
child: currentChapter == null
? const SizedBox()
: Text(
currentChapter.title,
style: Theme.of(context).textTheme.titleLarge,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
// ),
),
),
),
const Spacer(),
// the book name and author
if (earlyPercentage > 0.5)
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
bottom: AppElementSizes.paddingRegular * earlyPercentage,
// horizontal: 16.0,
),
// child: SizedBox(
// same as the image width
// width: imageSize,
child: Text(
[
currentBookMetadata?.title ?? '',
currentBookMetadata?.authorName ?? '',
].join(' - '),
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.7),
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
// ),
),
),
if (earlyPercentage > 0.5) const Spacer(),
// the progress bar
if (earlyPercentage > 0.6)
Opacity(
opacity: earlyPercentage,
child: SizedBox(
width: imageSize,
child: Padding(
padding: EdgeInsets.only(
top: AppElementSizes.paddingRegular * earlyPercentage,
left: AppElementSizes.paddingRegular * earlyPercentage,
right: AppElementSizes.paddingRegular * earlyPercentage,
),
child: const AudiobookChapterProgressBar(),
),
),
),
if (earlyPercentage > 0.6) const Spacer(),
// the chapter skip buttons, seek 30 seconds back and forward, and play/pause button
Opacity(
opacity: earlyPercentage,
child: SizedBox(
width: imageSize,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// previous chapter
const AudiobookPlayerSeekChapterButton(isForward: false),
// buttonSkipBackwards
const AudiobookPlayerSeekButton(isForward: false),
AudiobookPlayerPlayPauseButton(
playPauseController: playPauseController,
),
// buttonSkipForwards
const AudiobookPlayerSeekButton(isForward: true),
// next chapter
const AudiobookPlayerSeekChapterButton(isForward: true),
],
if (earlyPercentage > 0.8)
Opacity(
opacity: earlyPercentage,
child: SizedBox(
width: imageSize,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// previous chapter
const AudiobookPlayerSeekChapterButton(isForward: false),
// buttonSkipBackwards
const AudiobookPlayerSeekButton(isForward: false),
AudiobookPlayerPlayPauseButton(
playPauseController: playPauseController,
),
// buttonSkipForwards
const AudiobookPlayerSeekButton(isForward: true),
// next chapter
const AudiobookPlayerSeekChapterButton(isForward: true),
],
),
),
),
),
const Spacer(),
if (earlyPercentage > 0.8) const Spacer(),
// speed control, sleep timer, chapter list, and settings
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
bottom: AppElementSizes.paddingRegular * 4 * earlyPercentage,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
// speed control
const PlayerSpeedAdjustButton(),
// sleep timer
const SleepTimerButton(),
// chapter list
const ChapterSelectionButton(),
// settings
// IconButton(
// icon: const Icon(Icons.more_horiz),
// onPressed: () {
// // show toast
// showNotImplementedToast(context);
// },
// ),
],
if (earlyPercentage > 0.9)
Opacity(
opacity: earlyPercentage,
child: Padding(
padding: EdgeInsets.only(
bottom: AppElementSizes.paddingRegular * 4 * earlyPercentage,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
// speed control
const PlayerSpeedAdjustButton(),
// sleep timer
const SleepTimerButton(),
// chapter list
const ChapterSelectionButton(),
// settings
// IconButton(
// icon: const Icon(Icons.more_horiz),
// onPressed: () {
// // show toast
// showNotImplementedToast(context);
// },
// ),
],
),
),
),
),
],
);
}

View file

@ -32,8 +32,7 @@ class PlayerWhenMinimized extends HookConsumerWidget {
Widget build(BuildContext context, WidgetRef ref) {
final player = ref.watch(audiobookPlayerProvider);
final vanishingPercentage = 1 - percentageMiniplayer;
final progress =
useStream(player.slowPositionStream, initialData: Duration.zero);
final progress = useStream(player.slowPositionStream, initialData: Duration.zero);
final bookMetaExpanded = ref.watch(currentBookMetadataProvider);
@ -46,8 +45,7 @@ class PlayerWhenMinimized extends HookConsumerWidget {
// image
Padding(
padding: EdgeInsets.symmetric(
horizontal:
((availWidth - maxImgSize) / 2) * percentageMiniplayer,
horizontal: ((availWidth - maxImgSize) / 2) * percentageMiniplayer,
),
child: InkWell(
onTap: () {
@ -55,8 +53,7 @@ class PlayerWhenMinimized extends HookConsumerWidget {
context.pushNamed(
Routes.libraryItem.name,
pathParameters: {
Routes.libraryItem.pathParamName!:
player.book!.libraryItemId,
Routes.libraryItem.pathParamName!: player.book!.libraryItemId,
},
);
},
@ -90,10 +87,7 @@ class PlayerWhenMinimized extends HookConsumerWidget {
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
color: Theme.of(context)
.colorScheme
.onSurface
.withValues(alpha: 0.7),
color: Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.7),
),
),
],
@ -106,37 +100,39 @@ class PlayerWhenMinimized extends HookConsumerWidget {
// controller.animateToHeight(state: PanelState.MAX);
// },
// ),
// rewind button
Opacity(
opacity: vanishingPercentage,
child: Padding(
padding: const EdgeInsets.only(left: 8),
child: IconButton(
icon: const Icon(
Icons.replay_30,
size: AppElementSizes.iconSizeSmall,
if (vanishingPercentage > 0.6)
Opacity(
opacity: vanishingPercentage,
child: Padding(
padding: const EdgeInsets.only(left: 8),
child: IconButton(
icon: const Icon(
Icons.replay_30,
size: AppElementSizes.iconSizeSmall,
),
onPressed: () {},
),
onPressed: () {},
),
),
),
// play/pause button
Opacity(
opacity: vanishingPercentage,
child: Padding(
padding: const EdgeInsets.only(right: 8),
child: AudiobookPlayerPlayPauseButton(
playPauseController: playPauseController,
if (vanishingPercentage > 0.8)
Opacity(
opacity: vanishingPercentage,
child: Padding(
padding: const EdgeInsets.only(right: 8),
child: AudiobookPlayerPlayPauseButton(
playPauseController: playPauseController,
),
),
),
),
],
),
SizedBox(
height: barHeight,
child: LinearProgressIndicator(
value: (progress.data ?? Duration.zero).inSeconds /
player.book!.duration.inSeconds,
value: (progress.data ?? Duration.zero).inSeconds / player.book!.duration.inSeconds,
color: Theme.of(context).colorScheme.onPrimaryContainer,
backgroundColor: Theme.of(context).colorScheme.primaryContainer,
),