Skip to content

Strange behavior of ListView with ScrollViewKeyboardDismissBehavior.onDrag #141542

@dawidope

Description

@dawidope

I found an issue with hidding keyboard on scrolling. Steps to reproduce:

  1. Prepare Scaffold with: TextField, ListView, Drawer
  2. Set keyboardDismissBehavior to ScrollViewKeyboardDismissBehavior.onDrag for ListView
  3. Tap TextField
  4. Keyboard appears
  5. Scroll ListView
  6. Keyboard disappears
  7. Open Drawer
  8. Keyboard appears

I attached video of this behavior in actual and expected results.

The code which causes it:

onNotification: (ScrollUpdateNotification notification) {
final FocusScopeNode focusScope = FocusScope.of(context);
if (notification.dragDetails != null && focusScope.hasFocus) {
focusScope.unfocus();
}
return false;
},

The explanation of this behavior is here: #54277 (comment).

Not sure if it is a bug or intended. If it is a bug I can prepare PR, there are two posibilites:

  1. Replace current code with the code from mentioned comment.
  2. Add an additional keyboardDismissBehavior which unfocus the focus in the way from mentioned comment.

The same issue is with TwoDimensionalScrollView.

Expected results

Keep keyboard closed.

after.mp4

Actual results

Keyboard opens.

bug.mp4

Code sample

Code sample
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(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      drawer: Container(
        width: 150,
        color: Colors.blue,
        child: const TextField(),
      ),
      body: Column(
        children: [
          const TextField(),
          
          Expanded(
            child: ListView.builder(
              itemCount: 100,
              keyboardDismissBehavior: ScrollViewKeyboardDismissBehavior.onDrag,
              itemBuilder: (BuildContext context, int index) {
                return Container(
                  height: 33,
                  color: index % 2 == 0 ? Colors.amber : Colors.lightGreen,
                  child: Text(index.toString()),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

Flutter Doctor output

Doctor output
[!] Flutter (Channel [user-branch], 3.18.0-18.0.pre, on Microsoft Windows [Version 10.0.22621.2861], locale pl-PL)
    ! Flutter version 3.18.0-18.0.pre on channel [user-branch] at C:\Users\Dawid\Software\flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at
      https://flutter.dev/docs/get-started/install.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 3df4e735d5 (2 weeks ago), 2023-12-29 14:07:39 -0500
    • Engine revision 9e03a57cde
    • Dart version 3.3.0 (build 3.3.0-273.0.dev)
    • DevTools version 2.31.0-dev.0
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly
      to perform update checks and upgrades.

[✓] Windows Version (Installed version of Windows is version 10 or higher)

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at C:\Users\Dawid\Software\android\
    • Platform android-34, build-tools 34.0.0
    • Java binary at: C:\Program Files\Android\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[✓] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.8.1)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.8.34316.72
    • Windows 10 SDK version 10.0.22000.0

[✓] Android Studio (version 2022.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • 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.6+0-b2043.56-10027231)

[✓] VS Code (version 1.85.1)
    • VS Code at C:\Users\Dawid\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.80.0

[✓] Connected device (4 available)
    • sdk gphone64 x86 64 (mobile) • emulator-5554 • android-x64    • Android 13 (API 33) (emulator)
    • Windows (desktop)            • windows       • windows-x64    • Microsoft Windows [Version 10.0.22621.2861]
    • Chrome (web)                 • chrome        • web-javascript • Google Chrome 120.0.6099.217
    • Edge (web)                   • edge          • web-javascript • Microsoft Edge 120.0.2210.133

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work lista: text inputEntering text in a text field or keyboard related problemsf: scrollingViewports, list views, slivers, etc.found in release: 3.16Found to occur in 3.16found in release: 3.18Found to occur in 3.18frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onteam-frameworkOwned by Framework teamtriaged-frameworkTriaged by Framework team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions