✨ Add keepScrollOffset feature for the AssetPickerBuilderDelegate (#172)

Co-authored-by: Yaniv Shaked <[email protected]>

Author: AlexV525

example/lib/constants/picker_method.dart

@@ -248,6 +248,32 @@ class PickMethod {
     );
   }
 
+  factory PickMethod.keepScrollOffset(
+    DefaultAssetPickerProvider provider,
+    DefaultAssetPickerBuilderDelegate Function() delegate,
+    Function(PermissionState state) onPermission,
+  ) {
+    return PickMethod(
+      icon: '💾',
+      name: 'Keep scroll offset',
+      description: 'Pick assets from same scroll position.',
+      method: (BuildContext context, List<AssetEntity> assets) async {
+        final PermissionState _ps =
+            await PhotoManager.requestPermissionExtend();
+        if (_ps != PermissionState.authorized &&
+            _ps != PermissionState.limited) {
+          throw StateError('Permission state error with $_ps.');
+        }
+        onPermission(_ps);
+        return AssetPicker.pickAssetsWithDelegate(
+          context,
+          provider: provider,
+          delegate: delegate(),
+        );
+      },
+    );
+  }
+
   final String icon;
   final String name;
   final String description;

example/lib/pages/multi_assets_page.dart

@@ -27,6 +27,13 @@ class _MultiAssetsPageState extends State<MultiAssetsPage>
 
   ThemeData get currentTheme => context.themeData;
 
+  /// These fields are for the keep scroll position feature.
+  late final DefaultAssetPickerProvider _keepScrollProvider =
+      DefaultAssetPickerProvider(
+    selectedAssets: assets,
+  );
+  DefaultAssetPickerBuilderDelegate? _keepScrollDelegate;
+
   List<PickMethod> get pickMethods {
     return <PickMethod>[
       PickMethod.image(maxAssetsCount),
@@ -55,6 +62,17 @@ class _MultiAssetsPageState extends State<MultiAssetsPage>
         },
       ),
       PickMethod.noPreview(maxAssetsCount),
+      PickMethod.keepScrollOffset(
+        _keepScrollProvider,
+        () => _keepScrollDelegate!,
+        (PermissionState state) {
+          _keepScrollDelegate ??= DefaultAssetPickerBuilderDelegate(
+            provider: _keepScrollProvider,
+            initialPermission: state,
+            keepScrollOffset: true,
+          );
+        },
+      ),
       PickMethod(
         icon: '🎚',
         name: 'Custom image preview thumb size',

example/lib/pages/single_assets_page.dart

@@ -27,6 +27,13 @@ class _SingleAssetPageState extends State<SingleAssetPage>
 
   ThemeData get currentTheme => context.themeData;
 
+  /// These fields are for the keep scroll position feature.
+  late final DefaultAssetPickerProvider _keepScrollProvider =
+      DefaultAssetPickerProvider(
+    selectedAssets: assets,
+  );
+  DefaultAssetPickerBuilderDelegate? _keepScrollDelegate;
+
   List<PickMethod> get pickMethods {
     return <PickMethod>[
       PickMethod.image(maxAssetsCount),
@@ -43,6 +50,17 @@ class _SingleAssetPageState extends State<SingleAssetPage>
       PickMethod.customFilterOptions(maxAssetsCount),
       PickMethod.prependItem(maxAssetsCount),
       PickMethod.noPreview(maxAssetsCount),
+      PickMethod.keepScrollOffset(
+        _keepScrollProvider,
+        () => _keepScrollDelegate!,
+        (PermissionState state) {
+          _keepScrollDelegate ??= DefaultAssetPickerBuilderDelegate(
+            provider: _keepScrollProvider,
+            initialPermission: state,
+            keepScrollOffset: true,
+          );
+        },
+      ),
     ];
   }
 

lib/src/constants/constants.dart

@@ -7,7 +7,8 @@ import 'dart:developer';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/widgets.dart';
 
-import 'constants.dart';
+import '../delegates/assets_picker_text_delegate.dart';
+import '../delegates/sort_path_delegate.dart';
 
 export 'package:photo_manager/photo_manager.dart';
 export 'package:provider/provider.dart';
@@ -45,6 +46,12 @@ class Constants {
   static SortPathDelegate<dynamic> sortPathDelegate =
       SortPathDelegate.common;
 
+  /// The last scroll position where the picker scrolled.
+  ///
+  /// See also:
+  ///  * [AssetPickerBuilderDelegate.keepScrollOffset]
+  static ScrollPosition? scrollPosition;
+
   static const int defaultGridThumbSize = 200;
 }
 

lib/src/delegates/asset_picker_builder_delegate.dart

@@ -9,6 +9,7 @@ import 'dart:ui' as ui;
 
 import 'package:flutter/material.dart';
 import 'package:flutter/gestures.dart';
+import 'package:flutter/scheduler.dart';
 import 'package:flutter/services.dart';
 
 import '../constants/constants.dart';
@@ -38,13 +39,18 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
     this.specialItemBuilder,
     this.loadingIndicatorBuilder,
     this.allowSpecialItemWhenEmpty = false,
+    this.keepScrollOffset = false,
   })  : assert(
           pickerTheme == null || themeColor == null,
           'Theme and theme color cannot be set at the same time.',
         ),
         themeColor =
             pickerTheme?.colorScheme.secondary ?? themeColor ?? C.themeColor {
     Constants.textDelegate = textDelegate ?? AssetsPickerTextDelegate();
+    // Add the listener if [keepScrollOffset] is true.
+    if (keepScrollOffset) {
+      gridScrollController.addListener(keepScrollOffsetListener);
+    }
   }
 
   /// [ChangeNotifier] for asset picker.
