Flutter（46）：Layout组件之Center
2020-10-11 本文已影响0人
starryxp
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
