CheckboxListTile选中后无法取消勾选问题求助

我来帮你排查下这个问题，大概率是这几个细节没处理好：

1. 状态变量的作用域错误 #

你可能把checkBoxState定义在了build方法内部，而不是作为State类的成员变量。比如这种错误写法：

@override
Widget build(BuildContext context) {
  // ❌ 这里定义的变量，每次build都会被重置
  bool checkBoxState = true;
  final checkBox = CheckboxListTile(...);
  return ...;
}

每次调用setState都会触发build方法，这时候checkBoxState会被重新初始化为true，导致你点击取消后状态又被重置，看起来就像无法取消勾选。

解决方法：把checkBoxState移到State类的成员变量位置：

class _YourPageState extends State<YourPage> {
  // ✅ 作为成员变量，只会初始化一次，状态会被保留
  bool checkBoxState = true;

  @override
  Widget build(BuildContext context) {
    final checkBox = CheckboxListTile(
      contentPadding: EdgeInsets.all(0),
      title: Text("Remember Me", style: TextStyle(fontSize: 15.0)),
      // selected: checkBoxState, // 这个属性控制列表项的高亮样式，不是复选框状态，可按需保留或移除
      value: checkBoxState,
      checkColor: Colors.white,
      activeColor: Colors.grey,
      controlAffinity: ListTileControlAffinity.leading,
      onChanged: (newValue) {
        setState(() {
          // 处理newValue的可空性，避免潜在问题
          checkBoxState = newValue ?? false;
        });
      },
    );
    return Scaffold(body: checkBox);
  }
}

2. 处理可空的newValue参数 #

onChanged的参数newValue是bool?类型（可空布尔值），直接赋值给非空的checkBoxState可能会有潜在问题，建议用??运算符设置默认值，确保赋值的是一个非空布尔值。

3. 理清selected和value的区别 #

你代码里同时设置了selected和value为同一个变量，其实selected属性是用来控制整个ListTile的高亮样式（比如文本颜色变深），而value才是真正控制复选框的选中状态。两者可以关联，但不是必须的。如果你不需要ListTile的高亮效果，可以直接去掉selected属性，简化逻辑。

按照上面的方法修改后，应该就能正常取消勾选了~

内容的提问来源于stack exchange，提问作者Naseema Shaik