Remove custom scroll behavior, allow scroll physics customization, fix double scroll effects and double scroll bars

coffee_maker/lib/main.dart

@@ -35,6 +35,7 @@ class _DemoAppState extends State<DemoApp> {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
+      scrollBehavior: const CustomScrollBehavior(),
       theme: ThemeData(
         primaryColor: DemoAppColors.blue,
         useMaterial3: true,
@@ -113,14 +114,11 @@ class _DemoAppState extends State<DemoApp> {
         ),
       ),
       debugShowCheckedModeBanner: false,
-      home: ScrollConfiguration(
-        behavior: const DragScrollBehavior(),
-        child: HomeScreen(
-          groupedCoffeeOrders:
-              GroupedCoffeeOrders.fromCoffeeOrders(mockCoffeeOrders),
-          isStoreOnline: true,
-          isGridOverlayVisible: false,
-        ),
+      home: HomeScreen(
+        groupedCoffeeOrders:
+            GroupedCoffeeOrders.fromCoffeeOrders(mockCoffeeOrders),
+        isStoreOnline: true,
+        isGridOverlayVisible: false,
       ),
     );
   }

demo_ui_components/lib/demo_ui_components.dart

@@ -11,4 +11,4 @@ export 'src/text/modal_sheet_content_text.dart';
 export 'src/text/modal_sheet_subtitle.dart';
 export 'src/text/modal_sheet_title.dart';
 export 'src/text/modal_sheet_top_bar_title.dart';
-export 'src/utils/drag_scroll_behavior.dart';
+export 'src/utils/custom_scroll_behavior.dart';

demo_ui_components/lib/src/utils/custom_scroll_behavior.dart

@@ -0,0 +1,48 @@
+import 'dart:ui';
+
+import 'package:flutter/material.dart';
+
+class CustomScrollBehavior extends ScrollBehavior {
+  const CustomScrollBehavior({this.androidSdkVersion}) : super();
+  final int? androidSdkVersion;
+
+  // Override behavior methods and getters like dragDevices
+  @override
+  Set<PointerDeviceKind> get dragDevices => <PointerDeviceKind>{
+        PointerDeviceKind.touch,
+        PointerDeviceKind.mouse,
+        PointerDeviceKind.trackpad,
+        PointerDeviceKind.stylus,
+      };
+
+  @override
+  Widget buildOverscrollIndicator(
+    BuildContext context,
+    Widget child,
+    ScrollableDetails details,
+  ) {
+    final glowingOverscrollIndicator = GlowingOverscrollIndicator(
+      axisDirection: details.direction,
+      color: Theme.of(context).colorScheme.primary,
+      child: child,
+    );
+    final androidSdkVersion = this.androidSdkVersion;
+    switch (getPlatform(context)) {
+      case TargetPlatform.iOS:
+      case TargetPlatform.linux:
+      case TargetPlatform.macOS:
+      case TargetPlatform.windows:
+        return child;
+      case TargetPlatform.android:
+        if (androidSdkVersion != null && androidSdkVersion > 30) {
+          return StretchingOverscrollIndicator(
+            axisDirection: details.direction,
+            child: child,
+          );
+        }
+        return glowingOverscrollIndicator;
+      case TargetPlatform.fuchsia:
+        return glowingOverscrollIndicator;
+    }
+  }
+}

example/lib/main.dart

@@ -158,6 +158,7 @@ Pagination involves a sequence of screens the user navigates sequentially. We ch
             heroImageHeight: _heroImageHeight,
             topBarShadowColor: _lightThemeShadowColor,
             modalBarrierColor: Colors.black54,
+            mainContentScrollPhysics: ClampingScrollPhysics(),
           ),
         ],
       ),
@@ -169,6 +170,7 @@ Pagination involves a sequence of screens the user navigates sequentially. We ch
             sabGradientColor: _darkSabGradientColor,
             dialogShape: BeveledRectangleBorder(),
             bottomSheetShape: BeveledRectangleBorder(),
