I am trying to add bottom padding to my Column inside of the Card widget (refer to picture and code below): [![snapshot of my code and layout][1]][1]
Code:
Column(
children: <Widget>[
Padding(padding: EdgeInsets.fromLTRB(10, 0, 10, 20)),
Text('${e.phrase}', style: TextStyle(color: Colors.white60),),
Divider(height: 5, color: Colors.transparent,),
Text('${e.author}', style: TextStyle(color: Colors.white60),)
],
),
Problem: The more I increase the bottom padding value, the more the content of the column is pushed to the bottom, which is the opposite of what is intended, what am I doing wrong? Please explain. [1]: https://i.sstatic.net/dFKKt.png
If you wanna set padding for Column widget do it this way
Padding(
padding: EdgeInsets.fromLTRB(10, 0, 10, 20),
child: Column(
children: <Widget>[
Text('quotes'),
Text('quotes author')
],
),
),
you passed a Padding widget as a child of Column, thus you just got an empty box as sibling of Text Widget.
if you look into the documentation or source code of Padding widget you'll see that Padding widget accept an optional child widget.
class Padding extends SingleChildRenderObjectWidget {
const Padding({
Key key,
@required this.padding,
Widget child,
}) : assert(padding != null),
super(key: key, child: child);
final EdgeInsetsGeometry padding;
... // other code omitted
}
so if you wanna set padding for the container Column, you should make it child of Padding widget.