Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
children: [
// ... some widgets
Padding(
padding: const EdgeInsets.all(-20.0), // Error: How to do something like this?
child: FooWidget()
),
// ... more widgets
BarWidget(), // Remove padding from here also
// ... and some more widgets
],
),
)
I'm providing a padding of 20
to my Column
, but I want to remove this padding from some of its children, like FooWidget
, BarWidget
, etc. How can I do that?
Note: I'm not looking for workarounds like provide the padding to other widgets instead of the root Column
or wrap those widgets in another Column
and provide that column a padding, etc.
CodePudding user response:
you can apply transformation to the widgets that you want to remove the padding for, for example:
Container(
transform: Matrix4.translationValues(-20.0, 0, 0.0), //here
child: FooWidget()),
CodePudding user response:
Padding in inside the limit box of area of the child, but you need to margins by negative values.
Use Positioned()
widget as this:
Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
children: [
// ... some widgets
// Padding(. comment this
// padding: const EdgeInsets.all(-20.0), and comment this
Positioned( // wrap with this widget by any
// double values of top, bottom,
// left or right as you want.
top: 10.0,
left: -15.0,
right: -15.0,
child: FooWidget()
),
/// TODO: the same idea to any widget
// ... more widgets
BarWidget(), // Remove padding from here also
// ... and some more widgets
],
),
)