Flutter中如何获取自定义RadioButton组件的选中值

StatefulWidget的内部状态（比如_RadioButtonWidgetState里的colorRadioButton）是组件私有属性，外部无法直接访问，必须通过回调函数实现子组件向父组件传递选中的颜色值，具体修改步骤如下：

步骤1：修改RadioButtonWidget组件，添加回调参数 #

在StatefulWidget类中定义回调函数，用于将选中的颜色值传递给父组件：

class RadioButtonWidget extends StatefulWidget {
  // 定义回调函数，传递选中的颜色字符串
  final ValueChanged<String>? onColorSelected;
  // 允许父组件指定初始选中颜色（可选）
  final String initialColor;

  const RadioButtonWidget({
    Key? key,
    this.onColorSelected,
    this.initialColor = "rosa", // 默认初始选中rosa
  }) : super(key: key);

  @override
  State<RadioButtonWidget> createState() => _RadioButtonWidgetState();
}

class _RadioButtonWidgetState extends State<RadioButtonWidget> {
  late String colorRadioButton;

  @override
  void initState() {
    super.initState();
    // 用父组件传入的初始值初始化选中状态
    colorRadioButton = widget.initialColor;
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        children: <Widget>[
          const SizedBox(height: 30),
          const Text('Elija el color de la tarea'),
          const SizedBox(height: 10),
          ListTile(
            title: const Text("Rosa"),
            tileColor: const Color(0xFFFF66C4),
            leading: Radio(
              activeColor: const Color(0xFFFF66C4),
              focusColor: const Color(0xFFFF66C4),
              value: "rosa",
              groupValue: colorRadioButton,
              onChanged: (value) {
                setState(() {
                  colorRadioButton = value.toString();
                });
                // 触发回调，把选中值传给父组件
                widget.onColorSelected?.call(colorRadioButton);
              },
            ),
          ),
          // 其他颜色的ListTile同理，onChanged中必须调用widget.onColorSelected
          ListTile(
            title: const Text("Azul"),
            tileColor: const Color(0xFF4A90E2),
            leading: Radio(
              activeColor: const Color(0xFF4A90E2),
              focusColor: const Color(0xFF4A90E2),
              value: "azul",
              groupValue: colorRadioButton,
              onChanged: (value) {
                setState(() {
                  colorRadioButton = value.toString();
                });
                widget.onColorSelected?.call(colorRadioButton);
              },
            ),
          ),
        ],
      ),
    );
  }
}

步骤2：在父组件中接收并使用选中的颜色值 #

父组件定义变量保存选中颜色，调用RadioButtonWidget时传入回调更新该变量，最后用这个变量创建Tarjeta对象：

// 父组件中定义变量，保存选中的颜色
String selectedColor = "rosa";

// 调用RadioButtonWidget，传入回调更新选中颜色
RadioButtonWidget(
  onColorSelected: (color) {
    setState(() {
      selectedColor = color;
    });
  },
),
const SizedBox(height: 16.0),
Align(
  alignment: Alignment.bottomLeft,
  child: TextButton(
    onPressed: () {
      Navigator.of(context).pop();
    },
    child: const Text('Cancelar'),
  ),
),
Align(
  alignment: Alignment.bottomRight,
  child: TextButton(
    onPressed: () async {
      print("Entro en CustomDialogTareas");
      List<String>? lista;
      // 使用选中的颜色创建Tarjeta对象
      Tarjeta tarjeta = Tarjeta("", nombreController.text, "", selectedColor, fechaController.text);
      // 后续逻辑（比如保存tarjeta）
    },
    child: const Text('Guardar'),
  ),
),

为什么之前的方法失败？ #

• 直接访问状态类变量：_RadioButtonWidgetState是私有类，外部无法直接访问其成员变量，这是Flutter封装状态的设计原则。
• Getter方法：即使在StatefulWidget类中添加getter，也无法获取状态类的实时值，因为状态实例由Flutter框架管理，外部无法直接获取当前状态对象。

这种回调方式是Flutter组件间传递状态的标准做法，符合单向数据流设计，保证状态流转清晰可维护。

内容的提问来源于stack exchange，提问作者Tatiana Sánchez