只想简单的调整一个子元素在父元素中的位置的话,使用Align组件会更简单一些
Align({
Key key,
this.alignment = Alignment.center, // 调整内部子控件的位置
this.widthFactor,
//为null时 尽可能的占最大位置 , 他是一种系数,
//通过 widthFactor * zi控件的width 来决定Align 的宽度
this.heightFactor,//同上
Widget child,
})
示例1
Container(
height: 120.0,
width: 120.0,
color: Colors.blue[50],
child: Align(
alignment: FractionalOffset(0.5,0.5),//FractionalOffset(0.1, 0.1)
child: FlutterLogo(
size: 60,
),
),
),
注意 : FractionalOffset(0.5,0.5) 应为这里传的0.5,0.5 所以在中间显示
Align(
widthFactor: 2,
heightFactor: 2,
alignment: FractionalOffset(0.1,0.5),
child: FlutterLogo(
size: 60,
),
),
没有背景了 ,因为FractionalOffset(0.1,0.5), 这里是0.1 所有靠左一点
Center
//Center继承自Align
//但没有 alignment 属性,
//所以只能默认居中显示了 ,
const Center({ super.key, super.widthFactor, super.heightFactor, super.child });
Center(
child: Text(""),
)
// 使用时,因为没有设置 widthFactor ,heightFactor 的值 ,
// 所有内部Text("") 会居中显示
AlignmentGeometry 是一个抽象类,它有两个常用的子类:Alignment和 FractionalOffset
未完待续