0

UdemyでFlutterを学習しています。
以下のソースは講座内で使用されているものになります。

onChangedの中でcityNameを更新しているのですが、setStateがないのに値が更新されるのは何故でしょうか。
画面描画にされる変数を更新するには、setState内で値を変更しなければいけない認識ですが、間違っているのでしょうか。
デバッグでは、setStateなしの場合とありの場合ではどちらも同じように更新されています。

class CityScreen extends StatefulWidget {
  @override
  _CityScreenState createState() => _CityScreenState();
}

class _CityScreenState extends State<CityScreen> {
  String cityName;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage('images/city_background.jpg'),
            fit: BoxFit.cover,
          ),
        ),
        constraints: BoxConstraints.expand(),
        child: SafeArea(
          child: Column(
            children: <Widget>[
              Align(
                alignment: Alignment.topLeft,
                child: FlatButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  child: Icon(
                    Icons.arrow_back_ios,
                    size: 50.0,
                  ),
                ),
              ),
              Container(
                padding: EdgeInsets.all(20.0),
                child: TextField(
                  style: TextStyle(
                    color: Colors.black,
                  ),
                  decoration: kTextFieldInputDecoration,
                  onChanged: (value) {
                    cityName = value;
                  },
                ),
              ),
              FlatButton(
                onPressed: () {
                  Navigator.pop(context, cityName);
                },
                child: Text(
                  'Get Weather',
                  style: kButtonTextStyle,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
2
  • 1
    何が更新されていると思ってるのですか。cityNameの内容ですかTextFieldの表示内容ですか、それとも別の何かですか。それにより回答が異なるので、その部分を正確に記述してください。
    – ta.fu
    Commented 2月3日 2:01
  • cityNameとTextFieldともに更新されています。 cityNameはprint()でコンソールに出力し、TextFieldはエミュレータで更新されていることを確認しました。 ほかに必要な情報等ありますでしょうか?
    – peter
    Commented 2月3日 2:36

1 件の回答 1

1

まずはTextFieldとcityNameが更新されている理由から。

TextFieldはそのように設計、実装されているから。
というのがTextFieldの回答になると思う。

TextFieldはキーボード等からの入力された情報を内部で保持しそれを表示するという機能を持っていて、呼び出し側、この場合CityScreenでsetStateをしなくてもTextFieldで適時状態更新が行われている。
例えば、キー入力したら、その文字列を表示するといった感じで。

これはTextFieldの派生元がStatefulWidgetなので、そういう動作ではとある程度想像できるかな。

次のcityNameはString型の変数なので、代入すればその時点で値が変更される。
こちらはdart言語の仕様になり、setStateとは全く関係がないです。

次に以下の内容。

画面描画にされる変数を更新するには、setState内で値を変更しなければいけない認識ですが、間違っているのでしょうか。

質問の流れから言ってcityNameがTextFieldの描画で使用されると思っていると受け取りました。しかしそれは違います。
TextFieldで何かしら変更が入った場合、TextField内で保持している文字列情報をonChangedというコールバックを使って、TextFieldを使用している側に伝えているだけです。

setStateはStateのbuildを再実行するよう要求するメソッドです。またbuild内で使う変数値の変更はsetState内のコールバックで行うのが望ましいといった感じの意味合いです。

1
  • ご丁寧な回答ありがとうございます。
    – peter
    Commented 2月4日 4:50

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。