一、前言
初次使用Flutter开发应用,很多效果的实现都处于探索阶段,现将实现的渐变按钮效果做个记录,以备查阅。
二、效果
- 1、渐变色按钮,带波纹点击效果
// 渐变色按钮
Widget gradientButton() {
return Container(
margin: EdgeInsets.fromLTRB(30, 35, 30, 0),
decoration: BoxDecoration(
gradient: LinearGradient(colors: [Colors.blue, Colors.red]),// 渐变色
borderRadius: BorderRadius.circular(25)
),
child: RaisedButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(25)
),
color: Colors.transparent, // 设为透明色
elevation: 0, // 正常时阴影隐藏
highlightElevation: 0, // 点击时阴影隐藏
onPressed: (){},
child: Container(
alignment: Alignment.center,
height: 50,
child: Text('登 录', style: TextStyle(color: Colors.white, fontSize: 20),),
),
),
);
}

网友评论