Closed3

SearchAnchor.barのsuggestionBuilderでsetStateを機能させたい

Flutter
enoiuenoiu

SearchAnchor.barのsuggestionBuilderでは、検索バーを押したときに検索バーの下に出てくるシートを作成することができる。
https://api.flutter.dev/flutter/material/SearchAnchor/SearchAnchor.bar.html

suggestionBuilderという名の通り、本来は検索バーに入力した文字をもとに候補を提示する部分ではあるが、今回私はsegmentedButtonやCheckboxListTileを入れたい。

suggestionsBuilder: (context, controller) {
        return <Widget>[
          SegmentedButton(),
          ...List.generate(
//
                return CheckboxListTile();
//
            ),
        ];
      },

しかし、setStateで再描画しようとしても再描画されない。

どうやら、検索バーの文字の変更によってのみしか再描画されないらしい。
https://stackoverflow.com/questions/77644567/how-to-rebuild-a-suggestionbuilder-from-searchanchor-manually

とりあえずStatefulBuilderでsegmentedButtonやCheckboxListTileそれぞれを囲めば再描画されるものの、これだとsegmentedButtonとCheckboxListTile間での再描画が反映されない（segmentedButtonを選択するとCheckboxListTileをdisableにするみたいな動作）。

enoiuenoiu

強引だが、Columnで囲んだうえで、それをStatefulBuilderで囲むことで解決した。

suggestionsBuilder: (context, controller) {
    return <Widget>[
        StatefulBuilder(builder: (context, setState) {
        return Column(
            children: [
                SegmentedButton(),
                ...List.generate(
//
                    return CheckboxListTile();
//
                ),
            ],);},
        ];
      },
enoiuenoiu

なお、このColumn外を再描画するには、Column内でsetStateを使う際、その後にthis.setState(() {});を使えばよい。

このスクラップは2024/10/16にクローズされました