Crop bookmark screenshot, filter

violet/lib/pages/bookmark/crop_bookmark.dart

@@ -4,6 +4,7 @@
 import 'dart:async';
 import 'dart:convert';
 import 'dart:io';
+import 'dart:ui';
 
 import 'package:archive/archive_io.dart';
 import 'package:collection/collection.dart';
@@ -12,16 +13,20 @@ import 'package:extended_image/extended_image.dart';
 import 'package:firebase_analytics/firebase_analytics.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter/services.dart';
+import 'package:flutter/rendering.dart';
 import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
 import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
 import 'package:path_provider/path_provider.dart';
+import 'package:provider/provider.dart';
 import 'package:pull_down_button/pull_down_button.dart';
+import 'package:violet/database/query.dart';
 import 'package:violet/database/user/bookmark.dart';
 import 'package:violet/log/log.dart';
 import 'package:violet/other/dialogs.dart';
 import 'package:violet/pages/common/toast.dart';
 import 'package:violet/pages/common/utils.dart';
+import 'package:violet/pages/segment/filter_page.dart';
+import 'package:violet/pages/segment/filter_page_controller.dart';
 import 'package:violet/pages/segment/platform_navigator.dart';
 import 'package:violet/settings/settings.dart';
 import 'package:violet/util/evict_image_urls.dart';
@@ -42,6 +47,9 @@ class _CropBookmarkPageState extends State<CropBookmarkPage> {
   final ValueNotifier<bool> showOverlay =
       ValueNotifier(Settings.cropBookmarkShowOverlay.value);
   bool sortDesc = Settings.cropBookmarkSortDesc.value;
+  final FilterController _filterController =
+      FilterController(heroKey: 'cropbookmark');
+  List<int> _filterIds = [];
 
   List<String>? imagesUrlForEvict;
 
@@ -59,6 +67,9 @@ class _CropBookmarkPageState extends State<CropBookmarkPage> {
     evictImageUrls(imagesUrlForEvict);
   }
 
+  bool _isCapturing = false;
+  final GlobalKey _captureKey = GlobalKey();
+
   @override
   Widget build(BuildContext context) {
     final height = MediaQuery.of(context).size.height;
@@ -68,19 +79,20 @@ class _CropBookmarkPageState extends State<CropBookmarkPage> {
           ? Future.value(widget.bookmarks)
           : Bookmark.getInstance().then((value) => value.getCropImages()),
       builder: (context, snapshot) {
-        if (!snapshot.hasData) {
-          return Container();
-        }
-
+        if (!snapshot.hasData) return Container();
         var imgs = snapshot.data!;
-        if (sortDesc) {
-          imgs = imgs.reversed.toList();
+        if (_filterIds.isNotEmpty) {
+          imgs = imgs.where((e) => _filterIds.contains(e.article())).toList();
         }
-
+        if (sortDesc) imgs = imgs.reversed.toList();
         imagesUrlForEvict = List<String>.filled(imgs.length, '');
 
-        return MasonryGridView.count(
-          physics: const BouncingScrollPhysics(),
+        final masonryGrid = MasonryGridView.count(
+          key: _isCapturing ? null : PageStorageKey('lazyGrid'), // 스크롤 위치 유지
+          physics: _isCapturing
+              ? const NeverScrollableScrollPhysics()
+              : const BouncingScrollPhysics(),
+          shrinkWrap: _isCapturing, // 전체 렌더링 여부
           crossAxisCount: columnCount.value,
           mainAxisSpacing: 6.0 / columnCount.value,
           crossAxisSpacing: 6.0 / columnCount.value,
@@ -96,36 +108,51 @@ class _CropBookmarkPageState extends State<CropBookmarkPage> {
               index,
               e.article(),
               e.page(),
-              Rect.fromLTRB(
-                area[0],
-                area[1],
-                area[2],
-                area[3],
-              ),
+              Rect.fromLTRB(area[0], area[1], area[2], area[3]),
               e.aspectRatio(),
             );
           },
         );
+
+        if (_isCapturing) {
+          return SingleChildScrollView(
+            child: RepaintBoundary(
+              key: _captureKey,
+              child: masonryGrid,
+            ),
+          );
+        } else {
+          return masonryGrid;
+        }
       },
     );
 
     return CupertinoPageScaffold(
       child: NestedScrollView(
-        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
-          return <Widget>[
-            CupertinoSliverNavigationBar(
-              leading: const CupertinoTheme(
-                data: CupertinoThemeData(brightness: Brightness.light),
-                child: Icon(MdiIcons.crop),
-              ),
-              largeTitle: const Text('Crop Bookmark'),
-              trailing: CupertinoTheme(
-                data: const CupertinoThemeData(brightness: Brightness.light),
-                child: settingMenu(),
-              ),
+        headerSliverBuilder: (context, _) => [
+          CupertinoSliverNavigationBar(
+            largeTitle: const Text('Crop Bookmark'),
+            trailing: Row(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                CupertinoButton(
+                  padding: EdgeInsets.zero,
+                  onPressed: () => _filter(context),
+                  child: const Icon(MdiIcons.filter),
+                ),
+                if (_isCapturing)
+                  const CupertinoActivityIndicator()
+                else
+                  CupertinoButton(
+                    padding: EdgeInsets.zero,
+                    onPressed: _startCapture,
+                    child: const Icon(CupertinoIcons.camera),
+                  ),
+                settingMenu(),
+              ],
             ),
-          ];
-        },
+          ),
+        ],
         body: listView,
       ),
     );
@@ -370,6 +397,52 @@ class _CropBookmarkPageState extends State<CropBookmarkPage> {
       ),
     );
   }