+            mainContentScrollPhysics: ClampingScrollPhysics(),
           ),
         ],
       ),

lib/src/content/components/main_content/wolt_modal_sheet_main_content.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:wolt_modal_sheet/src/content/components/main_content/wolt_modal_sheet_hero_image.dart';
 import 'package:wolt_modal_sheet/src/theme/wolt_modal_sheet_default_theme_data.dart';
-import 'package:wolt_modal_sheet/src/utils/drag_scroll_behavior.dart';
 import 'package:wolt_modal_sheet/wolt_modal_sheet.dart';
 
 /// The main content widget within the scrollable modal sheet.
@@ -23,8 +22,7 @@ class WoltModalSheetMainContent extends StatefulWidget {
   }) : super(key: key);
 
   @override
-  State<WoltModalSheetMainContent> createState() =>
-      _WoltModalSheetMainContentState();
+  State<WoltModalSheetMainContent> createState() => _WoltModalSheetMainContentState();
 }
 
 class _WoltModalSheetMainContentState extends State<WoltModalSheetMainContent> {
@@ -34,8 +32,7 @@ class _WoltModalSheetMainContentState extends State<WoltModalSheetMainContent> {
   void initState() {
     super.initState();
     scrollController = widget.page.scrollController ??
-        ScrollController(
-            initialScrollOffset: widget.currentScrollPosition.value);
+        ScrollController(initialScrollOffset: widget.currentScrollPosition.value);
   }
 
   @override
@@ -45,24 +42,18 @@ class _WoltModalSheetMainContentState extends State<WoltModalSheetMainContent> {
     final page = widget.page;
     final heroImageHeight = page.heroImage == null
         ? 0.0
-        : (page.heroImageHeight ??
-            themeData?.heroImageHeight ??
-            defaultThemeData.heroImageHeight);
-    final pageHasTopBarLayer = page.hasTopBarLayer ??
-        themeData?.hasTopBarLayer ??
-        defaultThemeData.hasTopBarLayer;
-    final navBarHeight = page.navBarHeight ??
-        themeData?.navBarHeight ??
-        defaultThemeData.navBarHeight;
-    final topBarHeight = pageHasTopBarLayer ||
-            page.leadingNavBarWidget != null ||
-            page.trailingNavBarWidget != null
-        ? navBarHeight
-        : 0.0;
+        : (page.heroImageHeight ?? themeData?.heroImageHeight ?? defaultThemeData.heroImageHeight);
+    final pageHasTopBarLayer =
+        page.hasTopBarLayer ?? themeData?.hasTopBarLayer ?? defaultThemeData.hasTopBarLayer;
+    final navBarHeight =
+        page.navBarHeight ?? themeData?.navBarHeight ?? defaultThemeData.navBarHeight;
+    final topBarHeight =
+        pageHasTopBarLayer || page.leadingNavBarWidget != null || page.trailingNavBarWidget != null
+            ? navBarHeight
+            : 0.0;
     final scrollView = CustomScrollView(
-      scrollBehavior: const DragScrollBehavior(),
       shrinkWrap: true,
-      physics: const ClampingScrollPhysics(),
+      physics: themeData?.mainContentScrollPhysics ?? defaultThemeData.mainContentScrollPhysics,
       controller: scrollController,
       slivers: [
         SliverList(
@@ -98,12 +89,10 @@ class _WoltModalSheetMainContentState extends State<WoltModalSheetMainContent> {
     );
     return NotificationListener<ScrollNotification>(
       onNotification: (scrollNotification) {
-        final isVerticalScrollNotification =
-            scrollNotification is ScrollUpdateNotification &&
-                scrollNotification.metrics.axis == Axis.vertical;
+        final isVerticalScrollNotification = scrollNotification is ScrollUpdateNotification &&
+            scrollNotification.metrics.axis == Axis.vertical;
         if (isVerticalScrollNotification) {
-          widget.currentScrollPosition.value =
-              scrollNotification.metrics.pixels;
+          widget.currentScrollPosition.value = scrollNotification.metrics.pixels;
         }
         return false;
       },

lib/src/theme/wolt_modal_sheet_default_theme_data.dart

@@ -130,4 +130,7 @@ class WoltModalSheetDefaultThemeData extends WoltModalSheetThemeData {
   /// If null, [WoltModalSheet] uses [Clip.none].
   @override
   Clip get clipBehavior => Clip.antiAlias;
+
+  @override
+  ScrollPhysics? get mainContentScrollPhysics => null;
 }

lib/src/theme/wolt_modal_sheet_theme_data.dart

@@ -31,6 +31,7 @@ class WoltModalSheetThemeData extends ThemeExtension<WoltModalSheetThemeData> {
     this.surfaceTintColor,
     this.clipBehavior,
     this.shadowColor,
+    this.mainContentScrollPhysics,
   });
 
   /// Overrides the default value for surfaceTintColor.
@@ -128,6 +129,9 @@ class WoltModalSheetThemeData extends ThemeExtension<WoltModalSheetThemeData> {
   /// If null, [WoltModalSheet] uses [Clip.antiAlias].
   final Clip? clipBehavior;
 
+  /// The default value for [WoltModalSheet] scrollPhysics in the main content.
+  final ScrollPhysics? mainContentScrollPhysics;
+
   @override
   WoltModalSheetThemeData copyWith({
     Color? backgroundColor,
@@ -153,6 +157,7 @@ class WoltModalSheetThemeData extends ThemeExtension<WoltModalSheetThemeData> {
     Color? surfaceTintColor,
     Color? shadowColor,
     Clip? clipBehavior,
+    ScrollPhysics? mainContentScrollPhysics,
   }) {
     return WoltModalSheetThemeData(
       backgroundColor: backgroundColor ?? this.backgroundColor,
@@ -179,6 +184,7 @@ class WoltModalSheetThemeData extends ThemeExtension<WoltModalSheetThemeData> {
       surfaceTintColor: surfaceTintColor ?? this.surfaceTintColor,
       shadowColor: shadowColor ?? this.shadowColor,
       clipBehavior: clipBehavior ?? this.clipBehavior,
+      mainContentScrollPhysics: mainContentScrollPhysics ?? this.mainContentScrollPhysics,
     );
   }
 
@@ -216,6 +222,7 @@ class WoltModalSheetThemeData extends ThemeExtension<WoltModalSheetThemeData> {
       surfaceTintColor: Color.lerp(surfaceTintColor, other.surfaceTintColor, t),
       shadowColor: Color.lerp(shadowColor, other.shadowColor, t),
       clipBehavior: t < 0.5 ? clipBehavior : other.clipBehavior,
+      mainContentScrollPhysics: t < 0.5 ? mainContentScrollPhysics : other.mainContentScrollPhysics,
     );
   }
 }

melos.yaml

@@ -18,5 +18,9 @@ command:
 scripts:
   analyze:
     exec: dart analyze .
+    # Uncomment to use with FVM :
+    # exec: fvm flutter analyze .
   format:
     exec: dart format --set-exit-if-changed .
+    # Uncomment to use with FVM :
+    # exec: fvm dart format --set-exit-if-changed .

playground/android/app/build.gradle

@@ -47,7 +47,7 @@ android {
         applicationId "com.wolt_modal_sheet.playground.playground"
         // You can update the following values to match your application needs.
         // For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-gradle-build-configuration.
-        minSdkVersion flutter.minSdkVersion
+        minSdkVersion 19
         targetSdkVersion flutter.targetSdkVersion
         versionCode flutterVersionCode.toInteger()
         versionName flutterVersionName

playground/ios/Flutter/Debug.xcconfig

@@ -1 +1,2 @@
+#include? "Pods/Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig"
 #include "Generated.xcconfig"