Flutter - how to remove default padding (48 px as per doc) from widgets (IconButton, CheckBox, FlatButton)
wrap your CheckBox
inside SizedBox
will resize the padding of the check box
SizedBox(
height: 24.0,
width: 24.0,
child: Checkbox(...),
)
EDIT
Set the value of materialTapTargetSize to MaterialTapTargetSize.shrinkWrap
Checkbox(
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
...
)
Alternatively, you can achieve this by customising the Checkbox widget.
-
Create a CustomCheckbox using the exact code from flutter/packages/flutter/lib/src/material/checkbox.dart.
-
Add a new field to your CustomCheckbox widget
final bool useTapTarget;
-
Make sure to add the new field to your constructor with it default value set to true.
this.useTapTarget = true
-
Modify the build method in the _CheckboxState method. Add this block of code above the return call.
Size noTapTargetSize = Size(CustomCheckbox.width, CustomCheckbox.width); final BoxConstraints additionalConstraints = BoxConstraints.tight(widget .useTapTarget? size : noTapTargetSize);
-
Finally, use your CustomCheckbox widget in your code, and set your custom field to false to remove material padding. example
Container( margin: EdgeInsets.only(right: 15), child:CustomCheckbox( value: _checked, onChanged: _onCheckBoxChange, useTapTarget: false, activeColor: Colors.teal), )
There are three options:
1.
// or Checkbox()
Radio(
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
)
// or Checkbox()
Radio(
visualDensity: VisualDensity(horizontal: -4, vertical: -4),
)
SizedBox(
height: 20,
width: 20,
// or Checkbox()
child: Radio()
)