Flutter ButtonRow padding

user_3694477 0
Viewed 16174

I am developing an app in Flutter with Dart and am generally finding layout quite straightforward. However, I am running into a problem which I think is related to default padding between widgets.

I have two flutter ButtonRows in a Column which render with a quite large gap between them which I would like to eliminate. I guess it is caused by padding and have tried various approaches with no success so far. An extract from the code is as follows:

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      ...
      body: new Column(
        ...
        children: <Widget>[
          ...
          new Container(
            margin: new EdgeInsets.all(0.0),
            child: new Padding(
              padding: new EdgeInsets.all(0.0),
              child: new ButtonBar(
                ...
                children: <Widget>[
                  new MaterialButton(
                    ...
                  ),
                  new MaterialButton(
                    ...
                  ),
                ),
              ),
            ),
          ),
          new Container(
            margin: new EdgeInsets.all(0.0),
            child: new Padding(
              padding: new EdgeInsets.all(0.0),
              child: new ButtonBar(
                ...
                children: <Widget>[
                  new MaterialButton(
                    ...
                  ),
                  new MaterialButton(
                    ...
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
dart flutter
2 Answers

Also, the ButtonBar itself has a buttonPadding attribute that you can customize.

Overrides the surrounding ButtonThemeData.padding to define the padding for a button's child (typically the button's label).

If null then it will use the surrounding ButtonBarTheme.buttonPadding. If that is null, it will default to 8.0 logical pixels on the left and right.

ButtonBar(
  buttonPadding: EdgeInsets.all(0),
  children: <Widget>[
    FlatButton(
      child: Text('Hello'),
      onPressed: () => print(),
      materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
    ),
  ],
),
user_25031850
Related