mirror of
https://github.com/zarzet/SpotiFLAC-Mobile.git
synced 2026-09-30 21:29:36 +02:00
feat(lyrics): add countdown dots for instrumental breaks
This commit is contained in:
1 parent
801ab13938
commit
b40ba27cd6
7 files changed
+354
-13
No files matched your search
@@ -0,0 +1,60 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:spotiflac_android/l10n/l10n.dart';
|
||||
import 'package:spotiflac_android/providers/music_player_provider.dart';
|
||||
import 'package:spotiflac_android/utils/synced_lyrics_scroll.dart';
|
||||
|
||||
/// A playback-driven countdown, rather than a repeating loading animation.
|
||||
class LyricGapIndicator extends ConsumerWidget {
|
||||
const LyricGapIndicator({
|
||||
super.key,
|
||||
required this.start,
|
||||
required this.end,
|
||||
required this.color,
|
||||
});
|
||||
|
||||
final Duration start;
|
||||
final Duration end;
|
||||
final Color color;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final progress = syncedLyricSegmentProgress(
|
||||
position: ref.watch(playbackPositionProvider),
|
||||
start: start,
|
||||
end: end,
|
||||
);
|
||||
final animate =
|
||||
ref.watch(playbackPlayingProvider) &&
|
||||
!ref.watch(playbackLoadingProvider) &&
|
||||
!MediaQuery.disableAnimationsOf(context);
|
||||
return Semantics(
|
||||
label: context.l10n.nowPlayingInstrumental,
|
||||
value: '${(progress * 100).round()}%',
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
for (var index = 0; index < 3; index++) ...[
|
||||
if (index > 0) const SizedBox(width: 8),
|
||||
AnimatedContainer(
|
||||
key: ValueKey('lyric-gap-dot-$index'),
|
||||
duration: animate
|
||||
? const Duration(milliseconds: 120)
|
||||
: Duration.zero,
|
||||
width: 10,
|
||||
height: 10,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Color.lerp(
|
||||
color.withValues(alpha: 0.25),
|
||||
color,
|
||||
(progress * 3 - index).clamp(0.0, 1.0),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user