Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Giving focus to a text field ignores a Scaffold bottomSheet, leading to the text field not being visible #123597

Open
jacob1710 opened this issue Mar 28, 2023 · 2 comments
Labels
f: focus Focus traversal, gaining or losing focus f: scrolling Viewports, list views, slivers, etc. found in release: 3.7 Found to occur in 3.7 found in release: 3.9 Found to occur in 3.9 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on P2 Important issues not at the top of the work list team-framework Owned by Framework team triaged-framework Triaged by Framework team

Comments

@jacob1710
Copy link

jacob1710 commented Mar 28, 2023

Steps to Reproduce

  1. Execute flutter run on the code sample
  2. Use the "Next" Text Button to traverse the TextFields until the point where the scroll view is scrolled to make the next TextField visible due to the on screen keyboard hiding the next TextField. This usually happens around the 10th field.

Expected results:
The bottomSheet is taken to account, and the view is scrolled so the TextField is just above the bottomSheet, meaning it is visible when focused.

Actual results:
The view is scrolled so the text field is above the keyboard, but below the bottomSheet, meaning it is not visible.

Code sample

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

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomSheet: Container(
        height: 50,
        width: double.infinity,
        color: Colors.black,
        child: Focus(
          descendantsAreFocusable: false,
          canRequestFocus: false,
          child: TextButton(
            onPressed: () {
              FocusScope.of(context).nextFocus();
            },
            child: Text("Next"),
          ),
        ),
      ),
      body: ListView(
        children: [
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
        ],
      ),
    );
  }
}
Logs
[ +135 ms] com.example.testFocusNode: 30738
[        ] Waiting for observatory port to be available...
[ +448 ms] Observatory URL on device: http://127.0.0.1:49718/PkJD9dX7ZOk=/
[   +4 ms] Caching compiled dill
[  +56 ms] Connecting to service protocol: http://127.0.0.1:49718/PkJD9dX7ZOk=/
[  +73 ms] Launching a Dart Developer Service (DDS) instance at http://127.0.0.1:0, connecting to VM service at http://127.0.0.1:49718/PkJD9dX7ZOk=/.
[  +38 ms] DDS is listening at http://127.0.0.1:49721/FtEjUbnP4ME=/.
[  +32 ms] Successfully connected to service protocol: http://127.0.0.1:49718/PkJD9dX7ZOk=/
[  +17 ms] DevFS: Creating new filesystem on the device (null)
[  +10 ms] DevFS: Created new filesystem on the device (file:///Users/jacobscase/Library/Developer/CoreSimulator/Devices/B66C37DF-F54E-4324-A378-110B648F74C3/data/Containers/Data/Application/CA0C7DA0-8681-40AD-8850-C9564D0D870E/tmp/test_focus_node9Hii21/test_focus_node/)
[   +1 ms] Updating assets
Debug service listening on ws://127.0.0.1:49721/FtEjUbnP4ME=/ws
Syncing files to device iPhone 14 Pro...
[  +84 ms] Compiling dart to kernel with 0 updated files
[        ] Processing bundle.
[        ] <- recompile package:test_focus_node/main.dart 76869175-1558-456f-a4dc-9930edbe551e
[        ] <- 76869175-1558-456f-a4dc-9930edbe551e
[        ] Bundle processing done.
[  +59 ms] Updating files.
[        ] DevFS: Sync finished
[        ] Synced 0.0MB.
[        ] <- accept
[   +1 ms] Connected to _flutterView/0x12b00cc20.
 % flutter analyze
Analyzing test_focus_node...                                            
No issues found! (ran in 0.9s)
[!] Flutter (Channel stable, 3.7.8, on macOS 13.2.1 22D68 darwin-arm64, locale en-GB)
    • Flutter version 3.7.8 on channel stable at /Users/jacobscase/flutter
    ! Warning: `dart` on your path resolves to /opt/homebrew/Cellar/dart/2.19.4/libexec/bin/dart, which is not inside your current Flutter SDK checkout at
      /Users/jacobscase/flutter. Consider adding /Users/jacobscase/flutter/bin to the front of your path.
• Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 90c64ed42b (7 days ago), 2023-03-21 11:27:08 -0500
    • Engine revision 9aa7816315
    • Dart version 2.19.5
    • DevTools version 2.20.1
    • 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 33.0.0)
    • Android SDK at /Users/jacobscase/Library/Android/sdk
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for more details.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14C18
    • CocoaPods version 1.12.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.1)
    • Android Studio at /Users/jacobscase/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/221.6008.13.2211.9514443/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 11.0.15+0-b2043.56-8887301)

