style(ui): unify header meta rows on the dot-separated album style

Track metadata, playlist, and library folder headers dropped their pill
badges for the same HeaderMetaRow/HeaderMetaItem used by the album
screen.
This commit is contained in:
zarzet
2026-07-14 09:09:56 +07:00
parent 93b173cff8
commit 306c34a32a
4 changed files with 28 additions and 157 deletions
+7 -21
View File
@@ -527,27 +527,13 @@ class _LibraryTracksFolderScreenState
return squarePlaceholder();
},
meta: entries.isNotEmpty
? Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(_modeIcon(), size: 14, color: Colors.white),
const SizedBox(width: 4),
Text(
context.l10n.tracksCount(entries.length),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
],
),
? HeaderMetaRow(
items: [
HeaderMetaItem(
context.l10n.tracksCount(entries.length),
icon: _modeIcon(),
),
],
)
: null,
actions: entries.isNotEmpty
+7 -21
View File
@@ -235,27 +235,13 @@ class _PlaylistScreenState extends ConsumerState<PlaylistScreen>
errorWidget: (_, _, _) => playlistPlaceholder(size: 48),
)
: playlistPlaceholder(size: 48),
meta: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.playlist_play, size: 14, color: Colors.white),
const SizedBox(width: 4),
Text(
context.l10n.tracksCount(_tracks.length),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
],
),
meta: HeaderMetaRow(
items: [
HeaderMetaItem(
context.l10n.tracksCount(_tracks.length),
icon: Icons.playlist_play,
),
],
),
actions: Row(
mainAxisAlignment: MainAxisAlignment.center,
+12 -115
View File
@@ -219,128 +219,25 @@ extension _TrackMetadataCards on _TrackMetadataScreenState {
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 12),
Wrap(
alignment: WrapAlignment.center,
spacing: 8,
runSpacing: 8,
children: [
HeaderMetaRow(
items: [
if (_displayAudioQuality != null &&
_displayAudioQuality!.isNotEmpty)
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Text(
_displayAudioQuality!,
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
),
if (duration != null)
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Text(
formatClock(duration!),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
),
HeaderMetaItem(_displayAudioQuality!),
if (duration != null) HeaderMetaItem(formatClock(duration!)),
if (_service != 'local')
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Text(
_service[0].toUpperCase() + _service.substring(1),
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
HeaderMetaItem(
_service[0].toUpperCase() + _service.substring(1),
)
else
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: Colors.white.withValues(alpha: 0.2),
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.folder,
size: 14,
color: Colors.white,
),
const SizedBox(width: 4),
Text(
context.l10n.librarySourceLocal,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
],
),
HeaderMetaItem(
context.l10n.librarySourceLocal,
icon: Icons.folder,
),
if (_hasCheckedFile && !_fileExists)
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 6,
),
decoration: BoxDecoration(
color: Colors.red.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.warning_rounded,
size: 14,
color: Colors.white,
),
const SizedBox(width: 4),
Text(
context.l10n.trackFileNotFound,
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 12,
),
),
],
),
HeaderMetaItem(
context.l10n.trackFileNotFound,
icon: Icons.warning_rounded,
),
],
),
+2
View File
@@ -29,6 +29,8 @@ import 'package:spotiflac_android/utils/image_cache_utils.dart';
import 'package:spotiflac_android/utils/string_utils.dart';
import 'package:spotiflac_android/utils/int_utils.dart';
import 'package:spotiflac_android/utils/nav_bar_inset.dart';
import 'package:spotiflac_android/widgets/album_detail_header.dart'
show HeaderMetaRow, HeaderMetaItem;
import 'package:spotiflac_android/widgets/audio_analysis_widget.dart';
import 'package:spotiflac_android/widgets/batch_convert_sheet.dart';
import 'package:spotiflac_android/widgets/cached_cover_image.dart';