Flutter教学目录持续更新中

Github源代码持续更新中

1.Center介绍

将其子widget居中显示在自身内部的widget

2.Center属性

widthFactor：宽度因子
heightFactor：高度因子
child：

3.Center尺寸调节（约束）

widthFactor、heightFactor都为空，宽度会尽可能的大，高度则刚好包裹子控件
widthFactor（heightFactor）不为空，Center的宽度（高度） = 因子*子控件的宽度（高度）
注意：因子要么为空，要么>=0

4.使用

1602419025(1).png

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('Center'),
    ),
    body: Column(
      children: [
        Container(
          color: Colors.red,
          child: Center(
            child: Text(
              'Center',
              style: TextStyle(backgroundColor: Colors.amber),
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10),
          color: Colors.red,
          child: Center(
            widthFactor: 2,
            child: Text(
              'Center',
              style: TextStyle(backgroundColor: Colors.amber),
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10),
          color: Colors.red,
          child: Center(
            heightFactor: 2,
            child: Text(
              'Center',
              style: TextStyle(backgroundColor: Colors.amber),
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10),
          color: Colors.red,
          child: Center(
            widthFactor: 2,
            heightFactor: 2,
            child: Text(
              'Center',
              style: TextStyle(backgroundColor: Colors.amber),
            ),
          ),
        ),
      ],
    ),
  );
}

下一节：Layout组件之Align