如何将单选按钮放在文本旁边？ - 颤振答案

【问题标题】：How to put radio button next to the text? - Flutter如何将单选按钮放在文本旁边？ - 颤振
【发布时间】：2021-11-15 07:13:10
【问题描述】：

我想对齐上面每个文本旁边的每个按钮，但我有点卡住了。

每个按钮+文字都保留在一列中。我想要的是个人排成一排。

这是上图中的代码：

Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Radio(
                    value: 1,
                    groupValue: id,
                    onChanged: (val) {
                      setState(() {
                        predominant = 'recessiva_aa';
                        id = 1;
                      });
                    },
                  ),
                  const Text(
                    'Epistasia Recessiva (aa)',
                    style: TextStyle(fontSize: 17.0),
                  ),
                  Radio(
                    value: 2,
                    groupValue: id,
                    onChanged: (val) {
                      setState(() {
                        predominant = 'recessiva_bb';
                        id = 2;
                      });
                    },
                  ),
                  const Text(
                    'Epistasia Recessiva (bb)',
                    style: TextStyle(fontSize: 17.0),
                  ), 
                  // ...

【问题讨论】：

标签： android flutter dart mobile

【解决方案1】：

使用单选列表图块。他们有一个标题文本小部件。

RadioListTile(
 title: Text('This Works!'),
 value: true,
 groupValue: //your group value,
 onChanged: (value) {
 //someLogic;
 }),

【讨论】：

【解决方案2】：

您可以将您的 Radio 和 Text 包装在 Row 中，类似于

Row(
  children: [
    const Text(
      'Epistasia Recessiva (aa)',
      style: TextStyle(fontSize: 17.0),
    ),
    Radio(
      value: 2,
      groupValue: id,
      onChanged: (val) {
        setState(() {
          predominant = 'recessiva_bb';
          id = 2;
        });
      },
    ),
    // more widgets ...
  ]
),

【讨论】：