When ReorderableListView's item has TextField, rebuild makes keyboard hide

[wph144]

I confirmed 25867 issue.
here is additional issue.

Steps to Reproduce

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: TestClass(),
));

class TestClass extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: FlatButton(
          child: Text('click me'),
          onPressed: () {
            Navigator.of(context)
              .push(MaterialPageRoute(builder: (context) => MyHomePage()));
          },
        ),
      ));
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  TextEditingController textEditingController;

  @override
  void initState() {
    textEditingController = TextEditingController();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('title here'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {});
        },
      ),
      body: ReorderableListView(
        children: <Widget>[
          Row(
            key: ValueKey('key'),
            children: <Widget>[
              Expanded(
                child: TextField(
                  controller: textEditingController,
                  decoration: InputDecoration(hintText: 'type in'),
                ),
              )
            ],
          )
        ],
        onReorder: (int oldIndex, int newIndex) {},
      ));
  }
}

1. when keyboard is shown, click fab -> rebuild -> keyboard will be hidden
2. if you replace 'ReorderableListView' with 'ListView', then keyboard is still shown. why are they different?
3. we can avoid to rebuild some widgets using Provider. but now i cannot avoid rebuild on NestedScrollView + SliverPersistentHeader + ..etc or some other reason

Logs

[✓] Flutter (Channel stable, v1.17.5, on Mac OS X 10.15.4 19E287, locale ko-KR)
    • Flutter version 1.17.5 at /Users/wonpyohong/flutter
    • Framework revision 8af6b2f038 (3주 전), 2020-06-30 12:53:55 -0700
    • Engine revision ee76268252
    • Dart version 2.8.4

 
[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
    • Android SDK at /Users/wonpyohong/Library/Android/sdk
    • Platform android-29, build-tools 29.0.2
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses

[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.2

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)

[!] Android Studio (version 3.4)
    • Android Studio at /Users/wonpyohong/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/183.5522156/Android Studio.app/Contents
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1343-b01)

[!] IntelliJ IDEA Ultimate Edition (version 2020.1.2)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.dev/intellij-setup/#installing-the-plugins

[✓] Connected device (2 available)
    • SM G950N          • ce0517155b10cc7a0d        • android-arm64 • Android 9 (API 28)
    • Wonpyo의 iPhone 11 • 00008030-000E0CCA36B9802E • ios           • iOS 13.5.1

[wph144]

I found more example.
when keyboard show up, 'MediaQuery.of(context).padding.top' makes rebuild.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
// This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: RebuildExample(),
    );
  }
}

class RebuildExample extends StatefulWidget {
  @override
  RebuildExampleState createState() => RebuildExampleState();
}

class RebuildExampleState extends State<RebuildExample> {
  TextEditingController textEditingController;

  @override
  void initState() {
    textEditingController = TextEditingController(text: 'abcdefg');
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    print('build');
     MediaQuery.of(context).padding.top;
    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {});
        },
      ),
      body: ReorderableListView(
        onReorder: (a, b) {},
        children: List.generate(50, (index) {
          return ListTile(
            key: PageStorageKey<String>('pageKey $index'),
            title: TextField(
              controller: textEditingController,
            ),
          );
        })),
    );
  }
}

touch textfield
-> keyboard show
-> rebuild because of 'MediaQuery.of(context).padding.top'
-> rebuild ReorderableList that has textfield
-> keyboard hide.

and finally, we have no issue when replacing ReorderableListView with ListView.

Rebuilding ReorderableListView should not hide keyboard like ListView

[TahaTesser]

Code Sample

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: TestClass(),
    ));

class TestClass extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
      child: FlatButton(
        child: Text('click me'),
        onPressed: () {
          Navigator.of(context)
              .push(MaterialPageRoute(builder: (context) => MyHomePage()));
        },
      ),
    ));
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  TextEditingController textEditingController;

  @override
  void initState() {
    textEditingController = TextEditingController();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('title here'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {});
        },
      ),
      body: ReorderableListView(
        children: <Widget>[
          Row(
            key: ValueKey('key'),
            children: <Widget>[
              Expanded(
                child: TextField(
                  controller: textEditingController,
                  decoration: InputDecoration(hintText: 'type in'),
                ),
              )
            ],
          )
        ],
        onReorder: (int oldIndex, int newIndex) {},
      ),
      // body: TextField(
      //   controller: textEditingController,
      //   decoration: InputDecoration(hintText: 'type in'),
      // ),
    );
  }
}

