【Flutter】文字入力中に画面上部に移動してしまう問題を解消

Flutterでアプリを開発している途中で、フォームの入力中に画面が上部に戻ってしまう問題が発生しました。

こんな感じです。

ちなみにSingleChildScrollViewでラップしてスクロール可能にしています。

開発環境

この原因は以下の通りです。

①フォームに文字が入力されるたびにsetStateが呼び出される

②buildメソッド内でUniqueKey()しているので、setStateが呼び出されるたびに新しいKeyが生成されて画面上部に移動する

ということで、buildメソッド内でKeyを生成するのではなく、外で生成するように変更します。

final _formKey = UniqueKey();
@override
  Widget build(BuildContext context) {
               〜省略〜
  }

これでフォームの入力中に画面が上部に戻らなくなりました。

日本語でFlutterの概要を知るなら以下の書籍がオススメです。