如图所示
思路
ElevatedButton 组件,我在网上没有找到直接设置的圆角和渐变色背景的属性。笔者的思路是,将按钮的背景色和阴影去除,在其外包裹Container ,设置外层容器的圆角和背景色即可。
代码
Container(
width: 340,
height: 49,
//在此设置
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(9),
gradient: const LinearGradient(colors: [
Color(0xffde53fc),
Color(0xff846dfc),
Color(0xff30c1fd),
]),
),
child: ElevatedButton(
onPressed: onTap,
child: const Text(
'立即存款',
style: TextStyle(fontSize: 17, color: Colors.white),
),
style: ButtonStyle(
//去除阴影
elevation: MaterialStateProperty.all(0),
//将按钮背景设置为透明
backgroundColor: MaterialStateProperty.all(Colors.transparent),
),
),
)
|