How do i add give height and make its corner rounded in the new TextButton
This is how to do it in FlatButton which is now deprecated.
FlatButton(
height: 44,
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4.0)),
color: Colors.green[900],
minWidth: double.infinity,
onPressed: () => cart.gtynAddToCart(productID),
child: Text(
'Button',
style: TextStyle(color: Colors.white),
));
Since FlatButton
is deprecated in Flutter 2.0, you can use TextButton
try
TextButton(
onPressed: () => cart.gtynAddToCart(productID),
child: Container(
alignment: Alignment.center,
height: 44,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(4)),
color: Colors.green[900],
),
style:ButtonStyle(tapTargetSize:MaterialTapTargetSize.shrinkWrap,
),
// minWidth: double.infinity,
child: Text(
'Button',
style: TextStyle(color: Colors.white),
)))
I also find out another way to achieve, maybe you are instered
TextButton(
onPressed: () => cart.gtynAddToCart(productID),
style: ButtonStyle(
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
minimumSize:
MaterialStateProperty.all(Size(double.infinity, 44)),
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(4.0)),
),
backgroundColor:
MaterialStateProperty.all(Colors.green[900])),
child: Text(
'Button',
style: TextStyle(color: Colors.white),
textAlign: TextAlign.center,
))
for the corner radius you have to use shape properties inside you can set something like below and for the height and width just give it padding.
FlatButton(
child: Text('Rounded Rectangle Border'),
onPressed: () {},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15)),
color: Colors.pink,
textColor: Colors.white,
padding: EdgeInsets.symmetric(horizontal: 50, vertical: 30),
)
Use instead RawMaterialButton:
RawMaterialButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(22),
),
side: BorderSide(color: Colors.white, width: 0.5)),
onPressed: () {},
child:
Text("Sign UP", style: TextStyle(color: Colors.white)),
),
the new TextButton widget is difficult to style:)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.