Question

我使用flutter 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,
        )
      ],
    ),
  ),
);

}

Answer 1

您可以将复选框的值传递给函数，从列表项中，您可以识别每个项目并相应地更改值。

 Widget checkbox(String title, bool boolValue) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(title),
            Checkbox(
              value: boolValue,
              onChanged: (bool value) {
                setState(() {
                  switch (title) {
                    case HOT_SERVE:
                      hotServe = value;
                      break;

                    case UTENSILS:
                      utensils = value;
                      break;
                    case CARTING:
                      transportation = value;
                      break;
                    case SAMPLE:
                      sample = value;
                      break;
                  }
                });
              },
            )
          ],
        );
      }

Answer 2

将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,
                )
              ],
            ),
          ),
        );
      }
    }

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

2 个答案: