Flutter：如何创建圆形/圆形按钮答案

【问题标题】：Flutter: How to create round/circular buttonFlutter：如何创建圆形/圆形按钮
【发布时间】：2019-12-24 23:21:55
【问题描述】：

我无法创建任何示例来创建圆形按钮，例如浮动操作按钮？有什么方法可以创建吗？

下面的代码创建了一个矩形按钮，圆形按钮有吗？

shape: RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0))

【问题讨论】：

标签： flutter flutter-layout

【解决方案1】：

您可以使用MaterialButton 小部件。
shape 字段可以设置为 CircleBorder 值，这会给你一个圆形按钮。

例如，我修改了我的一个项目视图的代码，其中我有圆角矩形按钮，使其中一个成为圆形：

Container(
  width: 80,
  height: 80,
  child: MaterialButton(
    shape: CircleBorder(
              side: BorderSide(
                width: 2,
                color: Colors.red,
                style: BorderStyle.solid,
              ),
    ),
    child: Text("Login"),
    color: Colors.teal,
    textColor: Colors.amber,
    onPressed: (){},
  ),
),

截图：

【讨论】：

【解决方案2】：

我们可以通过FloatingActionButton小部件创建一个圆形按钮。

 return Container(
      alignment: Alignment.center,
        child: new SizedBox(
      child: FloatingActionButton(
          backgroundColor: Colors.red,
          child: null,
          onPressed: () {
            print("Cliked");
          },)
    ));
  }

输出：

【讨论】：

这不是您从我的回答中看到的唯一解决方案
根据颤振文档：每个屏幕最多使用一个浮动操作按钮。

【解决方案3】：

容器（宽度：90，身高：90，孩子：RaisedButton（onPressed：（）{ }, 颜色：Colors.deepOrange，文本颜色：颜色.白色，形状：CircleBorder（边：BorderSide.none），孩子：文本（'登录'，样式：TextStyle（字体大小：20.0 ), ), ), )

【讨论】：