After Flutter Upgrade "FlatButton" is deprecated and I have to use TextButton instead. I didn't find a solution for a new button-type with width and height.
This is my working FlatButton. How can I solve it with textButton or elevatedButton?
_buttonPreview(double _height, double _width) {
return FlatButton(
onPressed: () { },
height: _height,
minWidth: _width,
color: Colors.grey,
padding: EdgeInsets.all(0),
child: Text(
"some text",
style: TextStyle(color: Colors.white),
),
);
}
I followed the guide here: https://flutter.dev/docs/release/breaking-changes/buttons .
_buttonPreview(double _height, double _width) {
final ButtonStyle flatButtonStyle = TextButton.styleFrom(
minimumSize: Size(_width, _height),
backgroundColor: Colors.grey,
padding: EdgeInsets.all(0),
);
return TextButton(
style: flatButtonStyle,
onPressed: () {},
child: Text(
"some text",
style: TextStyle(color: Colors.white),
),
);
}
You could do something like this.
FlatButton To TextButton Migration
final ButtonStyle flatButtonStyle = TextButton.styleFrom(
primary: Colors.white,
minimumSize: Size(88, 44),
padding: EdgeInsets.symmetric(horizontal: 16.0),
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(2.0)),
),
backgroundColor: Colors.blue,
);
return TextButton(
style: flatButtonStyle,
onPressed: () {
print('Button pressed');
},
child: Text('FlatButton To TextButton Migration'),
);
}
Sample Buttons
Reference
FlatButton also can replace with MaterialButton
MaterialButton(
onPressed: () { },
height: _height,
minWidth: _width,
color: Colors.grey,
padding: EdgeInsets.all(0),
child: Text(
"some text",
style: TextStyle(color: Colors.white),
),
),
FlatButton
is deprecated, so the best option is ElevatedButton
.
Here is the code:
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.teal,
fixedSize: Size.fromWidth(100),
padding: EdgeInsets.all(10),
),
child: Text("Press Here"),
onPressed: () {
//Code Here
},
)
Create a style that you might use for the button like this:
final ButtonStyle flatButtonStyle = TextButton.styleFrom(
backgroundColor: Colors.blue,
padding: EdgeInsets.all(8),
//few more styles
);
Then use the above style while replacing your flatButton
return TextButton(
style: flatButtonStyle,
onPressed: () {},
child: Text(
"some text",
style: TextStyle(color: Colors.white),
),
);
_buttonPreview(double _height, double _width) { return MaterialButton( onPressed: () { }, height: _height, minWidth: _width, color: Colors.grey, padding: EdgeInsets.all(0), child: Text( "some text", style: TextStyle(color: Colors.white), ), ); }
TextButton
instead of FlatButton
in new flutter, read this Document .
TextButton(
onPressed: () {/*what happened when tapped...*/},
child: /*you can pass the widget you want to show in button, Usually use : Icon & Text*/
),
This worked for me, Use:
ElevatedButton(
onPressed: () {},
child: Text('Simple FlatButton'),
)
Instead of:
FlatButton(
onPressed: () {},
child: Text('Simple FlatButton'),
)
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.