flutter-定位

Flutter组件之定位
##定位方式一：

可以在所需组件外层包裹一个Container，利用alignment: FractionalOffset(x, y)进行定位

例子

Container(
  padding: EdgeInsets.all(5.0),
  alignment: FractionalOffset(0.5, 0.8),
  decoration: BoxDecoration(
    gradient: LinearGradient(
      begin: Alignment.topCenter,
      end: Alignment.bottomCenter,
      colors: <Color>[
        Colors.red,
        Colors.orange,
        Colors.yellow
      ],
    ),
  ),
  child: Text(
    "Foreground Text",
    style: TextStyle(color: Colors.white, fontSize: 20.0),
  ),
),

##定位方式二：

利用 Positioned 组件进行定位

必选

child     => Widget      所包含的组件（孩子）

可选

left     => double    左边距离
top         => double    顶部距离
right     => double    右边距离
bottom     => double    底部距离
width    => double    宽度
height    => double    高度

例子

Positioned(
    left: 20.0,
    top: 120.0,
    child: new Text("今天今天今天今天今天今天今天"),
),

##定位方式三：

利用 Center 组件进行居中定位

必选

child     => Widget      所包含的组件（孩子）

可选

widthFactor        => double        组件宽度为孩子宽度的N倍
heightFactor        => double        组件高度为孩子高度的N倍

例子

//该组件的宽度为100.0，高度为200.0

Center(
  widthFactor: 1.0,
  heightFactor: 2.0,
  child: Container(
    width: 100.0,
    height: 100.0,
    color: Colors.lightGreenAccent,
  ),
),

原文链接：https://blog.csdn.net/qq_33488315/article/details/90794365