如何使Radio Widget看起来像一个按钮

Question

我正在重建一个旧的应用程序，需要使单选按钮看起来像实际的按钮。 最好的方法是什么？

旧应用参考：

Answer 1

您可以使用有状态的小部件并跟踪该小部件中的选定值。该小部件将是一个带有子Text的容器。点击时，更改所选值。然后，基于所选值，您将为容器返回不同的BoxDecoration。参见下面的代码：

class ButtonStyleRadioButton extends StatefulWidget {
 // Function to call when tapped
 Function(bool) onChanged;

 ButtonStyleRadioButton({this.onChanged});

_ButtonStyleRadioButtonState createState() => _ButtonStyleRadioButtonState();
}

class _ButtonStyleRadioButtonState extends State<ButtonStyleRadioButton> {
  bool _selected = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: (){ setState(() {
       _selected = !_selected; 
       // Callback to passed in function
       widget.onChanged(_selected);
      });},
      child: Container(
      padding: EdgeInsets.all(10.0),
      child:  Text('Consumer'),
       decoration: BoxDecoration(
         borderRadius: BorderRadius.circular(50.0),
         border: Border.all(color: Colors.grey[400]),
         color: _selected ? Colors.red : Colors.white
       )));
  }
}