Search results are horizontally scrollable instead of Wrap

Hotkey Record dialog pops the route on cancel bugfix
Headings & fontSizes optimized for smaller devices
This commit is contained in:
Kingkor Roy Tirtho 2022-03-18 20:26:03 +06:00
parent 22a1da06b6
commit a06d891a04
4 changed files with 69 additions and 31 deletions

View File

@ -5,6 +5,7 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotify/spotify.dart';
import 'package:spotube/helpers/artist-to-string.dart';
import 'package:spotube/helpers/getLyrics.dart';
import 'package:spotube/hooks/useBreakpoints.dart';
import 'package:spotube/provider/Playback.dart';
import 'package:spotube/provider/UserPreferences.dart';
@ -56,6 +57,8 @@ class Lyrics extends HookConsumerWidget {
playback.currentTrack,
]);
final breakpoint = useBreakpoints();
if (lyrics.value["lyrics"] == null && playback.currentTrack != null) {
if (!hasToken) {
return Expanded(
@ -83,6 +86,8 @@ class Lyrics extends HookConsumerWidget {
);
}
final textTheme = Theme.of(context).textTheme;
return Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
@ -90,24 +95,32 @@ class Lyrics extends HookConsumerWidget {
Center(
child: Text(
playback.currentTrack?.name ?? "",
style: Theme.of(context).textTheme.headline3,
style: breakpoint >= Breakpoints.md
? textTheme.headline3
: textTheme.headline4?.copyWith(fontSize: 25),
),
),
Center(
child: Text(
artistsToString<Artist>(playback.currentTrack?.artists ?? []),
style: Theme.of(context).textTheme.headline5,
style: breakpoint >= Breakpoints.md
? textTheme.headline5
: textTheme.headline6,
),
),
Expanded(
child: SingleChildScrollView(
child: Center(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
lyrics.value["lyrics"] == null &&
playback.currentTrack == null
? "No Track being played currently"
: lyrics.value["lyrics"]!,
style: Theme.of(context).textTheme.headline6,
style: textTheme.headline6
?.copyWith(color: textTheme.headline1?.color),
),
),
),
),

View File

@ -60,7 +60,7 @@ class PlayerView extends HookConsumerWidget {
Text(
currentTrack?.name ?? "Not playing",
overflow: TextOverflow.ellipsis,
style: Theme.of(context).textTheme.headline4?.copyWith(
style: Theme.of(context).textTheme.headline5?.copyWith(
fontWeight: FontWeight.bold,
color: paletteColor.titleTextColor,
),

View File

@ -9,6 +9,7 @@ import 'package:spotube/components/Shared/TracksTableView.dart';
import 'package:spotube/helpers/image-to-url-string.dart';
import 'package:spotube/helpers/simple-album-to-album.dart';
import 'package:spotube/helpers/zero-pad-num-str.dart';
import 'package:spotube/hooks/useBreakpoints.dart';
import 'package:spotube/provider/Playback.dart';
import 'package:spotube/provider/SpotifyDI.dart';
@ -20,6 +21,10 @@ class Search extends HookConsumerWidget {
SpotifyApi spotify = ref.watch(spotifyProvider);
var controller = useTextEditingController();
var searchTerm = useState("");
final albumController = useScrollController();
final playlistController = useScrollController();
final artistController = useScrollController();
final breakpoint = useBreakpoints();
return Expanded(
child: Column(
@ -135,15 +140,18 @@ class Search extends HookConsumerWidget {
style: Theme.of(context).textTheme.headline5,
),
const SizedBox(height: 10),
Center(
child: Wrap(
spacing: 20,
runSpacing: 20,
Scrollbar(
controller: albumController,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
controller: albumController,
child: Row(
children: albums.map((album) {
return AlbumCard(simpleAlbumToAlbum(album));
}).toList(),
),
),
),
const SizedBox(height: 20),
if (artists.isNotEmpty)
Text(
@ -151,13 +159,22 @@ class Search extends HookConsumerWidget {
style: Theme.of(context).textTheme.headline5,
),
const SizedBox(height: 10),
Center(
child: Wrap(
spacing: 20,
runSpacing: 20,
children: artists.map((artist) {
return ArtistCard(artist);
}).toList(),
Scrollbar(
controller: artistController,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
controller: artistController,
child: Row(
children: artists
.map(
(artist) => Container(
margin: const EdgeInsets.symmetric(
horizontal: 15),
child: ArtistCard(artist),
),
)
.toList(),
),
),
),
const SizedBox(height: 20),
@ -167,13 +184,21 @@ class Search extends HookConsumerWidget {
style: Theme.of(context).textTheme.headline5,
),
const SizedBox(height: 10),
Center(
child: Wrap(
spacing: 20,
runSpacing: 20,
children: playlists.map((playlist) {
return PlaylistCard(playlist);
}).toList(),
Scrollbar(
scrollbarOrientation: breakpoint > Breakpoints.md
? ScrollbarOrientation.bottom
: ScrollbarOrientation.top,
controller: playlistController,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
controller: playlistController,
child: Row(
children: playlists
.map(
(playlist) => PlaylistCard(playlist),
)
.toList(),
),
),
),
],

View File

@ -67,7 +67,7 @@ class RecordHotKeyDialog extends HookWidget {
TextButton(
child: const Text('Cancel'),
onPressed: () {
GoRouter.of(context).pop();
Navigator.of(context).pop();
},
),
TextButton(