flutterのtextfieldでの動作について。

flutterでアプリを作っているプログラミング初心者です。
早速質問なのですが、Textfieldに文字が入力されたらTextFieldの下にボタンが現れるようにしたいです。

Dart
1child: TextField(
2              onChanged: (text) {
3                if (text.isEmpty) {
4                  ElevatedButton(
5                    child: Text("次へ進む"),
6                    onPressed: () {},
7                  );
8                }
9              },

このようなコードにしたのですがテキストを入力してもボタンが現れません。
どのような問題点があると考えられますか？
ご教示いただければ幸いです。
よろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

Visibilityウィジェットを使って、ボタンの表示を制御するようにしてはいかがでしょうか？

また、ElevatedButtonはTextFieldの中に記述するのではなく、下に出してあげるといいと思います。

Dart
1bool _isVisible = false;
2
3// （省略）
4
5child: Column(
6        children: [
7          TextField(
8            onChanged: (text) {
9              if (text.isNotEmpty) {
10                _isVisible = true;
11              } else {
12                _isVisible = false;
13              }
14              setState(() {});
15            },
16          ),
17          Visibility(
18            visible: _isVisible,
19            child: ElevatedButton(
20              child: Text("次へ進む"),
21              onPressed: () {},
22            ),
23          ),
24        ],
25      ),