Flutter布局手册：SizedBox组件

SizedBox

这是最简单但最有用的组件。

SizedBox.expand(
  child: Card(
    child: Text('Hello World!'),
    color: Colors.yellowAccent,
  ),
),
复制代码

SizedBox 用作内边距

如果需要添加内边距或边距，可以选择小组件Padding 或Container。但没有一个比Sized的盒子加法简单易读

Column(
  children: <Widget>[
    Icon(Icons.star, size: 50),
    const SizedBox(height: 100),
    Icon(Icons.star, size: 50),
    Icon(Icons.star, size: 50),
  ],
),
复制代码

SizedBox被用作隐形对象

你想通过布尔值控制一个组件多少次() Bool)

Widget build(BuildContext context) {
  bool isVisible = ...
  return Scaffold(
    appBar: AppBar(
      title: Text('isVisible = $isVisible'),
    ),
    body: isVisible 
      ? Icon(Icons.star, size: 150) 
      : const SizedBox(),
  );
}
复制代码

自从显示和隐藏SizedBox是const构造函数使用const SizedBox()变得非常容易。

更简单的解决方案是使用 Opacity 小部件并将 opacity 更改为 0.0.0。该解决方案的缺点是，即使该组件不可见，它仍然占用空间。

作者：Yuqi
链接：https://juejin.im/post/5cfe0d136fb9a07efc497d7d
来源：掘金
。版权归作者所有。商业转载请联系作者获得授权。非商业转载请注明出处。