Flutter中如何将选中的Checkbox值显示在Text()组件上

核心逻辑为额外维护存储选中值的变量，在Checkbox状态变更时同步更新该变量，再将变量绑定到目标Text组件即可，具体实现如下：

• 步骤1：在当前页面的State类中声明相关变量（你已定义的Checkbox状态变量可以保留）

// 两个Checkbox的选中状态
bool prepaidCheckBoxValue = false;
bool podCheckBoxValue = false;
// 用来存储要展示的选中值
String selectedPayType = '';

• 步骤2：修改两个Checkbox的onChanged回调，每次状态变更时同步更新展示文本

// Prepaid对应的Checkbox修改后的onChanged
onChanged: (value) {
  prepaidCheckBoxValue = !prepaidCheckBoxValue;
  // 新增选中值更新逻辑
  if(prepaidCheckBoxValue){
    selectedPayType += selectedPayType.isEmpty ? 'Prepaid' : ', Prepaid';
  }else{
    selectedPayType = selectedPayType.replaceAll(RegExp(r',?\s*Prepaid'), '');
  }
  setState(() {});
},

// Pay on Delivery对应的Checkbox修改后的onChanged
onChanged: (value) {
  podCheckBoxValue = !podCheckBoxValue;
  // 新增选中值更新逻辑
  if(podCheckBoxValue){
    selectedPayType += selectedPayType.isEmpty ? 'POD' : ', POD';
  }else{
    selectedPayType = selectedPayType.replaceAll(RegExp(r',?\s*POD'), '');
  }
  setState(() {});
},

• 步骤3：在需要展示选中值的位置添加绑定变量的Text组件

Text(
  selectedPayType.isEmpty ? '未选择支付方式' : '已选中：$selectedPayType',
  style: const TextStyle(fontSize: 18),
)

如果需要实现单选逻辑（两个Checkbox仅能选中一个），只需要在onChanged回调中添加判断，选中某一个时自动将另一个Checkbox的状态设为false、同时清除对应值即可。

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