kitty/spotube
1
0
Fork 0
mirror of https://github.com/KRTirtho/spotube.git synced 2025-09-13 16:05:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix(genres): lag while scrolling

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2023-11-14 20:58:16 +06:00
parent 0e07506716
commit dc980b024e
11 changed files with 56 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lib/components/artist/artist_album_list.dart
View File

@ -29,6 +29,7 @@ class ArtistAlbumList extends HookConsumerWidget {
final theme = Theme.of(context);
return HorizontalPlaybuttonCardView<Album>(
isLoadingNextPage: albumsQuery.isLoadingNextPage,
hasNextPage: albumsQuery.hasNextPage,
items: albums,
onFetchMore: albumsQuery.fetchNext,

1
lib/components/genre/category_card.dart
View File

@ -42,6 +42,7 @@ class CategoryCard extends HookConsumerWidget {
return HorizontalPlaybuttonCardView<PlaylistSimple>(
title: Text(category.name!),
isLoadingNextPage: playlistQuery.isLoadingNextPage,
hasNextPage: playlistQuery.hasNextPage,
items: playlists,
onFetchMore: playlistQuery.fetchNext,

28
lib/components/shared/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart
View File

@ -7,19 +7,22 @@ import 'package:spotube/components/album/album_card.dart';
import 'package:spotube/components/artist/artist_card.dart';
import 'package:spotube/components/playlist/playlist_card.dart';
import 'package:spotube/components/shared/shimmers/shimmer_playbutton_card.dart';
import 'package:spotube/components/shared/waypoint.dart';
import 'package:spotube/hooks/utils/use_breakpoint_value.dart';
import 'package:very_good_infinite_list/very_good_infinite_list.dart';
class HorizontalPlaybuttonCardView<T> extends HookWidget {
final Widget title;
final List<T> items;
final VoidCallback onFetchMore;
final bool isLoadingNextPage;
final bool hasNextPage;
const HorizontalPlaybuttonCardView({
required this.title,
required this.items,
required this.hasNextPage,
required this.onFetchMore,
required this.isLoadingNextPage,
Key? key,
}) : assert(
items is List<PlaylistSimple> ||
@ -58,23 +61,18 @@ class HorizontalPlaybuttonCardView<T> extends HookWidget {
PointerDeviceKind.mouse,
},
),
child: ListView.builder(
controller: scrollController,
child: InfiniteList(
scrollController: scrollController,
scrollDirection: Axis.horizontal,
padding: const EdgeInsets.symmetric(vertical: 8.0),
itemCount: items.length + 1,
itemCount: items.length,
onFetchData: onFetchMore,
loadingBuilder: (context) => const ShimmerPlaybuttonCard(),
emptyBuilder: (context) =>
const ShimmerPlaybuttonCard(count: 5),
isLoading: isLoadingNextPage,
hasReachedMax: !hasNextPage,
itemBuilder: (context, index) {
if (index == items.length) {
if (!hasNextPage) {
return const SizedBox.shrink();
}
return Waypoint(
controller: scrollController,
onTouchEdge: onFetchMore,
isGrid: true,
child: const ShimmerPlaybuttonCard(),
);
}
final item = items[index];
return switch (item.runtimeType) {

25
lib/pages/home/genres.dart
View File

@ -7,12 +7,12 @@ import 'package:spotify/spotify.dart';
import 'package:spotube/collections/spotube_icons.dart';
import 'package:spotube/components/genre/category_card.dart';
import 'package:spotube/components/shared/expandable_search/expandable_search.dart';
import 'package:spotube/components/shared/inter_scrollbar/inter_scrollbar.dart';
import 'package:spotube/components/shared/shimmers/shimmer_categories.dart';
import 'package:spotube/components/shared/waypoint.dart';
import 'package:spotube/provider/user_preferences_provider.dart';
import 'package:spotube/services/queries/queries.dart';
import 'package:very_good_infinite_list/very_good_infinite_list.dart';
class GenrePage extends HookConsumerWidget {
const GenrePage({Key? key}) : super(key: key);
@ -79,24 +79,15 @@ class GenrePage extends HookConsumerWidget {
const ShimmerCategories()
else
Expanded(
child: ListView.builder(
controller: scrollController,
child: InfiniteList(
scrollController: scrollController,
itemCount: categories.length,
onFetchData: categoriesQuery.fetchNext,
isLoading: categoriesQuery.isLoadingNextPage,
hasReachedMax: !categoriesQuery.hasNextPage,
loadingBuilder: (context) => const ShimmerCategories(),
itemBuilder: (context, index) {
return AnimatedSwitcher(
transitionBuilder: (child, animation) {
return FadeTransition(
opacity: animation,
child: child,
);
},
duration: const Duration(milliseconds: 300),
child: searchController.text.isEmpty &&
index == categories.length - 1 &&
categoriesQuery.hasNextPage
? const ShimmerCategories()
: CategoryCard(categories[index]),
);
return CategoryCard(categories[index]);
},
),
),

3
lib/pages/home/personalized.dart
View File

@ -56,6 +56,7 @@ class PersonalizedPage extends HookConsumerWidget {
HorizontalPlaybuttonCardView<PlaylistSimple>(
items: playlists.toList(),
title: Text(context.l10n.featured),
isLoadingNextPage: featuredPlaylistsQuery.isLoadingNextPage,
hasNextPage: featuredPlaylistsQuery.hasNextPage,
onFetchMore: featuredPlaylistsQuery.fetchNext,
),
@ -66,6 +67,7 @@ class PersonalizedPage extends HookConsumerWidget {
HorizontalPlaybuttonCardView<Album>(
items: albums,
title: Text(context.l10n.new_releases),
isLoadingNextPage: newReleases.isLoadingNextPage,
hasNextPage: newReleases.hasNextPage,
onFetchMore: newReleases.fetchNext,
),
@ -81,6 +83,7 @@ class PersonalizedPage extends HookConsumerWidget {
items: playlists,
title: Text(item["name"] ?? ""),
hasNextPage: false,
isLoadingNextPage: false,
onFetchMore: () {},
);
})

1
lib/pages/search/sections/albums.dart
View File

@ -30,6 +30,7 @@ class SearchAlbumsSection extends HookConsumerWidget {
);
return HorizontalPlaybuttonCardView(
isLoadingNextPage: query.isLoadingNextPage,
hasNextPage: query.hasNextPage,
items: albums,
onFetchMore: query.fetchNext,

1
lib/pages/search/sections/artists.dart
View File

@ -28,6 +28,7 @@ class SearchArtistsSection extends HookConsumerWidget {
);
return HorizontalPlaybuttonCardView<Artist>(
isLoadingNextPage: query.isLoadingNextPage,
hasNextPage: query.hasNextPage,
items: artists,
onFetchMore: query.fetchNext,

1
lib/pages/search/sections/playlists.dart
View File

@ -26,6 +26,7 @@ class SearchPlaylistsSection extends HookConsumerWidget {
);
return HorizontalPlaybuttonCardView(
isLoadingNextPage: query.isLoadingNextPage,
hasNextPage: query.hasNextPage,
items: playlists,
onFetchMore: query.fetchNext,

40
lib/pages/settings/settings.dart
View File

@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
import 'package:flutter_desktop_tools/flutter_desktop_tools.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotube/components/shared/inter_scrollbar/inter_scrollbar.dart';
import 'package:spotube/components/shared/page_window_title_bar.dart';
import 'package:spotube/extensions/context.dart';
import 'package:spotube/pages/settings/sections/about.dart';
@ -37,29 +36,26 @@ class SettingsPage extends HookConsumerWidget {
Flexible(
child: Container(
constraints: const BoxConstraints(maxWidth: 1366),
child: InterScrollbar(
child: ListView(
controller: controller,
child: ListView(
controller: controller,
children: [
const SettingsAccountSection(),
const SettingsLanguageRegionSection(),
const SettingsAppearanceSection(),
const SettingsPlaybackSection(),
const SettingsDownloadsSection(),
if (DesktopTools.platform.isDesktop)
const SettingsDesktopSection(),
if (!kIsWeb) const SettingsDevelopersSection(),
const SettingsAboutSection(),
Center(
child: FilledButton(
onPressed: preferencesNotifier.reset,
child: Text(context.l10n.restore_defaults),
),
children: [
const SettingsAccountSection(),
const SettingsLanguageRegionSection(),
const SettingsAppearanceSection(),
const SettingsPlaybackSection(),
const SettingsDownloadsSection(),
if (DesktopTools.platform.isDesktop)
const SettingsDesktopSection(),
if (!kIsWeb) const SettingsDevelopersSection(),
const SettingsAboutSection(),
Center(
child: FilledButton(
onPressed: preferencesNotifier.reset,
child: Text(context.l10n.restore_defaults),
),
const SizedBox(height: 10),
],
),
),
const SizedBox(height: 10),
],
),
),
),

8
pubspec.lock
View File

@ -2180,6 +2180,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "3.0.2"
very_good_infinite_list:
dependency: "direct main"
description:
name: very_good_infinite_list
sha256: "6f5ad429edbce6084e1c600e56b26b1de8c6b138e8e8fc2de41b686166029aa5"
url: "https://pub.dev"
source: hosted
version: "0.7.1"
visibility_detector:
dependency: "direct main"
description:

1
pubspec.yaml
View File

@ -110,6 +110,7 @@ dependencies:
git:
url: https://github.com/thielepaul/flutter-draggable-scrollbar.git
ref: cfd570035bf393de541d32e9b28808b5d7e602df
very_good_infinite_list: ^0.7.1
dev_dependencies:
build_runner: ^2.3.2