search

flutter / flutter

Flutter makes it easy and fast to build beautiful apps for mobile and beyond
https://flutter.dev
BSD 3-Clause "New" or "Revised" License
163.63k stars 26.91k forks source link

Cannot capture PanEvents for widget in NestedScrollView title #151323

Open jimmyff opened 2 weeks ago

jimmyff commented 2 weeks ago

On touch devices onPanStart does not trigger for Gesture Detector that is in a NesterScrollView's title. Attached video and minimal example code.

Video of issue: https://github.com/flutter/flutter/assets/298850/bd5cda1c-d9d1-496e-bc1e-9989da8c3383 At first you can see that vertical scroll on the circular widget is passed to the NestedScrollView - This is not desired behaviour. I then disable the browser's touch emulation and you can see the desired behaviour: Vertical drag is handled by my widget (Gesture detector and onPanStart/Update/End).

If I add onVerticalDragStart/Update/End callbacks to the GestureDetector then my widget captures the interaction -however I don't want vertical drag gesture, I want them all to be passed to pan gestures.

Minimal example:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            body: NestedScrollView(
          headerSliverBuilder: (context, innerBoxIsScrolled) => [
            SliverAppBar(
              collapsedHeight: 100,
              expandedHeight: 400,
              pinned: true,
              automaticallyImplyLeading: false,
              flexibleSpace: FlexibleSpaceBar(
                  title: GestureDetector(

                      // This does not trigger on touch devices if gesture is
                      // vertical drag.
                      onPanStart: (details) {
                        print('Got $details');
                      },
                      child: Container(
                          height: 400,
                          color: Colors.red,
                          child: const Center(
                              child: Text(
                                  'Widget that wants to capture pan events'))))),
            )
          ],
          body: ListView.builder(
            itemBuilder: (context, index) =>
                ListTile(title: Text(index.toString())),
          ),
        )));
  }
}

Thanks

danagbemava-nc commented 1 week ago

Reproducible using the code sample provided above.

flutter doctor -v ``` [!] Flutter (Channel stable, 3.22.2, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB) • Flutter version 3.22.2 on channel stable at /Users/nexus/dev/sdks/flutter ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. • Upstream repository https://github.com/flutter/flutter.git • Framework revision 761747bfc5 (4 weeks ago), 2024-06-05 22:15:13 +0200 • Engine revision edd8546116 • Dart version 3.4.3 • DevTools version 2.34.3 • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades. [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.15.2 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2024.1) • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.90.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.90.0 [✓] Connected device (5 available) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.5.1 21F90 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.5.1 21F90 • macOS (desktop) • macos • darwin-arm64 • macOS 14.4.1 23E224 darwin-arm64 • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin • macOS 14.4.1 23E224 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 126.0.6478.127 [✓] Network resources • All expected network resources are available. ! Doctor found issues in 1 category. ``` ``` [✓] Flutter (Channel master, 3.23.0-14.0.pre.145, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB) • Flutter version 3.23.0-14.0.pre.145 on channel master at /Users/nexus/dev/sdks/flutters • Upstream repository https://github.com/flutter/flutter.git • Framework revision ac74e26a70 (7 hours ago), 2024-07-04 21:46:34 -0400 • Engine revision 1f0f950ea0 • Dart version 3.5.0 (build 3.5.0-323.0.dev) • DevTools version 2.37.0 [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.15.2 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2024.1) • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents • Flutter plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/9212-flutter • Dart plugin can be installed from: 🔨 https://plugins.jetbrains.com/plugin/6351-dart • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.90.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.90.0 [✓] Connected device (5 available) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.5.1 21F90 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.5.1 21F90 • macOS (desktop) • macos • darwin-arm64 • macOS 14.4.1 23E224 darwin-arm64 • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin • macOS 14.4.1 23E224 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 126.0.6478.127 [✓] Network resources • All expected network resources are available. • No issues found! ```