我有一些代码可以创建 7 个圆形的原 Material 按钮。但是我似乎无法改变圆圈的大小，或者将它们放在一起。

Page.dart

Row(
  children: <Widget>[
    new ThemeButton(Colors.red, () => print("red")),
    new ThemeButton(Colors.orange, () => print("orange")),
    new ThemeButton(Colors.yellow, () => print("yellow")),
    new ThemeButton(Colors.green, () => print("green")),
    new ThemeButton(Colors.blue, () => print("blue")),
    new ThemeButton(Colors.indigo, () => print("pink")),
    new ThemeButton(Colors.purple, () => print("purple")),
  ],
),

ThemeButton.dart

@override
Widget build(BuildContext context) {
  return RawMaterialButton (
    shape: CircleBorder(),
    fillColor: _themeColour,
    elevation: 0.0,
    highlightElevation: 0.0,
    onPressed: () => _onPressed(),
    splashColor: Colors.transparent,  
    highlightColor: Colors.transparent,
  );
}

显示:

所以我面临的三个问题都是围绕元素的大小和定位。

1. 圆圈太小，我不喜欢。
2. 圆圈周围的空间太宽。
3. 我可以在圈外点击，它仍然会注册点击。

我查看了原 Material 按钮的参数，但看不到我可以更改什么。添加填充小部件并将其设置为 0 没有帮助。

最佳答案

不幸的是，更改填充属性对我不起作用。然而，像这个例子一样改变约束参数被证明是非常有效的:

RawMaterialButton(
    constraints: BoxConstraints.tight(Size(36, 36)),
    onPressed: null,
    child: Icon(Icons.trending_up, size: 18),
    shape: new CircleBorder(),
    elevation: 0.0,
    fillColor: Color.fromARGB(255, 240, 240, 240),
),

希望对你有帮助!

https://stackoverflow.com/questions/54099089/