Skip to content

Commit

Permalink
Add keep alives for scrolling performance
Browse files Browse the repository at this point in the history
  • Loading branch information
@r52
r52 committed Jun 29, 2024
1 parent b1a3707 commit 572818e
Show file tree
Hide file tree
Showing 4 changed files with 72 additions and 36 deletions.
1 change: 1 addition & 0 deletions lib/local/widgets.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,7 @@ class _GridLibraryItem extends HookWidget {

@override
Widget build(BuildContext context) {
useAutomaticKeepAlive();
final aniController =
useAnimationController(duration: const Duration(milliseconds: 100));
final gradient =
Expand Down
27 changes: 21 additions & 6 deletions lib/mangadex/manga_view.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1053,13 +1053,9 @@ class _ChapterListSliver extends HookWidget {

if (key.startsWith(header)) {
final text = key.replaceFirst(header, '');
return Padding(
return _ChapterListHeader(
key: ValueKey(key),
padding: const EdgeInsets.all(6.0),
child: Text(text,
style: TextStyle(
fontWeight:
text.contains('Volume') ? FontWeight.bold : null)),
text: text,
);
}

Expand Down Expand Up @@ -1107,6 +1103,24 @@ class _ChapterListSliver extends HookWidget {
}
}

class _ChapterListHeader extends HookWidget {
final String text;

const _ChapterListHeader({super.key, required this.text});

@override
Widget build(BuildContext context) {
useAutomaticKeepAlive();
return Padding(
key: ValueKey(key),
padding: const EdgeInsets.all(6.0),
child: Text(text,
style: TextStyle(
fontWeight: text.contains('Volume') ? FontWeight.bold : null)),
);
}
}

class _CoverArtItem extends HookWidget {
const _CoverArtItem({
super.key,
Expand All @@ -1123,6 +1137,7 @@ class _CoverArtItem extends HookWidget {

@override
Widget build(BuildContext context) {
useAutomaticKeepAlive();
final aniController =
useAnimationController(duration: const Duration(milliseconds: 100));
final gradient =
Expand Down
76 changes: 47 additions & 29 deletions lib/mangadex/widgets.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -227,34 +227,41 @@ class ChapterFeedItem extends HookConsumerWidget {

@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final screenSizeSmall = DeviceContext.screenWidthSmall(context);
final theme = Theme.of(context);

final chapterBtns = useMemoized<List<Widget>>(() {
return state.chapters.map((e) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: ChapterButtonWidget(
key: ValueKey(e.id),
chapter: e,
manga: state.manga,
link: Text(
state.manga.attributes!.title.get('en'),
style: const TextStyle(fontSize: 18),
),
onLinkPressed: () async {
ref.read(readChaptersProvider.notifier).get([state.manga]);
ref.read(ratingsProvider.notifier).get([state.manga]);
ref.read(statisticsProvider.notifier).get([state.manga]);
context.push('/title/${state.manga.id}', extra: state.manga);
},
return ChapterButtonWidget(
key: ValueKey(e.id),
chapter: e,
manga: state.manga,
link: Text(
state.manga.attributes!.title.get('en'),
style: const TextStyle(fontSize: 18),
),
onLinkPressed: () async {
ref.read(readChaptersProvider.notifier).get([state.manga]);
ref.read(ratingsProvider.notifier).get([state.manga]);
ref.read(statisticsProvider.notifier).get([state.manga]);
context.push('/title/${state.manga.id}', extra: state.manga);
},
);
}).toList();
}, [state]);

final listsliver = SliverList.separated(
itemBuilder: (context, index) => chapterBtns.elementAt(index),
separatorBuilder: (context, index) => const SizedBox(
height: 4,
),
itemCount: chapterBtns.length,
);

final titleBtn = TextButton.icon(
style: TextButton.styleFrom(
alignment: Alignment.centerLeft,
minimumSize: const Size(0.0, 24.0),
shape: const RoundedRectangleBorder(),
foregroundColor: theme.colorScheme.onSurface,
Expand Down Expand Up @@ -313,10 +320,12 @@ class ChapterFeedItem extends HookConsumerWidget {
children: [
coverBtn,
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: chapterBtns,
)),
child: CustomScrollView(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
slivers: [listsliver],
),
),
],
),
],
Expand All @@ -326,14 +335,19 @@ class ChapterFeedItem extends HookConsumerWidget {
children: [
coverBtn,
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
titleBtn,
const Divider(
height: 10.0,
child: CustomScrollView(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
slivers: [
SliverList.list(
children: [
titleBtn,
const Divider(
height: 10.0,
),
],
),
...chapterBtns,
listsliver,
],
),
)
Expand All @@ -360,6 +374,7 @@ class ChapterButtonWidget extends HookWidget {

@override
Widget build(BuildContext context) {
useAutomaticKeepAlive();
final bool screenSizeSmall = DeviceContext.screenWidthSmall(context);
final iconSet = screenSizeSmall ? _iconSetS : _iconSetB;

Expand Down Expand Up @@ -771,6 +786,7 @@ class _GridMangaItem extends HookConsumerWidget {

@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final aniController =
useAnimationController(duration: const Duration(milliseconds: 100));
final gradient =
Expand Down Expand Up @@ -878,7 +894,7 @@ class _GridMangaItem extends HookConsumerWidget {
}
}

class _GridMangaDetailedItem extends ConsumerWidget {
class _GridMangaDetailedItem extends HookConsumerWidget {
const _GridMangaDetailedItem({
super.key,
required this.manga,
Expand All @@ -890,6 +906,7 @@ class _GridMangaDetailedItem extends ConsumerWidget {

@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final bool screenSizeSmall = DeviceContext.screenWidthSmall(context);
final theme = Theme.of(context);

Expand Down Expand Up @@ -980,7 +997,7 @@ class _GridMangaDetailedItem extends ConsumerWidget {
}
}

class _ListMangaItem extends ConsumerWidget {
class _ListMangaItem extends HookConsumerWidget {
const _ListMangaItem({
super.key,
required this.manga,
Expand All @@ -992,6 +1009,7 @@ class _ListMangaItem extends ConsumerWidget {

@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final theme = Theme.of(context);

return Card(
Expand Down
4 changes: 3 additions & 1 deletion lib/web/manga_view.dart
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import 'package:extended_image/extended_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import 'package:gagaku/model.dart';
import 'package:gagaku/ui.dart';
Expand Down Expand Up @@ -285,7 +286,7 @@ class WebMangaViewWidget extends StatelessWidget {
}
}

class ChapterButtonWidget extends ConsumerWidget {
class ChapterButtonWidget extends HookConsumerWidget {
const ChapterButtonWidget({
super.key,
required this.data,
Expand All @@ -303,6 +304,7 @@ class ChapterButtonWidget extends ConsumerWidget {

@override
Widget build(BuildContext context, WidgetRef ref) {
useAutomaticKeepAlive();
final bool screenSizeSmall = DeviceContext.screenWidthSmall(context);
final theme = Theme.of(context);
final tileColor = theme.colorScheme.primaryContainer;
Expand Down

0 comments on commit 572818e

Please sign in to comment.