+
+  Future<void> _filter(BuildContext context) async {
+    final bookmarks = widget.bookmarks ??
+        await (await Bookmark.getInstance()).getCropImages();
+    final ids = bookmarks.map((e) => e.article()).toList();
+    final queryResults = await QueryManager.queryIds(ids);
+
+    if (!context.mounted) return;
+    await PlatformNavigator.navigateSlide(
+      context,
+      Provider<FilterController>.value(
+        value: _filterController,
+        child: FilterPage(
+          queryResult: queryResults,
+        ),
+      ),
+    );
+
+    final filtered = _filterController.applyFilter(queryResults);
+    setState(() {
+      _filterIds = filtered.map((e) => e.id()).toList();
+    });
+  }
+
+  void _startCapture() async {
+    setState(() => _isCapturing = true);
+
+    // 한 프레임 기다렸다가 렌더링 완료 후 캡처
+    await Future.delayed(Duration(milliseconds: 10000));
+    await Future.delayed(Duration.zero); // flutter 프레임 캐치
+
+    RenderRepaintBoundary boundary =
+        _captureKey.currentContext!.findRenderObject() as RenderRepaintBoundary;
+
+    final image = await boundary.toImage(pixelRatio: 10.0);
+    final byteData = await image.toByteData(format: ImageByteFormat.png);
+    if (byteData == null) return;
+
+    setState(() => _isCapturing = false);
+
+    final pngBytes = byteData.buffer.asUint8List();
+
+    final directory = await getApplicationDocumentsDirectory();
+    final file = File('${directory.path}/masonry_capture.png');
+    await file.writeAsBytes(pngBytes);
+  }
 }
 
 double calculateCropRawAspectRatio(

violet/lib/pages/segment/filter_page.dart

@@ -1,6 +1,8 @@
 // This source code is a part of Project Violet.
 // Copyright (C) 2020-2024. violet-team. Licensed under the Apache-2.0 License.
 
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:html_unescape/html_unescape_small.dart';
 import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
@@ -256,10 +258,13 @@ class _FilterPageState extends State<FilterPage> {
           .toList();
     }
 
+    final spacing = Platform.isWindows ? -7.0 : -7.0;
+    final runSpacing = Platform.isWindows ? 2.0 : -13.0;
+
     return Wrap(
         // alignment: WrapAlignment.center,
-        spacing: -7.0,
-        runSpacing: -13.0,
+        spacing: spacing,
+        runSpacing: runSpacing,
         children: tags.take(100).map(
           (element) {
             return _Chip(