CODEWITHSUNDEEP
flutterdart
myname
myname

Reputation: 231

How change l backgroundcolor of button theme,text color and height in flutter?

i'm using Button theme in my project im not able to change the backgroundcolor,text color and also im not able to reduce the height of the button theme can someone please look in to it.

Here's my code:

Widget _signInButton() {


    return ButtonTheme(

     minWidth: 325,

      child: OutlineButton(
        splashColor: Colors.grey,
        onPressed: () {
          signInWithGoogle().whenComplete(() {
            Navigator.of(context).push(
              MaterialPageRoute(
                builder: (context) {
                  return FirstScreen();
                },
              ),
            );
          });
        },
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(40)),
        highlightElevation: 0,
        borderSide: BorderSide(color: Colors.grey),
        child: Padding(
          padding: const EdgeInsets.fromLTRB(0, 10, 0, 10),
          child: Row(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Flexible(
                  flex: 1,
                  child: Image(image: AssetImage("Assets/google_logo.png"), height: 35.0)),
              Expanded(
                flex: 1,
                child: Padding(
                  padding: const EdgeInsets.only(left: 10),
                  child: Text(
                    'Sign in with Google',
                    style: TextStyle(
                      fontSize: 15,
                      color: Colors.grey,

Upvotes: 1

Views: 2156

Answers (1)

Harshvardhan Joshi
Harshvardhan Joshi

Reputation: 3193

try adding height: 8.0 or layoutBehavior:ButtonBarLayoutBehavior.constrained in ButtonTheme. With any one of these options, you can adjust the height and padding of the button.

Note: adjust the height value as you please. I have set it to 8.0 as an example

You can use buttonColor property in ButtonTheme for changing the button's color. Or the color property in Child Button should do the work.

But since you are using an OutlineButton it won't work as it has no area to paint the color on, it just has an outline.

Note: You should replace the OutlineButton with RaisedButton.

For Text color you can use style property of the Text widget.

A little example code would be as following:

ButtonTheme(
height: 8.0,
buttonColor: Colors.red,
child: RaisedButton(
         color: Colors.blue,
         child: Text(
           'Button',
           style: TextStyle(color: Colors.white),
          ),
          onPressed: () {},
       ),
)

Upvotes: 2

Related Questions