flutter doctor -v

[✓] Flutter (Channel dev, 1.21.0-1.0.pre, on Mac OS X 10.15.6 19G73, locale
    en-GB)
    • Flutter version 1.21.0-1.0.pre at /Users/tahatesser/Code/flutter_dev
    • Framework revision f25bd9c55c (12 days ago), 2020-07-14 20:26:01 -0400
    • Engine revision 99c2b3a245
    • Dart version 2.9.0 (build 2.9.0-21.0.dev 20bf2fcf56)

 
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.1)
    • Android SDK at /Users/tahatesser/Code/sdk
    • Platform android-30, build-tools 30.0.1
    • ANDROID_HOME = /Users/tahatesser/Code/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.6)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.6, Build version 11E708
    • CocoaPods version 1.9.3

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

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)

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

[✓] Connected device (4 available)
    • iPhone 11 (mobile) • 7863E29F-EEE8-499E-BB28-6B111B76E3EE • ios
      • com.apple.CoreSimulator.SimRuntime.iOS-13-6 (simulator)
    • macOS (desktop)    • macos                                • darwin-x64
      • Mac OS X 10.15.6 19G73
    • Web Server (web)   • web-server                           • web-javascript
      • Flutter Tools
    • Chrome (web)       • chrome                               • web-javascript
      • Google Chrome 84.0.4147.89

• No issues found!

flutter doctor -v

[✓] Flutter (Channel stable, v1.17.5, on Mac OS X 10.15.6 19G73, locale en-GB)
    • Flutter version 1.17.5 at /Users/tahatesser/Code/flutter_stable
    • Framework revision 8af6b2f038 (4 weeks ago), 2020-06-30 12:53:55 -0700
    • Engine revision ee76268252
    • Dart version 2.8.4

 
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.1)
    • Android SDK at /Users/tahatesser/Code/sdk
    • Platform android-30, build-tools 30.0.1
    • ANDROID_HOME = /Users/tahatesser/Code/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.6)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.6, Build version 11E708
    • CocoaPods version 1.9.3

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 47.1.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6222593)

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

[✓] Connected device (1 available)
    • iPhone 11 • 7863E29F-EEE8-499E-BB28-6B111B76E3EE • ios • com.apple.CoreSimulator.SimRuntime.iOS-13-6
      (simulator)

• No issues found!

[xu-baolin]

@WonpyoHong please do not change the ListTile's key, because it will cause the widget's state to dispose and lose focus in ReorderableListView.
I modify your code like this and it will not lose focus when rebuild:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
// This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: RebuildExample(),
    );
  }
}

class RebuildExample extends StatefulWidget {
  @override
  RebuildExampleState createState() => RebuildExampleState();
}

class RebuildExampleState extends State<RebuildExample> {
  TextEditingController textEditingController;
  List<PageStorageKey> keys = [];
  int childSize = 50;

  @override
  void initState() {
    textEditingController = TextEditingController(text: 'abcdefg');
    for (int i = 0; i < childSize; ++i){
      keys.add(PageStorageKey<String>('pageKey $i'));
    }
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      debugDumpFocusTree();
    });
    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {});
        },
      ),
      body: ReorderableListView(
          onReorder: (int oldIndex, int newIndex) {},
          padding: EdgeInsets.all(50),
          children: List.generate(50, (index) {
            return ListTile(
              key: keys[index],
              title: TextField(
                controller: textEditingController,
              ),
//              title: Text(index.toString()),
            );
          })),
    );
  }
}

[TahaTesser]

Hi @WonpyoHong
Please try #62242 (comment) sample code, it works perfeclty

Thanks @xu-baolin