feat: more android UI fixes (#1028)

ubuntu-flutter-community · Nov 17, 2024 · 515eb57 · 515eb57
1 parent 0708612
commit 515eb57
Show file tree

Hide file tree

Showing 11 changed files with 184 additions and 147 deletions.
diff --git a/lib/common/view/audio_tile.dart b/lib/common/view/audio_tile.dart
@@ -102,7 +102,9 @@ class _AudioTileState extends State<AudioTile> {
             ? selectedColor
             : theme.colorScheme.onSurface,
         selectedTileColor: theme.colorScheme.onSurface.withOpacity(0.05),
-        contentPadding: audioTilePadding,
+        contentPadding: audioTilePadding.copyWith(
+          left: widget.audioPageType == AudioPageType.album ? 10 : null,
+        ),
         onTap: () {
           if (widget.selected) {
             if (widget.isPlayerPlaying) {
@@ -191,30 +193,32 @@ class _AudioTileTrail extends StatelessWidget with WatchItMixin {
             selected: selected && isPlayerPlaying,
             playlistId: pageId,
             audio: audio,
-            allowRemove: audioPageType == AudioPageType.playlist,
+            allowRemove: audioPageType == AudioPageType.playlist ||
+                audioPageType == AudioPageType.likedAudio,
             insertIntoQueue:
                 insertIntoQueue != null ? () => insertIntoQueue!(audio) : null,
           ),
         ),
         const SizedBox(
           width: 5,
         ),
-        Opacity(
-          opacity: hovered || selected || liked ? 1 : 0,
-          child: switch (audio.audioType) {
-            AudioType.radio => RadioLikeIcon(
-                audio: audio,
-                color: selected && isPlayerPlaying ? selectedColor : null,
-              ),
-            AudioType.local => LikeIcon(
-                audio: audio,
-                color: selected && isPlayerPlaying ? selectedColor : null,
-              ),
-            _ => SizedBox.square(
-                dimension: context.theme.buttonTheme.height,
-              ),
-          },
-        ),
+        if (!isMobile)
+          Opacity(
+            opacity: hovered || selected || liked ? 1 : 0,
+            child: switch (audio.audioType) {
+              AudioType.radio => RadioLikeIcon(
+                  audio: audio,
+                  color: selected && isPlayerPlaying ? selectedColor : null,
+                ),
+              AudioType.local => LikeIcon(
+                  audio: audio,
+                  color: selected && isPlayerPlaying ? selectedColor : null,
+                ),
+              _ => SizedBox.square(
+                  dimension: context.theme.buttonTheme.height,
+                ),
+            },
+          ),
         if (!isMobile &&
             audio.audioType != AudioType.radio &&
             audio.durationMs != null)

diff --git a/lib/common/view/audio_tile_option_button.dart b/lib/common/view/audio_tile_option_button.dart
@@ -3,6 +3,7 @@ import 'package:watch_it/watch_it.dart';
 import 'package:yaru/yaru.dart';
 
 import '../../app_config.dart';
+import '../../constants.dart';
 import '../../extensions/build_context_x.dart';
 import '../../l10n/l10n.dart';
 import '../../library/library_model.dart';
@@ -32,10 +33,11 @@ class AudioTileOptionButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final theme = context.theme;
+    final l10n = context.l10n;
     final libraryModel = di<LibraryModel>();
 
     return PopupMenuButton(
-      tooltip: context.l10n.moreOptions,
+      tooltip: l10n.moreOptions,
       padding: EdgeInsets.zero,
       itemBuilder: (context) {
         return [
@@ -46,23 +48,26 @@ class AudioTileOptionButton extends StatelessWidget {
                 showSnackBar(
                   context: context,
                   content: Text(
-                    '${context.l10n.addedTo} ${context.l10n.queue}: ${audio.artist} - ${audio.title}',
+                    '${l10n.addedTo} ${l10n.queue}: ${audio.artist} - ${audio.title}',
                   ),
                 );
               },
               child: YaruTile(
                 leading: Icon(Iconz.insertIntoQueue),
-                title: Text(context.l10n.playNext),
+                title: Text(l10n.playNext),
               ),
             ),
           if (audio.audioType != AudioType.radio)
             if (allowRemove)
               PopupMenuItem(
-                onTap: () =>
-                    libraryModel.removeAudioFromPlaylist(playlistId, audio),
+                onTap: () => playlistId == kLikedAudiosPageId
+                    ? libraryModel.removeLikedAudio(audio)
+                    : libraryModel.removeAudioFromPlaylist(playlistId, audio),
                 child: YaruTile(
                   leading: Icon(Iconz.remove),
-                  title: Text('${context.l10n.removeFrom} $playlistId'),
+                  title: Text(
+                    '${l10n.removeFrom} ${playlistId == kLikedAudiosPageId ? l10n.likedSongs : playlistId}',
+                  ),
                 ),
               ),
           if (audio.audioType != AudioType.radio)
@@ -79,7 +84,7 @@ class AudioTileOptionButton extends StatelessWidget {
               child: YaruTile(
                 leading: Icon(Iconz.plus),
                 title: Text(
-                  '${context.l10n.addToPlaylist} ...',
+                  '${l10n.addToPlaylist} ...',
                 ),
               ),
             ),
@@ -93,7 +98,7 @@ class AudioTileOptionButton extends StatelessWidget {
             child: YaruTile(
               leading: Icon(Iconz.info),
               title: Text(
-                '${context.l10n.showMetaData} ...',
+                '${l10n.showMetaData} ...',
               ),
             ),
           ),
@@ -130,55 +135,55 @@ class MetaDataDialog extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final radio = audio.audioType == AudioType.radio;
-
+    final l10n = context.l10n;
     final items = <(String, String)>{
       (
-        radio ? context.l10n.stationName : context.l10n.title,
+        radio ? l10n.stationName : l10n.title,
         '${audio.title}',
       ),
       (
-        radio ? context.l10n.tags : context.l10n.album,
+        radio ? l10n.tags : l10n.album,
         '${radio ? audio.album?.replaceAll(',', ', ') : audio.album}',
       ),
       (
-        radio ? context.l10n.language : context.l10n.artist,
+        radio ? l10n.language : l10n.artist,
         '${radio ? audio.language : audio.artist}',
       ),
       (
-        radio ? context.l10n.quality : context.l10n.albumArtists,
+        radio ? l10n.quality : l10n.albumArtists,
         '${audio.albumArtist}',
       ),
       if (!radio)
         (
-          context.l10n.trackNumber,
+          l10n.trackNumber,
           '${audio.trackNumber}',
         ),
       if (!radio)
         (
-          context.l10n.diskNumber,
+          l10n.diskNumber,
           '${audio.discNumber}',
         ),
       (
-        radio ? context.l10n.clicks : context.l10n.totalDisks,
+        radio ? l10n.clicks : l10n.totalDisks,
         '${radio ? audio.clicks : audio.discTotal}',
       ),
       if (!radio)
         (
-          context.l10n.genre,
+          l10n.genre,
           '${audio.genre}',
         ),
       (
-        context.l10n.url,
+        l10n.url,
         (audio.url ?? ''),
       ),
     };
 
     return AlertDialog(
       title: yaruStyled
           ? YaruDialogTitleBar(
-              title: Text(context.l10n.metadata),
+              title: Text(l10n.metadata),
             )
-          : Center(child: Text(context.l10n.metadata)),
+          : Center(child: Text(l10n.metadata)),
       titlePadding:
           yaruStyled ? EdgeInsets.zero : const EdgeInsets.only(top: 10),
       contentPadding: const EdgeInsets.only(bottom: 12),

diff --git a/lib/common/view/icons.dart b/lib/common/view/icons.dart
@@ -25,7 +25,7 @@ class Iconz {
             : Icons.menu_rounded;
   }
 
-  static IconData get materialSidebar => Icons.view_sidebar_rounded;
+  static IconData get materialSidebar => Icons.menu_rounded;
 
   static IconData get sidebar {
     return yaruStyled

diff --git a/lib/common/view/sliver_audio_page.dart b/lib/common/view/sliver_audio_page.dart
@@ -82,64 +82,67 @@ class SliverAudioPage extends StatelessWidget {
       ),
       body: LayoutBuilder(
         builder: (context, constraints) {
-          return audios == null
-              ? const Center(
-                  child: Progress(),
+          final padding = getAdaptiveHorizontalPadding(
+            constraints: constraints,
+            min: isMobile ? 5 : 15,
+          );
+
+          if (audios == null) {
+            return const Center(
+              child: Progress(),
+            );
+          }
+
+          if (audios!.isEmpty) {
+            return NoSearchResultPage(
+              message: noSearchResultMessage,
+              icon: noSearchResultIcons,
+            );
+          }
+
+          return CustomScrollView(
+            slivers: [
+              SliverPadding(
+                padding: padding,
+                sliver: SliverToBoxAdapter(
+                  child: AudioPageHeader(
+                    title: pageTitle ?? pageId,
+                    image: image,
+                    subTitle: pageSubTitle,
+                    label: pageLabel,
+                    onLabelTab: audioPageType == AudioPageType.likedAudio
+                        ? null
+                        : onPageLabelTab,
+                    onSubTitleTab: onPageSubTitleTab,
+                    description: description,
+                  ),
+                ),
+              ),
+              SliverAudioPageControlPanel(
+                controlPanel: controlPanel ??
+                    AvatarPlayButton(
+                      audios: audios ?? [],
+                      pageId: pageId,
+                    ),
+              ),
+              if (audios == null)
+                const SliverToBoxAdapter(
+                  child: Center(
+                    child: Progress(),
+                  ),
                 )
-              : audios!.isEmpty
-                  ? NoSearchResultPage(
-                      message: noSearchResultMessage,
-                      icon: noSearchResultIcons,
-                    )
-                  : CustomScrollView(
-                      slivers: [
-                        SliverPadding(
-                          padding: getAdaptiveHorizontalPadding(
-                            constraints: constraints,
-                            min: 40,
-                          ),
-                          sliver: SliverToBoxAdapter(
-                            child: AudioPageHeader(
-                              title: pageTitle ?? pageId,
-                              image: image,
-                              subTitle: pageSubTitle,
-                              label: pageLabel,
-                              onLabelTab:
-                                  audioPageType == AudioPageType.likedAudio
-                                      ? null
-                                      : onPageLabelTab,
-                              onSubTitleTab: onPageSubTitleTab,
-                              description: description,
-                            ),
-                          ),
-                        ),
-                        SliverAudioPageControlPanel(
-                          controlPanel: controlPanel ??
-                              AvatarPlayButton(
-                                audios: audios ?? [],
-                                pageId: pageId,
-                              ),
-                        ),
-                        if (audios == null)
-                          const SliverToBoxAdapter(
-                            child: Center(
-                              child: Progress(),
-                            ),
-                          )
-                        else
-                          SliverPadding(
-                            padding: getAdaptiveHorizontalPadding(
-                              constraints: constraints,
-                            ),
-                            sliver: SliverAudioTileList(
-                              audioPageType: audioPageType,
-                              audios: audios!,
-                              pageId: pageId,
-                              onSubTitleTab: onPageLabelTab,
-                            ),
-                          ),
-                      ],
-                    );
+              else
+                SliverPadding(
+                  padding: padding,
+                  sliver: SliverAudioTileList(
+                    audioPageType: audioPageType,
+                    audios: audios!,
+                    pageId: pageId,
+                    onSubTitleTab: onPageLabelTab,
+                  ),
+                ),
+            ],
+          );
         },
       ),
     );

diff --git a/lib/common/view/sliver_audio_tile_list.dart b/lib/common/view/sliver_audio_tile_list.dart
@@ -36,22 +36,25 @@ class SliverAudioTileList extends StatelessWidget with WatchItMixin {
         (context, index) {
           final audio = audios.elementAt(index);
           final audioSelected = currentAudio == audio;
-          return AudioTile(
-            showLeading: showLeading,
-            key: ValueKey(audio.path ?? audio.url),
-            audioPageType: audioPageType,
-            onSubTitleTap: onSubTitleTab,
-            isPlayerPlaying: isPlaying,
-            onTap: () => playerModel.startPlaylist(
-              audios: audios,
-              listName: pageId,
-              index: index,
+          return Padding(
+            padding: const EdgeInsets.only(bottom: 5),
+            child: AudioTile(
+              showLeading: showLeading,
+              key: ValueKey(audio.path ?? audio.url),
+              audioPageType: audioPageType,
+              onSubTitleTap: onSubTitleTab,
+              isPlayerPlaying: isPlaying,
+              onTap: () => playerModel.startPlaylist(
+                audios: audios,
+                listName: pageId,
+                index: index,
+              ),
+              selected: audioSelected,
+              audio: audio,
+              insertIntoQueue: playerModel.insertIntoQueue,
+              pageId: pageId,
+              selectedColor: selectedColor,
             ),
-            selected: audioSelected,
-            audio: audio,
-            insertIntoQueue: playerModel.insertIntoQueue,
-            pageId: pageId,
-            selectedColor: selectedColor,
           );
         },
       ),

diff --git a/lib/common/view/theme.dart b/lib/common/view/theme.dart
@@ -218,7 +218,11 @@ double get avatarIconRadius =>
             : 38) /
     2;
 
-double get bigPlayButtonRadius => yaruStyled ? 22 : 23;
+double get bigPlayButtonRadius => yaruStyled
+    ? 22
+    : isMobile
+        ? 26
+        : 23;
 
 EdgeInsets get filterPanelPadding =>
     EdgeInsets.only(top: isMobile ? 10 : 0, bottom: 10);
@@ -237,8 +241,7 @@ FontWeight get largeTextWeight =>
 
 double get chipHeight => isMobile ? 40 : 34.0;
 
-EdgeInsets get audioTilePadding =>
-    isMobile ? kMobileAudioTilePadding : kDesktopAudioTilePadding;
+EdgeInsets get audioTilePadding => kAudioTilePadding;
 
 SliverGridDelegate get audioCardGridDelegate =>
     isMobile ? kMobileAudioCardGridDelegate : kAudioCardGridDelegate;