I have this custom widget:
Widget ButtonsFunction(String text , IconData icon,Function action){
return Column(
children: [
ElevatedButton(
onPressed: () => action,
style: ElevatedButton.styleFrom(
padding: EdgeInsets.all(27.0),
primary: Colors.grey[300],
side: BorderSide(color: Colors.grey , width: 0.5),
elevation: 0,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15.0)),
),
child: Icon(icon , color: Colors.indigo,),
),
SizedBox(height: 8.0,),
Text(text, style: TextStyle(fontWeight: FontWeight.bold),),
],
);
}
and this call:
ButtonsFunction('Corporate', Icons.wallet,() => Navigator.pushNamed(context,'/CorporateMatters')),
But nothing happen when i click on the button, i've tried to write the button code without the function and it works normally but with this function i cant navigate
Call it directly, change this:
onPressed: () => action,
to this:
onPressed: action,
Inside your custom widget you should trigger the function you are passing.
Like this:
onPressed: () => action(),
or this:
onPressed: () => action.call(),
Remove () => and call directly action and I advise you also to use named parameters for clearer code.
onPressed: action,
I prefer using VoidCallback in this case,
Widget ButtonsFunction(String text, IconData icon, VoidCallback action) {
return Column(
children: [
ElevatedButton(
onPressed: action,
Also note that I am using onPressed: action, instead of creating anonymous function like onPressed: () => action. If you like to do this way, you need to use () to call the method like onPressed: () => action().
Related
I want to add a filter option button without adding a search bar.
ScreenShot
You can do like this
InkWell(
onTap: () =>
child: const Icon(
Icons.tune,
color: Colors.grey,
),
),
Make use of IconButton like below
IconButton(
icon: Icon(Icons.tune),
onPressed: () {},
)
I have made a flatbutton icon, but it seems this is depreciated in the current flutter version. I have tried to upgrade it to a text button, but it does not show the text next to the icon.
This is the original code that has to be adapted to become a text button. Should I have to define a class or function to make it so?
Row(
children: [
FlatButton.icon(
onPressed: () => print('Live'),
icon: const Icon(
icons.videocam,
color: Colors.red,
),
label: Text('Live'),
),
],
)
Thx! :)
you can use TextButton.icon() widget. here an example:
TextButton.icon(
onPressed: () => print('Live'),
icon: Icon(Icons.videocam_rounded),
label: Text('Live'),
),
and here the result:
You can use an IconButton widget:
Row(
children: [
IconButton(
onPressed: () => print('Live'),
icon: const Icon(icons.videocam, color: Colors.red),
),
Text('Live'),
]
)
I am trying to change the color of the button when I click on it. Can you help me because I really can't do it. Thank you.
Container(
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new MaterialButton(
child: new Text("1"),
color: Colors.greenAccent,
splashColor: Colors.red,
onPressed: (){
test=0;
test=1;
},
),
new MaterialButton(
child: new Text("2"),
color: Colors.greenAccent,
onPressed: (){
test=0;
test=2;
},
Try like this
Color mySplashColor=Colors.blue; //define in build function or state class
splashColors: mySplashColor,
onPressed(){
setState(){
splashColors=Colors.red;
}
}
The way to do it is by using state. The first thing you should do is to transform your widget into a stateful widget.
After that you set a state variable of type Color called buttonColor to have the default value of "Colors.greenAccent". You then set your MaterialButton color property to this variable.
The only thing to do now is to use () => setState(() => buttonColor = Colors.red ) as the button onPressed property.
In my application I use inkwell/flat button/ink response/Gesture Detector/RaisedButton, etc for my tap component. The application already in release Alpha channel (Android) and Test Flight (IOS). However the user is not satisfied with the result, because all the button is less responsive/sensitive compare to native button component (Android/iOS). Is there any alternative or another way in Flutter to create tapable widget or button that have responsiveness similar with native application?
Example code:
InkWell(
onTap: () => Navigator.of(context).pushNamed(
Routes.MEMBERSHIP,
arguments: membershipPlanModel),
child: Card(
margin: EdgeInsets.only(
right: 16,
),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(10))),
child: Container(...
Another code:
FlatButton(
onPressed: () async {
_cancelTransaction();
Navigator.of(context).pop(true);
Navigator.of(context).pop(true);
},
child: Text(
Labels.YES,
style: Fonts.GHOST,
),
),
Hello i try to build button call phone number when click .but when click appear different number this is "94343832826624531" and this is not my number in database
FlatButton(
onPressed: () => launch("tel:widget.data.mobile1"),
child: new Text("Call me")),
),
Well, you need to use either
FlatButton(
onPressed: () => launch("tel:${widget.data.mobile1}"),
child: new Text("Call me")),
),
Or
FlatButton(
onPressed: () => launch("tel:"+widget.data.mobile1),
child: new Text("Call me")),
),