新的提升按钮

风格

customElevatedButton({radius, color}) => ElevatedButton.styleFrom(
    shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(radius == null ? 100 : radius),
    ),
    primary: color,
);

Icon

Widget saveIcon() => iconsStyle1(
    Icons.save,
);

// Common icon style

iconsStyle1(icon) => Icon(
    icon,
    color: white,
    size: 15,
);

按钮使用

ElevatedButton.icon(
    icon: saveIcon(),
    style:
        customElevatedButton(color: Colors.green[700]),
    label: Text('Save',
        style: TextStyle(color: Colors.white)),
    onPressed: () {
    },
),

你可以使用下面的代码:

ElevatedButton(
      onPressed: () {},
      style: ElevatedButton.styleFrom(
        shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.all(Radius.circular(borderRadius))),
      ),
      child: Text("ok"),
    )

您可以简单地使用RaisedButton

Padding(
  padding: EdgeInsets.only(left: 150.0, right: 0.0),
  child: RaisedButton(
    textColor: Colors.white,
    color: Colors.black,
    child: Text("Search"),
    onPressed: () {},
    shape: new RoundedRectangleBorder(
      borderRadius: new BorderRadius.circular(30.0),
    ),
  ),
)

输出:

更多信息:RSCoder

如果你使用材质应用程序作为你的主小部件，你总是可以使用材质按钮。

Padding(
  padding: EdgeInsets.symmetric(vertical: 16.0),
  child: Material(
    borderRadius: BorderRadius.circular(30.0),//Set this up for rounding corners.
    shadowColor: Colors.lightBlueAccent.shade100,
    child: MaterialButton(
      minWidth: 200.0,
      height: 42.0,
      onPressed: (){//Actions here//},
      color: Colors.lightBlueAccent,
      child: Text('Log in', style: TextStyle(color: Colors.white),),
    ),
  ),
)

你也可以使用ButtonTheme():

下面是示例代码

ButtonTheme(
    minWidth: 200.0,
    shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(18.0),
        side: BorderSide(color: Colors.green)),
    child: RaisedButton(
        elevation: 5.0,
        hoverColor: Colors.green,
        color: Colors.amber,
        child: Text(
            "Place Order",
            style: TextStyle(
                     color: Colors.white, fontWeight: FontWeight.bold),
        ),
        onPressed: () {},
    ),
),

现在我们有一个图标按钮来实现圆形按钮点击和覆盖。但是，背景颜色还不可用，但同样可以通过Circle头像小部件实现，如下所示:

CircleAvatar(
    backgroundColor: const Color(0xffF4F3FA),
    child: IconButton(
        onPressed: () => FlushbarHelper.createInformation(
                             message: 'Work in progress...')
                             .show(context),
        icon: Icon(Icons.more_vert),
    ),
),