Album-Ansicht, mitlaufender Songtext, Cover-Cache, Server-Favoriten
Die letzten vier Punkte aus dem Review-Bericht.
G2 — Server-Bereich: Ein Tipp auf ein Album spielte sofort alles ab;
hineinsehen ging nicht. Jetzt Album- und Kuenstler-Ansicht mit Cover,
Kuenstler, Titelzahl, Gesamtdauer, "Abspielen"/"Zufaellig" und der
Titelliste; Antippen startet an dieser Stelle. Dazu "Mehr Alben laden" —
die Liste hoerte bei 50 auf, ohne dass etwas darauf hinwies.
NICHT umgesetzt: den Server-Bereich aus dem Download-Tab loesen (das
widerspricht Commit 34d6d8e, "Auf Wunsch von Dustin") und eine
Server-Suche (die Suche bleibt ausdruecklich rein lokal).
G8 — Songtext: Traegt der Text Zeitmarken, laeuft er mit; die aktive Zeile
ist hervorgehoben, Antippen springt an die Stelle. Ohne Zeitmarken bleibt
es eine Textwand — die App schaut nach, statt zu raten.
G10 — Cover bleiben liegen. Eigener Ordner, einmal geholt. Der Schluessel
haengt an der Album-Kennung, nicht an der Adresse: die traegt bei jedem
App-Start ein neues Token, und der Ordner waere sonst gewachsen, ohne je
einen Treffer zu liefern. Keine neue Abhaengigkeit.
G3 — Das Herz ist bei Server-Titeln nicht mehr ausgegraut, sondern
favorisiert am Server (star/unstar) — dort, wo der Favoriten-Abgleich sie
auch wieder abholt. Offen bleibt der schwere Teil: Wiedergabezaehler,
Historie und Kategorien braeuchten fuer Server-Titel eine Zeile in der
Bibliothek.
Aus dem Code-Review nachgebessert (sieben Punkte): das Herz behielt beim
Titelwechsel seinen Zustand; recycelte Listenzeilen zeigten kurz das Cover
der vorherigen; der neue Songtext bekam bei Server-Titeln die
Abspiel-Adresse statt der Server-Kennung und fand deshalb nie einen Text;
ein einmal fehlgeschlagenes Cover blieb die ganze Sitzung grau; "Server
nicht erreichbar" sah aus wie "Album hat keine Titel", womit der
Wiederholen-Knopf unerreichbar war; die Kuenstler-Ansicht waere immer leer
geblieben, weil getArtist die Titel gar nicht mitliefert; und zwei
gleichzeitige Cover-Abrufe konnten ein zerschnittenes Bild hinterlassen.
Selbst gefunden: das Haekchen "schon geladen" fragte pro Zeile die Platte
ab, bei jedem Positionswechsel neu. Jetzt einmal je Bildschirm.
457 Tests gruen (vorher 433), flutter analyze ohne Befund, Release-APK
gebaut.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_013xAHJTJM6UUqmjUgk1PUEd
This commit is contained in:
Hermes (Server)
co-authored by
Claude Opus 5
Claude Opus 5
parent
b42e045e67
commit
0d76d8cc58
@@ -150,6 +150,11 @@ class MeloAudioHandler extends BaseAudioHandler with QueueHandler, SeekHandler {
|
||||
/// eingetragen, eine gelöschte Datei ließe ihn mitten im Album abbrechen.
|
||||
final Set<String> _benutzteCacheDateien = {};
|
||||
final NavidromeService _nav = NavidromeService();
|
||||
|
||||
/// Die Server-Verbindung des Players — hier bereits mit geladenen
|
||||
/// Zugangsdaten. Die Oberfläche nutzt sie mit, statt eine zweite
|
||||
/// Verbindung aufzubauen, die davon nichts wüsste.
|
||||
NavidromeService get navidrome => _nav;
|
||||
int? _lastCountedIndex;
|
||||
|
||||
/// Wiedergabe automatisch starten, sobald Kopfhörer verbunden werden.
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
/// Eine Zeile eines mitlaufenden Songtexts.
|
||||
class LyricZeile {
|
||||
const LyricZeile({required this.zeit, required this.text});
|
||||
|
||||
final Duration zeit;
|
||||
final String text;
|
||||
}
|
||||
|
||||
/// Zeitmarke am Zeilenanfang: `[mm:ss]`, `[mm:ss.x]`, `[mm:ss.xx]` oder
|
||||
/// `[mm:ss.xxx]`. Mehrere Marken vor derselben Zeile sind erlaubt und im
|
||||
/// Refrain üblich.
|
||||
final _marke = RegExp(r'\[(\d{1,3}):(\d{1,2})(?:[.:](\d{1,3}))?\]');
|
||||
|
||||
/// Ob [text] ein LRC-Text ist — also überhaupt Zeitmarken trägt.
|
||||
///
|
||||
/// Der Songtext kann aus dem Tag der Datei oder vom Server kommen, und beides
|
||||
/// liefert mal die eine, mal die andere Form. Statt zu raten, wird geschaut.
|
||||
bool istSynchron(String text) => _marke.hasMatch(text);
|
||||
|
||||
/// Zerlegt einen LRC-Text in Zeilen mit Zeitmarke, nach Zeit sortiert.
|
||||
///
|
||||
/// Gibt eine leere Liste zurück, wenn keine Marken vorkommen — dann ist es
|
||||
/// eine gewöhnliche Textwand und wird auch so angezeigt.
|
||||
List<LyricZeile> parseLrc(String text) {
|
||||
final zeilen = <LyricZeile>[];
|
||||
for (final roh in text.split('\n')) {
|
||||
final marken = _marke.allMatches(roh).toList();
|
||||
if (marken.isEmpty) continue;
|
||||
// Alles hinter der letzten Marke ist der Text. Kopfzeilen wie `[ar:Neoni]`
|
||||
// passen nicht auf das Muster und fallen schon oben heraus.
|
||||
final inhalt = roh.substring(marken.last.end).trim();
|
||||
for (final marke in marken) {
|
||||
zeilen.add(LyricZeile(zeit: _zeitAus(marke), text: inhalt));
|
||||
}
|
||||
}
|
||||
zeilen.sort((a, b) => a.zeit.compareTo(b.zeit));
|
||||
return zeilen;
|
||||
}
|
||||
|
||||
Duration _zeitAus(RegExpMatch marke) {
|
||||
final minuten = int.parse(marke.group(1)!);
|
||||
final sekunden = int.parse(marke.group(2)!);
|
||||
final bruch = marke.group(3);
|
||||
// `.5` sind fünf Zehntel, `.05` fünf Hundertstel, `.050` fünfzig
|
||||
// Tausendstel — die Stellenzahl entscheidet, nicht der Wert.
|
||||
final millis = bruch == null
|
||||
? 0
|
||||
: (int.parse(bruch) * (bruch.length == 1 ? 100 : bruch.length == 2 ? 10 : 1));
|
||||
return Duration(minutes: minuten, seconds: sekunden, milliseconds: millis);
|
||||
}
|
||||
|
||||
/// Index der Zeile, die bei [position] gilt — die letzte, deren Marke bereits
|
||||
/// erreicht ist. Vor der ersten Marke gilt die erste Zeile, damit nie eine
|
||||
/// leere Anzeige entsteht.
|
||||
int? aktiveZeile(List<LyricZeile> zeilen, Duration position) {
|
||||
if (zeilen.isEmpty) return null;
|
||||
var index = 0;
|
||||
for (var i = 0; i < zeilen.length; i++) {
|
||||
if (zeilen[i].zeit > position) break;
|
||||
index = i;
|
||||
}
|
||||
return index;
|
||||
}
|
||||
@@ -6,8 +6,10 @@ import '../library/database.dart';
|
||||
import '../services/navidrome_service.dart';
|
||||
import '../shared/cover.dart';
|
||||
import '../shared/favorite_button.dart';
|
||||
import '../shared/server_favorite_button.dart';
|
||||
import '../shared/theme.dart';
|
||||
import 'audio_handler.dart';
|
||||
import 'lrc.dart';
|
||||
import 'queue_screen.dart';
|
||||
|
||||
/// Vollbild-Wiedergabe: Cover, Titel, Fortschritt, Transport-Controls.
|
||||
@@ -15,6 +17,7 @@ class NowPlayingScreen extends StatelessWidget {
|
||||
const NowPlayingScreen({super.key});
|
||||
|
||||
void _showLyrics(BuildContext context, String songId) {
|
||||
if (songId.isEmpty) return;
|
||||
showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (ctx) => _LyricsSheet(songId: songId),
|
||||
@@ -39,10 +42,16 @@ class NowPlayingScreen extends StatelessWidget {
|
||||
IconButton(
|
||||
tooltip: 'Songtext',
|
||||
icon: const Icon(Icons.lyrics),
|
||||
// Bei Server-Titeln die Navidrome-ID, nicht die
|
||||
// Abspiel-Adresse: mit der fragte die App den Server nach
|
||||
// einem Titel namens "https://…" und bekam nie einen Text.
|
||||
onPressed: () => _showLyrics(
|
||||
context, item.extras?['songId'] as String? ?? item.id),
|
||||
context, songIdOf(item) ?? navidromeIdOf(item) ?? ''),
|
||||
),
|
||||
FavoriteButton(songId: item.extras?['songId'] as String? ?? ''),
|
||||
// Ein Titel der Bibliothek wird lokal favorisiert, einer
|
||||
// vom Server am Server — beide bekommen dasselbe Herz,
|
||||
// statt dass eines davon ausgegraut bleibt.
|
||||
_Herz(item: item),
|
||||
],
|
||||
);
|
||||
},
|
||||
@@ -98,6 +107,30 @@ class NowPlayingScreen extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// Das passende Herz für den laufenden Titel.
|
||||
class _Herz extends StatelessWidget {
|
||||
const _Herz({required this.item});
|
||||
final MediaItem item;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final songId = songIdOf(item);
|
||||
if (songId != null && songId.isNotEmpty) {
|
||||
return FavoriteButton(songId: songId);
|
||||
}
|
||||
final navId = navidromeIdOf(item);
|
||||
if (navId == null) return const SizedBox.shrink();
|
||||
return ServerFavoriteButton(
|
||||
// Ohne Schlüssel behielte das Herz beim Titelwechsel seinen Zustand:
|
||||
// Flutter würde dasselbe Element weiterverwenden, und der nächste Titel
|
||||
// erschiene als Favorit, obwohl er nie einer war.
|
||||
key: ValueKey(navId),
|
||||
navidromeId: navId,
|
||||
navidrome: context.read<MeloAudioHandler>().navidrome,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Cover extends StatelessWidget {
|
||||
const _Cover({required this.item});
|
||||
final MediaItem item;
|
||||
@@ -317,7 +350,10 @@ class _LyricsSheet extends StatefulWidget {
|
||||
class _LyricsSheetState extends State<_LyricsSheet> {
|
||||
late final NavidromeService _nav = NavidromeService();
|
||||
String? _text;
|
||||
List<LyricZeile> _zeilen = const [];
|
||||
bool _loading = true;
|
||||
final _scroll = ScrollController();
|
||||
int? _gezeigteZeile;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
@@ -325,29 +361,57 @@ class _LyricsSheetState extends State<_LyricsSheet> {
|
||||
_load();
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_scroll.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
/// Zuerst der Songtext aus dem Tag der Datei — der ist sofort da und
|
||||
/// funktioniert offline. Nur wenn keiner drinsteht, wird der Server gefragt.
|
||||
Future<void> _load() async {
|
||||
final db = context.read<MeloDb>();
|
||||
final lokal = await db.lyricsOf(widget.songId);
|
||||
if (lokal != null) {
|
||||
if (mounted) setState(() { _text = lokal; _loading = false; });
|
||||
if (mounted) setState(() => _uebernimm(lokal));
|
||||
return;
|
||||
}
|
||||
await _nav.ladeGespeicherteZugangsdaten();
|
||||
if (_nav.istVerbunden) {
|
||||
final lyrics = await _nav.getLyrics(widget.songId);
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_text = lyrics.isEmpty ? null : lyrics.text;
|
||||
_loading = false;
|
||||
});
|
||||
setState(() => _uebernimm(lyrics.isEmpty ? null : lyrics.text));
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (mounted) setState(() => _loading = false);
|
||||
}
|
||||
|
||||
void _uebernimm(String? text) {
|
||||
_text = text;
|
||||
// Trägt der Text Zeitmarken, läuft er mit; sonst bleibt es eine
|
||||
// Textwand — beides kommt vor, je nach Tag und Server.
|
||||
_zeilen = text == null ? const [] : parseLrc(text);
|
||||
_loading = false;
|
||||
}
|
||||
|
||||
/// Schiebt die aktive Zeile in die Mitte. Nur beim Zeilenwechsel, nicht bei
|
||||
/// jeder Positionsmeldung — sonst ruckelt die Ansicht permanent.
|
||||
void _folge(int index) {
|
||||
if (_gezeigteZeile == index || !_scroll.hasClients) return;
|
||||
_gezeigteZeile = index;
|
||||
final ziel = (index * _zeilenHoehe) -
|
||||
(_scroll.position.viewportDimension / 2) +
|
||||
(_zeilenHoehe / 2);
|
||||
_scroll.animateTo(
|
||||
ziel.clamp(0, _scroll.position.maxScrollExtent),
|
||||
duration: MeloMotion.normal,
|
||||
curve: MeloMotion.curve,
|
||||
);
|
||||
}
|
||||
|
||||
static const _zeilenHoehe = 40.0;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
@@ -355,12 +419,15 @@ class _LyricsSheetState extends State<_LyricsSheet> {
|
||||
child: Column(
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(MeloSpace.md),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
const Text('📝 Songtext',
|
||||
style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
|
||||
Text(
|
||||
_zeilen.isEmpty ? 'Songtext' : 'Songtext · läuft mit',
|
||||
style: const TextStyle(
|
||||
fontSize: 18, fontWeight: FontWeight.w600),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.close),
|
||||
onPressed: () => Navigator.pop(context),
|
||||
@@ -368,30 +435,95 @@ class _LyricsSheetState extends State<_LyricsSheet> {
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: _loading
|
||||
? const Center(
|
||||
child: CircularProgressIndicator(color: MeloTheme.red),
|
||||
)
|
||||
: _text == null
|
||||
? const Center(
|
||||
child: Text('Kein Songtext verfügbar',
|
||||
style: TextStyle(color: MeloTheme.text2)),
|
||||
)
|
||||
: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Text(
|
||||
_text!,
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
height: 1.6,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(child: _inhalt()),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _inhalt() {
|
||||
if (_loading) {
|
||||
return const Center(
|
||||
child: CircularProgressIndicator(color: MeloTheme.red),
|
||||
);
|
||||
}
|
||||
final text = _text;
|
||||
if (text == null) {
|
||||
return const Center(
|
||||
child: Text('Kein Songtext verfügbar',
|
||||
style: TextStyle(color: MeloTheme.text2)),
|
||||
);
|
||||
}
|
||||
if (_zeilen.isEmpty) {
|
||||
return SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(MeloSpace.md),
|
||||
child: Text(
|
||||
text,
|
||||
style: const TextStyle(fontSize: 14, height: 1.6, color: Colors.white),
|
||||
),
|
||||
);
|
||||
}
|
||||
return _Mitlaufend(
|
||||
zeilen: _zeilen,
|
||||
scroll: _scroll,
|
||||
zeilenHoehe: _zeilenHoehe,
|
||||
onZeile: _folge,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Die mitlaufende Darstellung: aktive Zeile hell und hervorgehoben, der
|
||||
/// Rest gedämpft. Antippen springt an die Stelle im Titel.
|
||||
class _Mitlaufend extends StatelessWidget {
|
||||
const _Mitlaufend({
|
||||
required this.zeilen,
|
||||
required this.scroll,
|
||||
required this.zeilenHoehe,
|
||||
required this.onZeile,
|
||||
});
|
||||
|
||||
final List<LyricZeile> zeilen;
|
||||
final ScrollController scroll;
|
||||
final double zeilenHoehe;
|
||||
final ValueChanged<int> onZeile;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final handler = context.read<MeloAudioHandler>();
|
||||
return StreamBuilder<Duration>(
|
||||
stream: handler.positionStream,
|
||||
builder: (context, snapshot) {
|
||||
final aktiv = aktiveZeile(zeilen, snapshot.data ?? Duration.zero);
|
||||
if (aktiv != null) {
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) => onZeile(aktiv));
|
||||
}
|
||||
return ListView.builder(
|
||||
controller: scroll,
|
||||
itemExtent: zeilenHoehe,
|
||||
padding: const EdgeInsets.symmetric(horizontal: MeloSpace.md),
|
||||
itemCount: zeilen.length,
|
||||
itemBuilder: (context, i) {
|
||||
final istAktiv = i == aktiv;
|
||||
return InkWell(
|
||||
onTap: () => handler.seek(zeilen[i].zeit),
|
||||
child: Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: AnimatedDefaultTextStyle(
|
||||
duration: MeloMotion.fast,
|
||||
style: TextStyle(
|
||||
fontSize: istAktiv ? 17 : 15,
|
||||
height: 1.3,
|
||||
fontWeight: istAktiv ? FontWeight.w700 : FontWeight.w400,
|
||||
color: istAktiv ? Colors.white : MeloTheme.text3,
|
||||
),
|
||||
child: Text(zeilen[i].text,
|
||||
maxLines: 1, overflow: TextOverflow.ellipsis),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user