Skip to content

Commit

Permalink
fix: horizontal infinite lists doesn't fill the screen
Browse files Browse the repository at this point in the history
  • Loading branch information
@KRTirtho
KRTirtho committed Dec 7, 2022
1 parent 067e9ac commit 69995be
Show file tree
Hide file tree
Showing 10 changed files with 212 additions and 175 deletions.
27 changes: 14 additions & 13 deletions lib/components/Artist/ArtistAlbumList.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,21 +50,22 @@ class ArtistAlbumList extends HookConsumerWidget {
child: Scrollbar(
interactive: false,
controller: scrollController,
child: ListView.builder(
itemCount: albums.length,
child: Waypoint(
controller: scrollController,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
if (index == albums.length - 1 && hasNextPage) {
return Waypoint(
onEnter: () {
albumsQuery.fetchNextPage();
},
child: const ShimmerPlaybuttonCard(count: 1),
);
}
return AlbumCard(albums[index]);
onTouchEdge: () {
albumsQuery.fetchNextPage();
},
child: ListView.builder(
itemCount: albums.length,
controller: scrollController,
scrollDirection: Axis.horizontal,
itemBuilder: (context, index) {
if (index == albums.length - 1 && hasNextPage) {
return const ShimmerPlaybuttonCard(count: 1);
}
return AlbumCard(albums[index]);
},
),
),
),
),
Expand Down
29 changes: 15 additions & 14 deletions lib/components/Category/CategoryCard.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,21 +66,22 @@ class CategoryCard extends HookConsumerWidget {
child: Scrollbar(
controller: scrollController,
interactive: false,
child: ListView.builder(
scrollDirection: Axis.horizontal,
shrinkWrap: true,
itemCount: playlists.length,
itemBuilder: (context, index) {
if (index == playlists.length - 1 && hasNextPage) {
return Waypoint(
onEnter: () {
playlistQuery.fetchNextPage();
},
child: const ShimmerPlaybuttonCard(count: 1),
);
}
return PlaylistCard(playlists[index]);
child: Waypoint(
controller: scrollController,
onTouchEdge: () {
playlistQuery.fetchNextPage();
},
child: ListView(
scrollDirection: Axis.horizontal,
shrinkWrap: true,
controller: scrollController,
children: [
...playlists
.map((playlist) => PlaylistCard(playlist)),
if (hasNextPage)
const ShimmerPlaybuttonCard(count: 1),
],
),
),
),
),
Expand Down
33 changes: 18 additions & 15 deletions lib/components/Home/Genres.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ class Genres extends HookConsumerWidget {

@override
Widget build(BuildContext context, ref) {
final scrollController = useScrollController();
final spotify = ref.watch(spotifyProvider);
final recommendationMarket = ref.watch(
userPreferencesProvider.select((s) => s.recommendationMarket),
Expand Down Expand Up @@ -45,23 +46,25 @@ class Genres extends HookConsumerWidget {

return PlatformScaffold(
appBar: kIsDesktop ? PageWindowTitleBar() : null,
body: ListView.builder(
itemCount: categories.length,
itemBuilder: (context, index) {
final category = categories[index];
if (category == null) return Container();
if (index == categories.length - 1) {
return Waypoint(
onEnter: () {
if (categoriesQuery.hasNextPage) {
categoriesQuery.fetchNextPage();
}
},
child: const ShimmerCategories(),
);
body: Waypoint(
onTouchEdge: () {
if (categoriesQuery.hasNextPage) {
categoriesQuery.fetchNextPage();
}
return CategoryCard(category);
},
controller: scrollController,
child: ListView.builder(
controller: scrollController,
itemCount: categories.length,
itemBuilder: (context, index) {
final category = categories[index];
if (category == null) return Container();
if (index == categories.length - 1) {
return const ShimmerCategories();
}
return CategoryCard(category);
},
),
),
);
}
Expand Down
22 changes: 13 additions & 9 deletions lib/components/Library/UserArtists.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,15 +49,19 @@ class UserArtists extends HookConsumerWidget {
),
padding: const EdgeInsets.all(10),
itemBuilder: (context, index) {
if (index == artists.length - 1 && hasNextPage) {
return Waypoint(
onEnter: () {
artistQuery.fetchNextPage();
},
child: ArtistCard(artists[index]),
);
}
return ArtistCard(artists[index]);
return HookBuilder(builder: (context) {
if (index == artists.length - 1 && hasNextPage) {
return Waypoint(
controller: useScrollController(),
isGrid: true,
onTouchEdge: () {
artistQuery.fetchNextPage();
},
child: ArtistCard(artists[index]),
);
}
return ArtistCard(artists[index]);
});
},
),
);
Expand Down
149 changes: 72 additions & 77 deletions lib/components/Search/Search.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -200,26 +200,24 @@ class Search extends HookConsumerWidget {
if (playlists.isNotEmpty)
PlatformText.headline("Playlists"),
const SizedBox(height: 10),
if (searchPlaylist.isLoading &&
!searchPlaylist.isFetchingNextPage)
const PlatformCircularProgressIndicator()
else if (searchPlaylist.hasError)
PlatformText(searchPlaylist
.error?[searchPlaylist.pageParams.last])
else
ScrollConfiguration(
behavior: ScrollConfiguration.of(context)
.copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
ScrollConfiguration(
behavior:
ScrollConfiguration.of(context).copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
},
),
child: Scrollbar(
scrollbarOrientation:
breakpoint > Breakpoints.md
? ScrollbarOrientation.bottom
: ScrollbarOrientation.top,
controller: playlistController,
child: Waypoint(
onTouchEdge: () {
searchPlaylist.fetchNextPage();
},
),
child: Scrollbar(
scrollbarOrientation:
breakpoint > Breakpoints.md
? ScrollbarOrientation.bottom
: ScrollbarOrientation.top,
controller: playlistController,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
Expand All @@ -231,15 +229,8 @@ class Search extends HookConsumerWidget {
if (i == playlists.length - 1 &&
searchPlaylist
.hasNextPage) {
return Waypoint(
onEnter: () {
searchPlaylist
.fetchNextPage();
},
child:
const ShimmerPlaybuttonCard(
count: 1),
);
return const ShimmerPlaybuttonCard(
count: 1);
}
return PlaylistCard(playlist);
},
Expand All @@ -249,27 +240,32 @@ class Search extends HookConsumerWidget {
),
),
),
),
if (searchPlaylist.isLoading &&
!searchPlaylist.isFetchingNextPage)
const PlatformCircularProgressIndicator(),
if (searchPlaylist.hasError)
PlatformText(searchPlaylist
.error?[searchPlaylist.pageParams.last]),
const SizedBox(height: 20),
if (artists.isNotEmpty)
PlatformText.headline("Artists"),
const SizedBox(height: 10),
if (searchArtist.isLoading &&
!searchArtist.isFetchingNextPage)
const PlatformCircularProgressIndicator()
else if (searchArtist.hasError)
PlatformText(searchArtist
.error?[searchArtist.pageParams.last])
else
ScrollConfiguration(
behavior: ScrollConfiguration.of(context)
.copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
},
),
child: Scrollbar(
ScrollConfiguration(
behavior:
ScrollConfiguration.of(context).copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
},
),
child: Scrollbar(
controller: artistController,
child: Waypoint(
controller: artistController,
onTouchEdge: () {
searchArtist.fetchNextPage();
},
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
controller: artistController,
Expand All @@ -279,15 +275,8 @@ class Search extends HookConsumerWidget {
(i, artist) {
if (i == artists.length - 1 &&
searchArtist.hasNextPage) {
return Waypoint(
onEnter: () {
searchArtist
.fetchNextPage();
},
child:
const ShimmerPlaybuttonCard(
count: 1),
);
return const ShimmerPlaybuttonCard(
count: 1);
}
return Container(
margin: const EdgeInsets
Expand All @@ -302,6 +291,13 @@ class Search extends HookConsumerWidget {
),
),
),
),
if (searchArtist.isLoading &&
!searchArtist.isFetchingNextPage)
const PlatformCircularProgressIndicator(),
if (searchArtist.hasError)
PlatformText(searchArtist
.error?[searchArtist.pageParams.last]),
const SizedBox(height: 20),
if (albums.isNotEmpty)
PlatformText(
Expand All @@ -310,23 +306,21 @@ class Search extends HookConsumerWidget {
Theme.of(context).textTheme.headline5,
),
const SizedBox(height: 10),
if (searchAlbum.isLoading &&
!searchAlbum.isFetchingNextPage)
const PlatformCircularProgressIndicator()
else if (searchAlbum.hasError)
PlatformText(searchAlbum
.error?[searchAlbum.pageParams.last])
else
ScrollConfiguration(
behavior: ScrollConfiguration.of(context)
.copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
},
),
child: Scrollbar(
ScrollConfiguration(
behavior:
ScrollConfiguration.of(context).copyWith(
dragDevices: {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
},
),
child: Scrollbar(
controller: albumController,
child: Waypoint(
controller: albumController,
onTouchEdge: () {
searchAlbum.fetchNextPage();
},
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
controller: albumController,
Expand All @@ -335,14 +329,8 @@ class Search extends HookConsumerWidget {
...albums.mapIndexed((i, album) {
if (i == albums.length - 1 &&
searchAlbum.hasNextPage) {
return Waypoint(
onEnter: () {
searchAlbum.fetchNextPage();
},
child:
const ShimmerPlaybuttonCard(
count: 1),
);
return const ShimmerPlaybuttonCard(
count: 1);
}
return AlbumCard(
TypeConversionUtils
Expand All @@ -356,6 +344,13 @@ class Search extends HookConsumerWidget {
),
),
),
),
if (searchAlbum.isLoading &&
!searchAlbum.isFetchingNextPage)
const PlatformCircularProgressIndicator(),
if (searchAlbum.hasError)
PlatformText(searchAlbum
.error?[searchAlbum.pageParams.last]),
],
),
),
Expand Down
Loading

0 comments on commit 69995be

Please sign in to comment.