@@ -89,6 +95,10 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
   /// 当没有资源时是否显示自定义item
   final bool allowSpecialItemWhenEmpty;
 
+  /// Whether the picker should save the scroll offset between pushes and pops.
+  /// 选择器是否可以从同样的位置开始选择
+  final bool keepScrollOffset;
+
   /// The [ScrollController] for the preview grid.
   final ScrollController gridScrollController = ScrollController();
 
@@ -163,9 +173,24 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
   /// 当前的权限是否为受限
   bool get isPermissionLimited => permission.value == PermissionState.limited;
 
+  /// The listener to track the scroll position of the [gridScrollController]
+  /// if [keepScrollOffset] is true.
+  /// 当 [keepScrollOffset] 为 true 时，跟踪 [gridScrollController] 位置的监听。
+  void keepScrollOffsetListener() {
+    if (gridScrollController.hasClients) {
+      Constants.scrollPosition = gridScrollController.position;
+    }
+  }
+
   /// Keep a dispose method to sync with [State].
   /// 保留一个 dispose 方法与 [State] 同步。
+  ///
+  /// Be aware that the method will do nothing when [keepScrollOffset] is true.
+  /// 注意当 [keepScrollOffset] 为 true 时方法不会进行释放。
   void dispose() {
+    if (keepScrollOffset) {
+      return;
+    }
     gridScrollController.dispose();
     permission.dispose();
     permissionOverlayHidden.dispose();
@@ -559,6 +584,15 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
   /// Yes, the build method.
   /// 没错，是它是它就是它，我们亲爱的 build 方法~
   Widget build(BuildContext context) {
+    // Schedule the scroll position's restoration callback if this feature
+    // is enabled and offsets are different.
+    if (keepScrollOffset &&
+        Constants.scrollPosition != null &&
+        !gridScrollController.hasClients) {
+      SchedulerBinding.instance!.addPostFrameCallback((_) {
+        gridScrollController.jumpTo(Constants.scrollPosition!.pixels);
+      });
+    }
     return AnnotatedRegion<SystemUiOverlayStyle>(
       value: overlayStyle,
       child: Theme(
@@ -594,6 +628,7 @@ class DefaultAssetPickerBuilderDelegate
     WidgetBuilder? specialItemBuilder,
     IndicatorBuilder? loadingIndicatorBuilder,
     bool allowSpecialItemWhenEmpty = false,
+    bool keepScrollOffset = false,
     this.gridThumbSize = Constants.defaultGridThumbSize,
     this.previewThumbSize,
     this.specialPickerType,
@@ -612,6 +647,7 @@ class DefaultAssetPickerBuilderDelegate
           specialItemBuilder: specialItemBuilder,
           loadingIndicatorBuilder: loadingIndicatorBuilder,
           allowSpecialItemWhenEmpty: allowSpecialItemWhenEmpty,
+          keepScrollOffset: keepScrollOffset,
         );
 
   /// Thumbnail size in the grid.
@@ -1121,7 +1157,7 @@ class DefaultAssetPickerBuilderDelegate
           ),
           onPressed: () {
             if (provider.isSelectedNotEmpty) {
-              Navigator.of(context).pop(provider.selectedAssets);
+              Navigator.of(context).maybePop(provider.selectedAssets);
             }
           },
           materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
@@ -1512,7 +1548,7 @@ class DefaultAssetPickerBuilderDelegate
               maxAssets: provider.maxAssets,
             );
             if (result != null) {
-              Navigator.of(context).pop(result);
+              Navigator.of(context).maybePop(result);
             }
           },
           child: Selector<DefaultAssetPickerProvider, String>(
@@ -1599,7 +1635,7 @@ class DefaultAssetPickerBuilderDelegate
             }
             provider.selectAsset(asset);
             if (isSingleAssetMode && !isPreviewEnabled) {
-              Navigator.of(context).pop(provider.selectedAssets);
+              Navigator.of(context).maybePop(provider.selectedAssets);
             }
           },
           child: Container(
@@ -1680,7 +1716,7 @@ class DefaultAssetPickerBuilderDelegate
             maxAssets: provider.maxAssets,
           );
           if (result != null) {
-            Navigator.of(context).pop(result);
+            Navigator.of(context).maybePop(result);
           }
         },
         child: Selector<DefaultAssetPickerProvider, List<AssetEntity>>(

lib/src/widget/asset_picker.dart

@@ -143,8 +143,10 @@ class AssetPicker<Asset, Path> extends StatefulWidget {
 
     final Widget picker = ChangeNotifierProvider<PickerProvider>.value(
       value: provider,
-      child:
-          AssetPicker<Asset, Path>(key: Constants.pickerKey, builder: delegate),
+      child: AssetPicker<Asset, Path>(
+        key: Constants.pickerKey,
+        builder: delegate,
+      ),
     );
     final List<Asset>? result = await Navigator.of(
       context,