Flutter 2.0 - How to change TextButton splash color when pressed?
Solution 1
TextButton(
style: ButtonStyle(
overlayColor: MaterialStateColor.resolveWith((states) => Colors.red),
),
child: ...,
)
reference to Flutter TextButton splashColor property
Solution 2
First keep in mind that the primary property on a TextButton sets the colour of its text and icon. It does not change the ripple color. Secondly in Textbutton there is no direct property to change splash color. So if you want to change splash color to transparent you can do it like this.
TextButton(
style: ButtonStyle(
overlayColor: MaterialStateProperty.all(Colors.________),
),
)
Solution 3
You can quickly set the splash color of a TextButton
using the helper method TextButton.styleFrom()
. Note that this will actually set both the foreground color and splash color based on the foreground color, which in most of the cases is what you want:
TextButton(
style: TextButton.styleFrom(primary: Colors.red),
child: const Text('Text Button'),
onPressed: () {},
)
Live Demo
Raine Dale Holgado
BS in Computer Engineering, graduated from Silliman University. Interested in Web/Mobile development and Dart/Flutter. Love to explore new technology.
Updated on December 28, 2022Comments
-
Raine Dale Holgado 25 minutes
FlatButton is deprecated and shouldn't be used. Used TextButton instead.
On my previous
FlatButton
widget, I was able to changed the splash color when on pressed. But now I'm usingTextButton
widget, how can I change its color the efficient way on theMaterialApp ThemeData
or directly on theTextButton
widget.Currenly this is my TextButton
TextButton( style: TextButton.styleFrom( primary: Colors.red, textStyle: TextStyle( color: Colors.black45, fontFamily: "Courier Prime", ), backgroundColor: Colors.transparent, ), onPressed: () {}, child: Text( "Student", style: TextStyle(fontWeight: FontWeight.bold), ), ),
overlayColor is used to indicate that the button is focused, hovered, or pressed.
But I cant find this
overlayColor
-
Akshay Nayka over 1 yearyou can use
setState
to change color when pressed -
Raine Dale Holgado over 1 year@AkshayNayka , its the Splash color what i mean like when you pressed a button theres an accent colors slowly filling up the button. Its not the Button Color.
-
-
Nghien Nghien 7 monthsThank bro, this way is faster & shorter than the way use ButtonStyle() like others recommended