Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change color of RaisedButton from theme not working

I tried changing the color of all my RaisedButtons from the themeData but it refused to work. All other properties, such as fontSize and fontWeight changed successfully. The color of the text only changes from black to white when the brightness property of themeData is changed to Brightness.dark.

Is there a way I can solve this issue? What could I be doing wrong?

Here is my sample code:

 return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primaryColor: Color(0XFF212845),
        scaffoldBackgroundColor: Color(0XFF212845),
        primarySwatch: Colors.yellow,
        buttonColor: Color(0XFFF8D320),
        textTheme:  TextTheme(
          button: TextStyle(
            color: Colors.green, // This is not working.
            fontSize: 30.0,
            fontWeight: FontWeight.bold
          )
        )
      ),
      home:MenuPage(),
    );
like image 457
nonybrighto Avatar asked Dec 30 '18 20:12

nonybrighto


People also ask

Why RaisedButton is not working in Flutter?

Solution. The solution is adding onPressed() property to RaisedButton. Because, if onPressed() property is not provided, even with the empty function, RaisedButton is considered as disabled.

How do I change the button color in theme Flutter?

Go to your main.Inside the MaterialApp, find the ThemeData widget. Add the textButtonTheme property. Add the style property and change the color as you would change it for normal TextButton. Open the AboutDialog and see the result.


3 Answers

For other people coming to this question, one reason that a button may not change colors is that it is disabled, which happens when you don't have the onPressed method set.

RaisedButton(
  color: Theme.of(context).accentColor,
  onPressed: () {}, //                        <-- need to add this
  child: Text(...),
),

enter image description here

like image 79
Suragch Avatar answered Oct 08 '22 17:10

Suragch


if you are giving a color to the color property and it doesn't show ,then probably you haven't implemented the onPressed property, because in this state the button will show it's disabled color , which is no color at all.

set it like this:

onPressed: () {},

giving it an anonymous function like that while not implementing anythig ( or something if you wish) will give it color

like image 38
Dyary Avatar answered Oct 08 '22 17:10

Dyary


Add buttonTheme and accentColor to your ThemeData , like this:

  ThemeData(
            primaryColor: Color(0XFF212845),
            scaffoldBackgroundColor: Color(0XFF212845),
            primarySwatch: Colors.yellow,
            buttonColor: Color(0XFFF8D320),
            buttonTheme: ButtonThemeData(textTheme: ButtonTextTheme.accent),
            accentColor: Colors.green,
like image 33
diegoveloper Avatar answered Oct 08 '22 18:10

diegoveloper