[✓] Android Studio (version 2022.1)
    • Android Studio at /Users/jacobscase/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/221.6008.13.2211.9619390/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 11.0.15+0-b2043.56-8887301)

[✓] VS Code (version 1.76.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.60.0

[✓] Connected device (4 available)
    • SM G780F (mobile)      • RF8N932JNCY                          • android-arm64  • Android 13 (API 33)
    • iPhone 14 Pro (mobile) • B66C37DF-F54E-4324-A378-110B648F74C3 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-16-2 (simulator)
    • macOS (desktop)        • macos                                • darwin-arm64   • macOS 13.2.1 22D68 darwin-arm64
    • Chrome (web)           • chrome                               • web-javascript • Google Chrome 111.0.5563.110

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 2 categories.

Simulator.Screen.Recording.-.iPhone.14.Pro.-.2023-03-28.at.13.43.53.mp4
@exaby73 exaby73 added the in triage Presently being triaged by the triage team label Mar 28, 2023
@exaby73
Copy link
Member

exaby73 commented Mar 28, 2023

Triage report

I can reproduce this issue with Master (3.9.0-18.0.pre.34).

Code Sample (Same as OP)
void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomSheet: Container(
        height: 50,
        width: double.infinity,
        color: Colors.black,
        child: Focus(
          descendantsAreFocusable: false,
          canRequestFocus: false,
          child: TextButton(
            onPressed: () {
              FocusScope.of(context).nextFocus();
            },
            child: Text("Next"),
          ),
        ),
      ),
      body: ListView(
        children: [
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
          TextField(),
        ],
      ),
    );
  }
}
flutter doctor -v (Master)
[!] Flutter (Channel master, 3.9.0-18.0.pre.34, on macOS 13.2.1 22D68 darwin-arm64, locale en-US)
    • Flutter version 3.9.0-18.0.pre.34 on channel master at /Users/nabeelparkar/fvm/versions/master
    ! Warning: `dart` on your path resolves to /opt/homebrew/Cellar/dart/2.19.5/libexec/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nabeelparkar/fvm/versions/master. Consider adding /Users/nabeelparkar/fvm/versions/master/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 0300cfa603 (84 minutes ago), 2023-03-27 23:31:11 -0700
    • Engine revision db8da7fb80
    • Dart version 3.0.0 (build 3.0.0-374.0.dev)
    • DevTools version 2.22.2
    • 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 33.0.0)
    • Android SDK at /Users/nabeelparkar/Library/Android/sdk/
    • Platform android-33, build-tools 33.0.0
    • ANDROID_SDK_ROOT = /Users/nabeelparkar/Library/Android/sdk/
    • Java binary at: /Users/nabeelparkar/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/221.6008.13.2211.9619390/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 14C18
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • CHROME_EXECUTABLE = /Applications/Brave Browser.app/Contents/MacOS/Brave Browser

[✓] Android Studio (version 2022.1)
    • Android Studio at /Users/nabeelparkar/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/221.6008.13.2211.9619390/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 11.0.15+0-b2043.56-8887301)

[✓] Android Studio (version 2022.1)
    • Android Studio at /Users/nabeelparkar/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/221.6008.13.2211.9477386/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 11.0.15+0-b2043.56-8887301)

[✓] VS Code (version 1.76.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.60.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.2.1 22D68 darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Brave Browser 111.1.49.128

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

! Doctor found issues in 1 category.

@exaby73 exaby73 added framework flutter/packages/flutter repository. See also f: labels. f: focus Focus traversal, gaining or losing focus has reproducible steps The issue has been confirmed reproducible and is ready to work on found in release: 3.7 Found to occur in 3.7 found in release: 3.9 Found to occur in 3.9 f: scrolling Viewports, list views, slivers, etc. and removed in triage Presently being triaged by the triage team labels Mar 28, 2023
@goderbauer goderbauer added the P2 Important issues not at the top of the work list label Mar 28, 2023
@flutter-triage-bot flutter-triage-bot bot added team-framework Owned by Framework team triaged-framework Triaged by Framework team labels Jul 8, 2023
@StephenWithPH
Copy link

I suspect the same underlying problem is at play. See #69676 (comment) for a link to a workaround.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
f: focus Focus traversal, gaining or losing focus f: scrolling Viewports, list views, slivers, etc. found in release: 3.7 Found to occur in 3.7 found in release: 3.9 Found to occur in 3.9 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on P2 Important issues not at the top of the work list team-framework Owned by Framework team triaged-framework Triaged by Framework team
Projects
None yet
Development

No branches or pull requests

4 participants