flutter ListTile毎にbool値を持たせたい。

Question

flutterで簡単なクイズアプリを作成しているプログラミング初心者です。
ListView内のListTileにお気に入り機能のようなものを付けたいのですが、お気に入り追加を行うために用意したIconButtonを一つ押すとすべてのIconButtonが反応(色が変わる)してしまいます。以下がコードになります。

class QuizChoice extends StatefulWidget {
  final String quizCategory;
  QuizChoice(this.quizCategory);

  @override
  State<QuizChoice> createState() => _QuizChoice();
}

class _QuizChoice extends State<QuizChoice> {
  bool isVisible = false;
  bool favorite = false;
  Set favorite_set = {};
  String decision = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.quizCategory),
      ),
      body: Stack(
        children: [
          ChangeNotifierProvider(
            create: (_) => ProductListModel(widget.quizCategory)..getProducts(),
            child: Consumer<ProductListModel>(
              builder: (context, model, child) {
                final products = model.products;
                return ListView.builder(
                  itemCount: products.length,
                  itemBuilder: (context, index) {
                    return Container(
                      height: 60,
                      decoration: BoxDecoration(
                        border: Border(bottom: BorderSide(color: Colors.teal)),
                      ),
                      child: ListTile(
                        onTap: () {
                          setState(() {
                            isVisible = !isVisible;
                          });
                          decision = products[index].title;
                        },
                        leading: IconButton(
                          icon: Icon(Icons.add),
                          onPressed: () {
                            setState(() {
                              favorite = !favorite;
                            });
                            if (favorite == true) {
                              favorite_set.add(products[index].title);
                            } else {
                              favorite_set.remove(products[index].title);
                            }
                          },
                          color: favorite ? Colors.purple : Colors.grey,
                        ),
                        trailing: Checkbox(
                          onChanged: print,
                          value: false,
                        ),
                        title: Text(
                          products[index].title,
                          style: TextStyle(fontWeight: FontWeight.bold),
                        ),
                      ),
                    );
                  },
                );
              },
            ),
          ),
          Positioned(
            bottom: 30,
            left: 10,
            right: 10,
            height: 60,
            child: Container(
              child: Visibility(
                visible: isVisible,
                child: ElevatedButton(
                  child: Text(
                    "「$decision」クイズにちょうせん!!",
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                  style: ElevatedButton.styleFrom(
                    primary: Colors.purple,
                    onPrimary: Colors.white,
                    shape: const StadiumBorder(),
                  ),
                  onPressed: () {
                    print(favorite_set.length);
                  },
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

LIstTileの中でもIconButtonの部分にだけList毎にbool値を持たせたいので、IconButtonだけextractしてみたのですが、親WidgetでSetに値を入れたいのと、パラメータ部分にエラーが出て上手く行きませんでした…。
なにかい良い解決方法はありますでしょうか？
よろしければ力を貸して頂きたいです。
よろしくお願い致します。

Answer 1

アイコンの色を変更するためのfavorite変数が1つしかないので、まさに実装通りの動きをしてます。

favorite_setに色を変えるタイトル名が入るという感じだと思うので、IconButtonのonPressedの実装が以下の様な感じなのかな。

                        leading: IconButton(
                          icon: Icon(Icons.add),
                          onPressed: () {
                            setState(() {
                            if (favorite_set.contains(products[index].title)) {
                              favorite_set.remove(products[index].title);
                            } else {
                              favorite_set.add(products[index].title);
                            }
                            });
                          },
                          color: favorite_set.contains(products[index].title) ? Colors.purple : Colors.grey,
                        ),

Comments

[washomatu]

なるほど…！
こちらの方法だと機能面とも直接関連があってより優れていますね。
勉強になりました。
本当にありがとうございました！