目 录CONTENT

文章目录

Flutter 容器控件篇-->Padding

俊阳IT知识库
2023-03-07 / 0 评论 / 0 点赞 / 281 阅读 / 368 字 / 正在检测是否收录...
温馨提示:
本文最后更新于 2023-03-14,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。
广告

文章已同步至掘金:https://juejin.cn/post/6844903956942946318
欢迎访问😃,有任何问题都可留言评论哦~

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"),
	  )
	],
  ),
);

运行效果:

flutter-padding-1


Y_Y

0

评论区