Flutter中如何使用三元表达式禁用Radio按钮？

要实现Radio组件的条件禁用，只需给你的自定义RadioButton组件添加一个控制启用状态的参数，再通过Flutter原生Radio组件的onChanged属性来控制禁用逻辑——因为Flutter里当Radio的onChanged为null时，组件会自动进入禁用状态。

修改步骤 #

• 给RadioButton类新增enabled成员变量，用于接收启用/禁用的控制条件
• 根据enabled的值，控制原生Radio的onChanged回调：启用时传递正常回调，禁用时设为null
• （可选）禁用时同步修改标签文字的颜色，让视觉反馈更统一

修改后的完整代码 #

import 'package:flutter/material.dart';

class RadioButton extends StatelessWidget {
  final String label;
  final int groupValue;
  final int value;
  final ValueChanged<int> onChanged;
  // 新增启用状态控制参数，默认启用
  final bool enabled;

  const RadioButton(
      {super.key,
      required this.label,
      required this.groupValue,
      required this.value,
      required this.onChanged,
      this.enabled = true});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Row(
          children: <Widget>[
            Expanded(
              child: Row(
                children: <Widget>[
                  Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Radio<int>(
                        groupValue: groupValue,
                        value: value,
                        // 根据enabled状态决定是否开启回调
                        onChanged: enabled
                            ? (int? newValue) {
                                onChanged(newValue!);
                              }
                            : null),
                  ),
                  // 可选：禁用时文字置灰
                  Text(
                    label,
                    style: TextStyle(
                      color: enabled ? null : Colors.grey,
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ],
    );
  }
}

使用示例 #

// 启用状态的Radio
RadioButton(
  label: "正常选项",
  groupValue: selectedValue,
  value: 1,
  onChanged: (value) {
    // 处理选中逻辑
  },
  enabled: true,
)

// 禁用状态的Radio
RadioButton(
  label: "禁用选项",
  groupValue: selectedValue,
  value: 2,
  onChanged: (value) {
    // 处理选中逻辑
  },
  enabled: false,
)

这样就能完全按照你的需求，通过enabled参数的布尔值来控制Radio组件的启用/禁用状态。

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