Raised button width decrease flutter

Viewed 5710

Raised button taking too much width and I want to decrease according to my layout...

ButtonTheme(
    minWidth: 16.0,
    height: 30.0,
    child: RaisedButton(
     onPressed:()=>print("a"),
     child: new Row(
       children: <Widget>[
         Padding(
           padding: const EdgeInsets.only(right: 6.0),
           child: Text('SORT BY',style: TextStyle(fontSize: 12.0),),
         ),
         Icon(Icons.keyboard_arrow_down,size: 20.0,),
       ],
     ),
    ),
),
2 Answers

I got the answer

We need to add padding in Raised button for removing default padding

ButtonTheme(
      minWidth: 16.0,
      height: 30.0,
      child: RaisedButton(
        padding: const EdgeInsets.all(8.0),
        onPressed: () => print("a"),
        child: new Row(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(right: 6.0),
              child: Icon(
                Icons.filter,
                size: 16.0,
              ),
            ),
            Text(
              'FILTER',
              style: TextStyle(fontSize: 12.0),
            ),
          ],
        ),
      ),
    ),

You are using Row widget inside your RaisedButton and it's taking the maximum width, you can fix it using the min space mainAxisSize: MainAxisSize.min like this:

  ButtonTheme(
          minWidth: 16.0,
          height: 30.0,
          child: RaisedButton(
            onPressed: () => print("a"),
            child: new Row(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.only(right: 6.0),
                  child: Text(
                    'SORT BY',
                    style: TextStyle(fontSize: 12.0),
                  ),
                ),
                Icon(
                  Icons.keyboard_arrow_down,
                  size: 20.0,
                ),
              ],
            ),
          ),
        ),
Related