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

chore: improve carousel performance

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2025-01-06 21:44:06 +06:00
parent 46852545a9
commit 3ffcb48db9
1 changed files with 84 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
lib/modules/home/sections/genres.dart
View File

@ -31,12 +31,12 @@ class HomeGenresSection extends HookConsumerWidget {
() => () =>
categoriesQuery.asData?.value categoriesQuery.asData?.value
.where((c) => (c.icons?.length ?? 0) > 0) .where((c) => (c.icons?.length ?? 0) > 0)
.take(mediaQuery.mdAndDown ? 6 : 10) .take(6)
.toList() ?? .toList() ??
[ [
FakeData.category, FakeData.category,
], ],
[mediaQuery.mdAndDown, categoriesQuery.asData?.value], [categoriesQuery.asData?.value],
); );
final controller = useMemoized(() => CarouselController(), []); final controller = useMemoized(() => CarouselController(), []);
final interactedRef = useRef(false); final interactedRef = useRef(false);
@ -159,14 +159,16 @@ class HomeGenresSection extends HookConsumerWidget {
child: Skeleton.ignore( child: Skeleton.ignore(
child: Skeletonizer( child: Skeletonizer(
enabled: playlists.isLoading, enabled: playlists.isLoading,
child: SingleChildScrollView( child: ListView.separated(
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
child: Row( itemCount: playlistsData.length,
spacing: 12, separatorBuilder: (context, index) =>
mainAxisAlignment: MainAxisAlignment.center, const Gap(12),
children: [ itemBuilder: (context, index) {
for (final playlist in playlistsData) final playlist =
Container( playlistsData.elementAt(index);
return Container(
width: 115 * theme.scaling, width: 115 * theme.scaling,
decoration: BoxDecoration( decoration: BoxDecoration(
color: theme.colorScheme.background color: theme.colorScheme.background
@ -177,17 +179,14 @@ class HomeGenresSection extends HookConsumerWidget {
borderRadius: theme.borderRadiusMd, borderRadius: theme.borderRadiusMd,
surfaceBlur: theme.surfaceBlur, surfaceBlur: theme.surfaceBlur,
child: Button( child: Button(
style: ButtonVariance.secondary style:
.copyWith( ButtonVariance.secondary.copyWith(
padding: padding: (context, states, value) =>
(context, states, value) =>
const EdgeInsets.all(8), const EdgeInsets.all(8),
decoration: decoration: (context, states, value) {
(context, states, value) { final decoration = ButtonVariance
final decoration = .secondary
ButtonVariance.secondary .decoration(context, states)
.decoration(
context, states)
as BoxDecoration; as BoxDecoration;
if (states.isNotEmpty) { if (states.isNotEmpty) {
@ -220,8 +219,7 @@ class HomeGenresSection extends HookConsumerWidget {
child: UniversalImage( child: UniversalImage(
path: (playlist.images)! path: (playlist.images)!
.asUrlString( .asUrlString(
placeholder: placeholder: ImagePlaceholder
ImagePlaceholder
.collection, .collection,
index: 1, index: 1,
), ),
@ -233,27 +231,23 @@ class HomeGenresSection extends HookConsumerWidget {
Text( Text(
playlist.name!, playlist.name!,
maxLines: 2, maxLines: 2,
overflow: overflow: TextOverflow.ellipsis,
TextOverflow.ellipsis,
).semiBold().small(), ).semiBold().small(),
if (playlist.description != if (playlist.description != null)
null)
Text( Text(
playlist.description playlist.description
?.unescapeHtml() ?.unescapeHtml()
.cleanHtml() ?? .cleanHtml() ??
"", "",
maxLines: 2, maxLines: 2,
overflow: overflow: TextOverflow.ellipsis,
TextOverflow.ellipsis,
).xSmall().muted(), ).xSmall().muted(),
], ],
), ),
), ),
), ),
), );
], },
),
), ),
), ),
), ),