颤动单选按钮的问题

Posted 2023-02-23

【中文标题】颤动单选按钮的问题

【英文标题】：Trouble with flutter radio button

【发布时间】：2019-08-08 14:09:53

【问题描述】：

我只想拥有普通的单选按钮，其中只能选择组中的一个按钮。根据网上教程，我们需要将groupvalue变量设置为onChanged中setState方法中的值。如果我这样做，我可以选择所有按钮，我不希望这种情况发生。我希望一次只选择一个按钮（从该组中）。如果我的代码或任何其他方式有任何问题，请告诉我。

option 是标题选项的字符串参数value 是该选项的值。

class Option extends StatefulWidget 
  final String option;
  final int optionvalue;

  Option(this.option, this.optionvalue);

  _OptionState createState() => _OptionState();


class _OptionState extends State<Option> 
  int groupvalue;
  @override
  Widget build(BuildContext context) 
    return Container(
      child: Container(
        child: RadioListTile(
          title: Text(
            widget.option,
            style: TextStyle(fontSize: 20.0),
          ),
          activeColor: Colors.black,
          value: widget.optionvalue,
          groupValue: groupvalue,
          onChanged: (int a) 
            print(a);
            setState(() 
              groupvalue = a;
            );
          ,
        ),
      ),
    );
  

【参考方案1】：

试试这个代码

int _groupValue = -1;

@override
Widget build(BuildContext context) 
  return Column(
    children: <Widget>[
      _myRadioButton(
        title: "Checkbox 0",
        value: 0,
        onChanged: (newValue) => setState(() => _groupValue = newValue),
      ),
      _myRadioButton(
        title: "Checkbox 1",
        value: 1,
        onChanged: (newValue) => setState(() => _groupValue = newValue),
      ),
    ],
  );


Widget _myRadioButton(String title, int value, Function onChanged) 
  return RadioListTile(
    value: value,
    groupValue: _groupValue,
    onChanged: onChanged,
    title: Text(title),
  );

输出：

【讨论】：

感谢您的代码，但我使用构造函数来实例化按钮（我有很多单选按钮）。我不能在构建方法中包含所有单选按钮。如果您可以更改我的代码，您会进行哪些更改（如果可能）。感谢您的回复。

@Suhas G 我更新了代码以满足您的需求，请查看这个。它有一个构建RadioListTile

的函数

感谢分享此代码:)

【参考方案2】：

试试这个水平单选按钮列表：

int _groupValue = -1;

Container(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                Text('Gender', style: TextStyle(fontSize: 18)),
                Container(
                  child: Column(
                    children: <Widget>[
                      Row(
                        children: <Widget>[
                          Expanded(
                            flex: 1,
                            child: RadioListTile(
                              value: 0,
                              groupValue: _groupValue,
                              title: Text("Male"),
                              onChanged: (newValue) =>
                                  setState(() => _groupValue = newValue),
                              activeColor: Colors.red,
                              selected: false,
                            ),
                          ),
                          Expanded(
                            flex: 1,
                            child: RadioListTile(
                              value: 1,
                              groupValue: _groupValue,
                              title: Text("Female"),
                              onChanged: (newValue) =>
                                  setState(() => _groupValue = newValue),
                              activeColor: Colors.red,
                              selected: false,
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),

【讨论】：

最好以最简单的方式回答问题。水平列表和其他布局属性只会分散答案。