1、Alignment
const Alignment(this.x, this.y)
: assert(x != null),
assert(y != null);
参数x:-1:最左边 1:最右边 0:中间
参数y:-1:最上边 1:最下边 0:中间
比如:Alignment(0,0)代表控件的中心
坐标系如下图:
Container(
width: 300,
height: 100,
color: Color(0xFFFF0000),
alignment: Alignment(1,0),
child: Text('Alignment(1,0)',
textDirection: TextDirection.rtl,),
)
效果:
Alignment定义了我们常用的位置:
2、FractionalOffset
FractionalOffset继承Alignment,他们2个区别就是坐标系不一样,Alignment的原点是中心,而FractionalOffset原点是左上角。
Container(
width: 300,
height: 100,
color: Color(0xFFFF0000),
alignment: FractionalOffset(0,0),
child: Text('FractionalOffset(0,0)',
textDirection: TextDirection.rtl,),
),
效果:
FractionalOffset定义了我们常用的位置:
3、AlignmentDirectional
AlignmentDirectional 的坐标系和Alignment比较像,原点在中心,不过AlignmentDirectional的起始位置和书写(TextDirection)方向有关
demo:
Container(
width: 300,
height: 100,
color: Color.fromARGB(255, 66, 165, 245),
child: new Text(
"Flutter Cheatsheet",
textDirection: TextDirection.ltr,
style: TextStyle(
),
),
alignment: AlignmentDirectional.topStart,
);
二真机上的效果:
我们发现书写方向不同位置并没有发生变化啊,不知道是我用错了,还是哪里没有注意到?希望大家找找问题的所在