mirror of
https://github.com/kodjodevf/mangayomi.git
synced 2026-05-23 07:32:18 +00:00
861ee65113
Refs #609 (high RAM with stutters). Manga / anime covers from sources are typically 720x1080 or larger (~3 MB decoded RGBA per cover). The library grid, library list and generic browse / search card widgets render those covers at roughly 150x220 logical pixels, but every cover decoded to its full source resolution and that decoded bitmap landed in Flutter's `imageCache`. With 30-50 covers in flight during a normal scroll, the default 100 MB cache filled and the engine started evicting + re-decoding aggressively — exactly the symptom in #609 (stutters + high RAM). Mangayomi already had `ExtendedResizeImage` available via the `extended_image_library` package and used it in one place (`cachedCompressedNetworkImage`, called only from the History screen). This commit generalises that pattern. Add a `coverProvider()` helper in `lib/utils/cached_network.dart` that wraps `CustomExtendedNetworkImageProvider` in `ExtendedResizeImage` with a 200 KB encoded budget — sharp at typical thumbnail size on high-DPR screens, ~3.6x smaller decoded than a full-resolution cover. Pass through the same `cache` / `cacheMaxAge` knobs the underlying provider exposes so existing disk-cache behaviour is preserved. Swap the three high-traffic thumbnail call sites to use it: * `lib/modules/library/widgets/library_gridview_widget.dart` * `lib/modules/library/widgets/library_listview_widget.dart` * `lib/modules/widgets/manga_image_card_widget.dart` (both `MangaImageCardWidget` and `MangaImageCardListTileWidget`, used by browse and search results) Deliberately not changed: * The manga / anime detail page hero cover — large display, full resolution is appropriate. * Reader pages — already memory-managed by `ChapterPreloadManager` and need full resolution for actual reading. * `cachedNetworkImage()` and other lower-traffic thumbnail surfaces (tracker results, calendar, recommendation grid). Easy to extend in a follow-up if anyone asks; kept narrow here so review is manageable. Verified * `flutter analyze` clean on every touched file * `flutter build macos --release` succeeds * Smoke-tested on macOS with the local-all-fixes build: library grid, library list and browse card all render identical-looking covers at typical thumbnail sizes; no visible quality regression at the displayed scale
319 lines
15 KiB
Dart
319 lines
15 KiB
Dart
import 'dart:typed_data';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import 'package:mangayomi/modules/library/providers/library_filter_provider.dart';
|
|
import 'package:mangayomi/modules/library/providers/isar_providers.dart';
|
|
import 'package:mangayomi/modules/library/providers/library_state_provider.dart';
|
|
import 'package:mangayomi/models/manga.dart';
|
|
import 'package:mangayomi/modules/library/widgets/continue_reader_button.dart';
|
|
import 'package:mangayomi/modules/manga/detail/providers/state_providers.dart';
|
|
import 'package:mangayomi/utils/cached_network.dart';
|
|
import 'package:mangayomi/utils/extensions/build_context_extensions.dart';
|
|
import 'package:mangayomi/utils/constant.dart';
|
|
import 'package:mangayomi/utils/headers.dart';
|
|
import 'package:mangayomi/modules/widgets/bottom_text_widget.dart';
|
|
import 'package:mangayomi/modules/widgets/cover_view_widget.dart';
|
|
import 'package:mangayomi/modules/widgets/gridview_widget.dart';
|
|
import 'package:mangayomi/modules/widgets/manga_image_card_widget.dart';
|
|
|
|
class LibraryGridViewWidget extends StatefulWidget {
|
|
final bool isCoverOnlyGrid;
|
|
final bool isComfortableGrid;
|
|
final Set<int> mangaIdsList;
|
|
final List<Manga> entriesManga;
|
|
final bool language;
|
|
final bool downloadedChapter;
|
|
final bool continueReaderBtn;
|
|
final bool localSource;
|
|
final ItemType itemType;
|
|
const LibraryGridViewWidget({
|
|
super.key,
|
|
required this.entriesManga,
|
|
required this.isCoverOnlyGrid,
|
|
this.isComfortableGrid = false,
|
|
required this.language,
|
|
required this.downloadedChapter,
|
|
required this.continueReaderBtn,
|
|
required this.mangaIdsList,
|
|
required this.localSource,
|
|
required this.itemType,
|
|
});
|
|
|
|
@override
|
|
State<LibraryGridViewWidget> createState() => _LibraryGridViewWidgetState();
|
|
}
|
|
|
|
class _LibraryGridViewWidgetState extends State<LibraryGridViewWidget> {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Consumer(
|
|
builder: (context, ref, child) {
|
|
final isLongPressed = ref.watch(isLongPressedStateProvider);
|
|
final itemType = widget.itemType;
|
|
|
|
final gridSize = ref.watch(
|
|
libraryGridSizeStateProvider(itemType: itemType),
|
|
);
|
|
return GridViewWidget(
|
|
gridSize: gridSize,
|
|
childAspectRatio: widget.isComfortableGrid ? 0.642 : 0.69,
|
|
itemCount: widget.entriesManga.length,
|
|
itemBuilder: (context, index) {
|
|
final entry = widget.entriesManga[index];
|
|
|
|
return Builder(
|
|
builder: (context) {
|
|
bool isLocalArchive = entry.isLocalArchive ?? false;
|
|
return Padding(
|
|
padding: const EdgeInsets.all(2),
|
|
child: CoverViewWidget(
|
|
isLongPressed: widget.mangaIdsList.contains(entry.id),
|
|
bottomTextWidget: BottomTextWidget(
|
|
maxLines: 1,
|
|
text: entry.name!,
|
|
isComfortableGrid: widget.isComfortableGrid,
|
|
),
|
|
isComfortableGrid: widget.isComfortableGrid,
|
|
image: entry.customCoverImage != null
|
|
? MemoryImage(entry.customCoverImage as Uint8List)
|
|
as ImageProvider
|
|
: coverProvider(
|
|
toImgUrl(
|
|
entry.customCoverFromTracker ??
|
|
entry.imageUrl ??
|
|
"",
|
|
),
|
|
headers: entry.isLocalArchive!
|
|
? null
|
|
: ref.watch(
|
|
headersProvider(
|
|
source: entry.source!,
|
|
lang: entry.lang!,
|
|
sourceId: entry.sourceId,
|
|
),
|
|
),
|
|
),
|
|
onTap: () async {
|
|
if (isLongPressed) {
|
|
ref
|
|
.read(mangasListStateProvider.notifier)
|
|
.update(entry);
|
|
} else {
|
|
await pushToMangaReaderDetail(
|
|
ref: ref,
|
|
archiveId: isLocalArchive ? entry.id : null,
|
|
context: context,
|
|
lang: entry.lang!,
|
|
mangaM: entry,
|
|
source: entry.source!,
|
|
sourceId: entry.sourceId,
|
|
);
|
|
if (context.mounted) {
|
|
ref.invalidate(
|
|
getAllMangaWithoutCategoriesStreamProvider(
|
|
itemType: widget.itemType,
|
|
),
|
|
);
|
|
ref.invalidate(
|
|
getAllMangaStreamProvider(
|
|
categoryId: null,
|
|
itemType: widget.itemType,
|
|
),
|
|
);
|
|
}
|
|
}
|
|
},
|
|
onLongPress: () {
|
|
_handleLongOrSecondaryTap(isLongPressed, ref, entry);
|
|
},
|
|
onSecondaryTap: () {
|
|
_handleLongOrSecondaryTap(isLongPressed, ref, entry);
|
|
},
|
|
children: [
|
|
Stack(
|
|
children: [
|
|
Positioned(
|
|
top: 0,
|
|
left: 0,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(5),
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(3),
|
|
color: context.primaryColor,
|
|
),
|
|
child: Row(
|
|
children: [
|
|
if (widget.localSource && isLocalArchive)
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius: const BorderRadius.only(
|
|
topLeft: Radius.circular(3),
|
|
bottomLeft: Radius.circular(3),
|
|
),
|
|
color: Theme.of(context).hintColor,
|
|
),
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(
|
|
left: 3,
|
|
right: 3,
|
|
),
|
|
child: Text(
|
|
"Local",
|
|
style: TextStyle(
|
|
color: context
|
|
.dynamicBlackWhiteColor,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
Padding(
|
|
padding: const EdgeInsets.only(right: 5),
|
|
child: Consumer(
|
|
builder: (context, ref, child) {
|
|
int downloadCount = 0;
|
|
if (widget.downloadedChapter) {
|
|
final downloadedIds =
|
|
ref
|
|
.watch(
|
|
downloadedChapterIdsProvider,
|
|
)
|
|
.asData
|
|
?.value ??
|
|
const <int>{};
|
|
downloadCount = entry.chapters
|
|
.where(
|
|
(c) =>
|
|
c.id != null &&
|
|
downloadedIds.contains(
|
|
c.id,
|
|
),
|
|
)
|
|
.length;
|
|
}
|
|
return Row(
|
|
children: [
|
|
if (downloadCount > 0 &&
|
|
widget.downloadedChapter)
|
|
Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius:
|
|
const BorderRadius.only(
|
|
topLeft:
|
|
Radius.circular(
|
|
3,
|
|
),
|
|
bottomLeft:
|
|
Radius.circular(
|
|
3,
|
|
),
|
|
),
|
|
color: Theme.of(
|
|
context,
|
|
).secondaryHeaderColor,
|
|
),
|
|
child: Padding(
|
|
padding:
|
|
const EdgeInsets.only(
|
|
left: 3,
|
|
right: 3,
|
|
),
|
|
child: Text(
|
|
downloadCount.toString(),
|
|
),
|
|
),
|
|
),
|
|
Padding(
|
|
padding: const EdgeInsets.only(
|
|
left: 3,
|
|
),
|
|
child: Text(
|
|
entry.chapters
|
|
.where((e) => !e.isRead!)
|
|
.length
|
|
.toString(),
|
|
style: TextStyle(
|
|
color: context
|
|
.dynamicBlackWhiteColor,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
if (widget.language && entry.lang!.isNotEmpty)
|
|
Positioned(
|
|
top: 0,
|
|
right: 0,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(5),
|
|
child: Container(
|
|
color: context.themeData.cardColor,
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
borderRadius: const BorderRadius.only(
|
|
topLeft: Radius.circular(3),
|
|
bottomLeft: Radius.circular(3),
|
|
),
|
|
color: Theme.of(context).hintColor,
|
|
),
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(
|
|
left: 3,
|
|
right: 3,
|
|
),
|
|
child: Text(
|
|
entry.lang!.toUpperCase(),
|
|
style: const TextStyle(
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
if (!widget.isComfortableGrid && !widget.isCoverOnlyGrid)
|
|
BottomTextWidget(text: entry.name!),
|
|
if (widget.continueReaderBtn)
|
|
Positioned(
|
|
bottom: 0,
|
|
right: 0,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(9),
|
|
child: ContinueReaderButton(entry: entry),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
);
|
|
},
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
void _handleLongOrSecondaryTap(
|
|
bool isLongPressed,
|
|
WidgetRef ref,
|
|
Manga entry,
|
|
) {
|
|
if (!isLongPressed) {
|
|
ref.read(mangasListStateProvider.notifier).update(entry);
|
|
ref.read(isLongPressedStateProvider.notifier).update(!isLongPressed);
|
|
} else {
|
|
ref.read(mangasListStateProvider.notifier).update(entry);
|
|
}
|
|
}
|
|
}
|