padding 和 margin
属性值描述
fromLTRB(double left, double top, double right, double bottom)分别指定四个方向的补白。all(double value)所有方向均使用相同数值的补白。only({left, top, right ,bottom })可以设置具体某个方向的补白(可以同时指定多个方向)。symmetric({ vertical, horizontal })用于设置对称方向的补白,vertical指top和bottom,horizontal指left和right。
如果想在Container和子元素之间添加空白可以使用padding属性,代码如下:
Container(
color: Colors.blue,
child: Text('老孟'),
padding: EdgeInsets.all(20),
)
12345
margin的用法和padding一样,padding表示内边距,margin表示外边距。
示例
class _home extends StatefulWidget {
@override
State<StatefulWidget> createState() {
// TODO: implement createState
return _homeState();
}
}
class _homeState extends State<_home> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: new Text("title"),
centerTitle: true,
),
body: //通过ConstrainedBox来确保Stack占满屏幕
Padding(
//上下左右各添加16像素补白
padding: EdgeInsets.all(16.0),
child: Column(
//显式指定对齐方式为左对齐,排除对齐干扰
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Padding(
//左边添加8像素补白
padding: const EdgeInsets.only(left: 8.0),
child: Text("Hello world"),
),
Padding(
//上下各添加8像素补白
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: Text("I am Jack"),
),
Padding(
// 分别指定四个方向的补白
padding: const EdgeInsets.fromLTRB(20.0, .0, 20.0, 20.0),
child: Text("Your friend"),
)
],
),
));
}
}
123456789101112131415161718192021222324252627282930313233343536373839404142434445