Flutter 在颤振中处理复选框状态

在我的仪表板中，我有一个。。。图标，无论何时单击，它都将显示包含复选框的底部工作表。但是，每当我选中/取消选中该框时，状态在当时没有改变，我会调用setState，这样它会重新显示整个仪表板，而不是底部，所以当我再次单击。。。图标更改将反映在底部工作表中。如何解决这个问题？我只希望它在那个时候更新。请帮我做这件事

 Map<String, bool> data = {"1": true, "2": false, "3": true};

          void _showModalSheet() {
            List<Map<String, Object>> chec

kbox;
        checkbox = [
          {"id": "1", "displayId": "check1"},
          {"id": "2", "displayId": "check2"},
          {"id": "3", "displayId": "check3"}
        ];

        showModalBottomSheet<void>(
            context: context,
            builder: (BuildContext context) {
              return StatefulBuilder(
                  builder: (BuildContext context, StateSetter state) {
                return createBox(context, checkbox, state);
              });
            });
      }

      createBox(
          BuildContext context, List<Map<String, Object>> si, StateSetter state) {
        var metrics = si.map<Widget>((data) {
          var id = data["id"];
          var dispId = data["displayId"];
          return buildCheckbox(context, id, dispId, state);
        }).toList();

        return SingleChildScrollView(
          child: LimitedBox(
            child: Column(
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.center,
              children: metrics,
            ),
          ),
        );
      }

      void ItemChange(bool val, var id) {
        setState(() {
          data[id] = val;
        });
      }

      Widget buildCheckbox(
          BuildContext context, var id, var disp, StateSetter state) {
        List<String> selectedSiList = [];
        var a = 0;
        return Container(
            child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
          CheckboxListTile(
              value: data[id],
              title: Text(disp),
              controlAffinity: ListTileControlAffinity.leading,
              onChanged: (bool val) {
                ItemChange(val, id);
              })
        ]));
      }

Map数据={“1:true”，2:false，3:true}；
void_showModalSheet（）{
列表chec
kbox；
复选框=[
{“id”：“1”，“displayId”：“check1”}，
{“id”：“2”，“displayId”：“check2”}，
{“id”：“3”，“displayId”：“check3”}
];
showModalBottomSheet(
上下文：上下文，
生成器：（BuildContext上下文）{
返回状态生成器(
生成器：（BuildContext上下文，StateSetter状态）{
返回createBox（上下文、复选框、状态）；
});
});
}
createBox(
BuildContext上下文、列表si、状态设置器状态）{
var metrics=si.map（（数据）{
变量id=数据[“id”]；
var dispId=data[“displayId”]；
返回buildCheckbox（上下文、id、dispId、状态）；
}).toList（）；
返回SingleChildScrollView(
孩子：LimitedBox(
子：列(
mainAxisSize:mainAxisSize.max，
mainAxisAlignment:mainAxisAlignment.center，
儿童：指标，
),
),
);
}
无效项更改（布尔值，变量id）{
设置状态（）{
数据[id]=val；
});
}
小部件构建复选框(
BuildContext上下文、变量id、变量disp、状态设置器状态）{
列表selectedSiList=[]；
var a=0；
返回容器(
子项：列（mainAxisSize:mainAxisSize.min，子项：[
CheckboxListTile(
值：数据[id]，
标题：文本（disp），
controlAffinity:ListTileControlAffinity.leading，
一旦更改：（布尔瓦尔）{
项目变更（val、id）；
})
]));
}

Pass

StateSetter

在此函数中

void ItemChange(bool val, var id, StateSetter state) {
        state(() { //use that state here
          data[id] = val;
        });
      }

---

只有

StatefulBuilder

将更改底部工作表中的数据。

我已对您的代码进行了一些更改，请检查它是否适用于您

List<CheckBoxData> checkboxDataList = [
    new CheckBoxData(id: '1', displayId: 'check1', checked: true),
    new CheckBoxData(id: '2', displayId: 'check2', checked: false),
   new CheckBoxData(id: '3', displayId: 'check3', checked: true),
  ];

  void _showModalSheet() {
    showModalBottomSheet<void>(
      context: context,
      builder: (BuildContext context) {
        return StatefulBuilder(
          builder: (BuildContext context, StateSetter state) {
            return SingleChildScrollView(
              child: LimitedBox(
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: checkboxDataList.map<Widget>(
                    (data) {
                      return Container(
                        child: Column(
                          mainAxisSize: MainAxisSize.min,
                          children: <Widget>[
                            CheckboxListTile(
                              value: data.checked,
                              title: Text(data.displayId),
                              controlAffinity: ListTileControlAffinity.leading,
                              onChanged: (bool val) {
                                state(() {
                                  data.checked = !data.checked;
                                });
                              },
                            ),
                          ],
                        ),
                      );
                    },
                  ).toList(),
                ),
              ),
            );
          },
        );
      },
    );
  }

class CheckBoxData {
  String id;
  String displayId;
  bool checked;

  CheckBoxData({
    this.id,
    this.displayId,
    this.checked,
  });

  factory CheckBoxData.fromJson(Map<String, dynamic> json) => CheckBoxData(
        id: json["id"] == null ? null : json["id"],
        displayId: json["displayId"] == null ? null : json["displayId"],
        checked: json["checked"] == null ? null : json["checked"],
      );

  Map<String, dynamic> toJson() => {
        "id": id == null ? null : id,
        "displayId": displayId == null ? null : displayId,
        "checked": checked == null ? null : checked,
      };
}

List checkboxDataList=[
新CheckBoxData（id:'1'，displayId:'check1'，checked:true），
新CheckBoxData（id:'2'，displayId:'check2'，checked:false），
新CheckBoxData（id:'3'，displayId:'check3'，checked:true），
];
void_showModalSheet（）{
showModalBottomSheet(
上下文：上下文，
生成器：（BuildContext上下文）{
返回状态生成器(
生成器：（BuildContext上下文，StateSetter状态）{
返回SingleChildScrollView(
孩子：LimitedBox(
子：列(
mainAxisSize:mainAxisSize.max，
mainAxisAlignment:mainAxisAlignment.center，
子项：checkboxDataList.map(
（数据）{
返回容器(
子：列(
mainAxisSize:mainAxisSize.min，
儿童：[
CheckboxListTile(
值：data.checked，
标题：文本（data.displayId），
controlAffinity:ListTileControlAffinity.leading，
一旦更改：（布尔瓦尔）{
国家（）{
data.checked=！data.checked；
});
},
),
],
),
);
},
).toList（），
),
),
);
},
);
},
);
}
类CheckBoxData{
字符串id；
字符串显示ID；
布尔检查；
CheckBoxData({
这个身份证，
这个.displayId，
这个，检查过了，
});
工厂CheckBoxData.fromJson（映射json）=>CheckBoxData(
id:json[“id”]==null？null:json[“id”]，
displayId:json[“displayId”]==null？null:json[“displayId”]，
checked:json[“checked”]==null？null:json[“checked”]，
);
映射到JSON（）=>{
“id”：id==null？null:id，
“displayId”：displayId==null？null:displayId，
“已检查”：已检查==null？null:已检查，
};
}

在ItemChange中传递StateSetter。Bcoz只有statefullbuilder状态将在底部工作。并在ItemChange函数中使用state而不是setState