Flutter 容器控件篇-->Padding

281 阅读1分钟

Flutter 中可以使用Padding组件来给其子节点添加填充(留白),和边距的效果类似。

源码示例

构造函数如下:

Padding({
  ...
  EdgeInsetsGeometry padding,
  Widget child,
})

EdgeInsetsGeometry是一个抽象类,开发中,我们一般都使用EdgeInsets类,它是EdgeInsetsGeometry的一个子类,定义了一些设置填充的便捷方法。

属性解释

EdgeInsets

EdgeInsets提供的便捷方法:

  • fromLTRB(double left, double top, double right, double bottom):分别指定四个方向的填充。

  • all(double value) : 所有方向均使用相同数值的填充。

  • only({left, top, right ,bottom }):可以设置具体某个方向的填充(可以同时指定多个方向)。

  • symmetric({ vertical, horizontal }):用于设置对称方向的填充,verticaltopbottomhorizontalleftright

代码示例:

Padding(
  //上下左右各添加50像素补白
  padding: EdgeInsets.all(50.0),
  child: Column(
	//显式指定对齐方式为左对齐,排除对齐干扰
	crossAxisAlignment: CrossAxisAlignment.start,
	children: <Widget>[
	  Padding(
		//左边添加25像素补白
		padding: EdgeInsets.only(left: 25.0),
		child: Text("xxxxxx"),
	  ),
	  Padding(
		//上下各添加25像素补白
		padding: EdgeInsets.symmetric(vertical: 25.0),
		child: Text("yyyyyy"),
	  ),
	  Padding(
		// 分别指定四个方向的补白
		padding: EdgeInsets.fromLTRB(10.0, .0, 10.0, 10.0),
		child: Text("zzzzzz"),
	  )
	],
  ),
);

运行效果:


Y_Y