Flutter单选按钮

Flutter单选按钮是一种可以让用户从多个选项中选择一个唯一值的UI组件。在Flutter中，单选按钮可以使用Radio或RadioListTile widget来实现。这些单选按钮可以通过组合在RadioGroup中来创建一组单选按钮，以便用户可以从中选择一个选项。

Radio Widget

Radio widget是Flutter中实现单选按钮的最基本的组件之一。它需要传递一个Value和一个GroupValue。当Radio widget的Value和GroupValue值相等时，那么该单选按钮将被选中。

Radio(
  value: 0,
  groupValue: selectedValue,
  onChanged: (value) {
    setState(() {
      selectedValue = value;
    });
  },
  ),

• value: 该单选按钮的value值，当该单选按钮被选中时会被传递到onChanged函数中
• groupValue: 当前单选按钮组的value值
• onChanged: 该单选按钮被选中时的回调函数，通常在该回调函数中改变groupValue的值

RadioListTile Widget

RadioListTile widget是Radio widget的升级版。它可以显示一个带有标题和图标的单选按钮。它还可以被嵌套在ListTile中，以便在单选按钮旁边显示的标题和子标题（如果有）有更好的样式。

RadioListTile(
  value: 0,
  groupValue: selectedValue,
  onChanged: (value) {
    setState(() {
      selectedValue = value;
    });
  },
  title: Text("Option 1"),
),

• value: 该单选按钮的value值，当该单选按钮被选中时会被传递到onChanged函数中
• groupValue: 当前单选按钮组的value值
• onChanged: 该单选按钮被选中时的回调函数，通常在该回调函数中改变groupValue的值
• title: 要显示的标题文本widget

RadioGroup Widget

RadioGroup widget是一组单选按钮的容器。可以使用Radio或RadioListTile widget来创建单选按钮，并将它们添加到RadioGroup中。

List<RadioModel> _radioList = [
  RadioModel(isSelected: false, title: "Option 1", value: 0),
  RadioModel(isSelected: true, title: "Option 2", value: 1),
  RadioModel(isSelected: false, title: "Option 3", value: 2),
];

RadioGroup(
  radioList: _radioList,
  onSelected: (value) {
    setState(() {
      selectedValue = value;
    });
  },
),

• radioList: 单选按钮的列表，每个单选按钮都需要有isSelected、title和value属性
• onSelected: 单选按钮被选中时的回调函数，通常在该回调函数中改变groupValue的值

总结

Flutter单选按钮是一种可以让用户从多个选项中选择一个唯一值的UI组件。Radio和RadioListTile widget可以被用来创建单选按钮。使用RadioGroup widget可以将单选按钮组合在一起，并在其中进行选择。