Flutter 2021 中的按钮
在本文中，我们将介绍令人惊叹的 Flutter 按钮，它们可以帮助所有初学者或专业人士为现代应用程序设计漂亮的 UI。
首先让我告诉你关于 Flutter 中按钮的一件重要事情，在flutter最新版本中以下Buttons在fluter中被废弃了：
| 废弃的 | 推荐的替代 |
|---|---|
| RaisedButton | ElevatedButton |
| OutlineButton | OutlinedButton |
| FlatButton | TextButton |
那么让我们来探索一下 Flutter 中的按钮。
Elevated Button
StadiumBorder
ElevatedButton(
onPressed: (){},
child: Text('Button'),
style: ElevatedButton.styleFrom(
shadowColor: Colors.green,
shape: StadiumBorder(),
padding: EdgeInsets.symmetric(horizontal: 35,vertical: 20)),
)
RoundedRectangleBorder
ElevatedButton(
onPressed: (){},
child: Text('Button'),
style: ElevatedButton.styleFrom(
shadowColor: Colors.green,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
),
CircleBorder
ElevatedButton(
onPressed: () {},
child: Text('Button'),
style: ElevatedButton.styleFrom(
shape: CircleBorder(),
padding: EdgeInsets.all(24),
),
)
BeveledRectangleBorder
ElevatedButton(
onPressed: () {},
child: Text('Button'),
style: ElevatedButton.styleFrom(
shape: BeveledRectangleBorder(
borderRadius: BorderRadius.circular(12)
),
),
)
Outlined Button
StadiumBorder
OutlinedButton(
onPressed: () {},
child: Text('Button'),
style: OutlinedButton.styleFrom(
shape: StadiumBorder(),
),
)
RoundedRectangleBorder
OutlinedButton(
onPressed: () {},
child: Text('Button'),
style: OutlinedButton.styleFrom(
shape: BeveledRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
)
CircleBorder
OutlinedButton(
onPressed: () {},
child: Text('Button'),
style: OutlinedButton.styleFrom(
shape: CircleBorder(),
padding: EdgeInsets.all(24),
),
)
BeveledRectangleBorder
OutlinedButton(
onPressed: () {},
child: Text('Button'),
style: OutlinedButton.styleFrom(
shape: BeveledRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
)作者：传道士
链接：https://juejin.cn/post/7025939451356381197
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
