Flutter: Remove padding in buttons - FlatButton, ElevatedButton, OutlinedButton

I am looking to remove the default margin of the FlatButton but can't seem to set/override it.

Column(children: <Widget>[
      Container(
          children: [
            FractionallySizedBox(
              widthFactor: 0.6,
              child: FlatButton(
                  color: Color(0xFF00A0BE),
                  textColor: Color(0xFFFFFFFF),
                  child: Text('LOGIN', style: TextStyle(letterSpacing: 4.0)),
                  shape: RoundedRectangleBorder(side: BorderSide.none)))),
      Container(
          margin: const EdgeInsets.only(top: 0.0),
          child: FractionallySizedBox(
              widthFactor: 0.6,
              child: FlatButton(
                  color: Color(0xFF00A0BE),
                  textColor: Color(0xFF525252),
                  child: Text('SIGN UP',
                      style: TextStyle(
                          fontFamily: 'Lato',
                          fontSize: 12.0,
                          color: Color(0xFF525252),
                          letterSpacing: 2.0)))))
    ])

I've come across things like ButtonTheme and even debugDumpRenderTree() but haven't been able to implement them properly.

Solution 1:

FlatButton(materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,)

Solution 2:

I find it easier to just wrap the button in a ButtonTheme.

Specify the maxWith and height (set to zero to wrap the child) and then pass your button as the child.

You can also move most of your button properties from the button to the theme to gather all properties in one widget.

ButtonTheme(
  padding: EdgeInsets.symmetric(vertical: 4.0, horizontal: 8.0), //adds padding inside the button
  materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, //limits the touch area to the button area
  minWidth: 0, //wraps child's width
  height: 0, //wraps child's height
  child: RaisedButton(onPressed: (){}, child: Text('Button Text')), //your original button
);