时间戳

首页 > 解决方案 > 如何更改 Flutter gridview.count 复选框列表的状态？

flutter - 如何更改 Flutter gridview.count 复选框列表的状态？

问题描述

我使用颤振 gridview.count 生成了一个复选框列表。现在我想分别更改每个复选框的状态。

你能告诉我如何更改复选框的值吗

网格视图 

child: new GridView.count(
                            crossAxisCount: 2,
                            shrinkWrap: true,
                            childAspectRatio: 8.0,
                            children:
                                List.generate(pllistdata.length, (index) {
                              return Pldata(pllistdata[index], index);
                            }),
                          ),

返回的小部件

Card Pldata(String plname, int id) {
return Card(
  child: Padding(
    padding: const EdgeInsets.all(10.0),
    child: new Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        Text(
          '$plname',
          style: TextStyle(
              fontWeight: FontWeight.bold,
              color: Colors.black54,
              fontSize: 16.0),
        ),
        CircularCheckBox(
          value: pl_status,
          materialTapTargetSize: MaterialTapTargetSize.padded,
          onChanged: (x) {
            setState(() {
            prefs.setStringList('PL', sflist);
            });
          },
          activeColor: Colors.red[800],
          inactiveColor: Colors.grey,
        )
      ],
    ),
  ),
);

}

标签： fluttercheckboxgridview

解决方案

将您的 Pldata 卡小部件更改为有状态类并在其构造函数中传递必要的值。此外，如果您已经有 pllistdata 列表，那么在使用 builder 构建 gridview 时会很好。我修改了你的代码。检查并查看它是否适合您。

 child: GridView.builder(
    itemCount: pllistdata.length,
    shrinkWrap: true,
    itemBuilder: (context, index) {
      return Pldata(pllistdata[index], index);
    },
    gridDelegate:
        SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
  ),

并更改了有状态的 pldata

    class Pldata extends StatefulWidget {
      final String plname;
      final int id;

      Pldata(this.plname, this.id);

      @override
      _PldataState createState() => _PldataState();
    }

    class _PldataState extends State<Pldata> {
      bool pl_status = false;

      @override
      Widget build(BuildContext context) {
        return Card(
          child: Padding(
            padding: const EdgeInsets.all(10.0),
            child: new Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Text(
                  '${widget.plname}',
                  style: TextStyle(
                      fontWeight: FontWeight.bold,
                      color: Colors.black54,
                      fontSize: 16.0),
                ),
                Checkbox(
                  onChanged: (x) {
                    setState(() {
                      pl_status = !pl_status;
                     // prefs.setStringList('PL', sflist); 
                     // you can pass prefs via constructor or initialize in 
                      //  init
                    });
                  },
                  activeColor: Colors.red[800],
                  value: pl_status,
                )
              ],
            ),
          ),
        );
      }
    }

推荐阅读