欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

flutter常见报错 hasSize 为什么出现 解决办法

程序员文章站 2022-05-30 09:27:05
...

flutter常见报错 hasSize 为什么出现 解决办法
出现这个hasSize的报错的原因:

  • 当父Widget需要子Widget给出大小的是时候
  • 子Widget需要占据尽可能多的地方

这个时候 父Widget就会不知道怎么排布而报错

比如一个Container套一个ListView这样就会报错

或者是一个ListView套一个ListView

  Widget buildMakeMaterial() {
    return Container(
      child: ListView.builder(
        itemCount: _meal.ingredients.length,
        itemBuilder: (ctx, index) {
          return Card(
            child: Text(_meal.ingredients[index]),
          );
        }
      ),
    );
  }
  • 解决办法
  1. 当然我们可以给它一个高度来解决这个问题
  2. 同时我们可以根据子Widget的不同来设置对应的属性来让他可以 有一个固定的高度
  • 设置高度

我们给外层定一个高度 这样是可以的

但是这个会出现要一个问题 它会有一个部分滚动 作用

当然如果你就是想做这个效果 那就不用管 这样写就可以了

//  2. 制作材料
  Widget buildMakeMaterial() {
    return Container(
      height: 300,
      child: ListView.builder(
        itemCount: _meal.ingredients.length,
        itemBuilder: (ctx, index) {
          return Card(
            child: Text(_meal.ingredients[index]),
          );
        }
      ),
    );
  }

flutter常见报错 hasSize 为什么出现 解决办法

  • 设置属性

如果是ListView我们可以设置这几个属性让它可以 普通的显示

这里我们设置他们三个样式

  1. shrinkWrap: 是否包裹 true就是要包裹 默认是false
  2. physics: 是否滚动 这样滚动条都看不见了
  3. padding: 以前的flutter版本里面 ListView是有默认的内边距的 所以需要设置这个来减少内边距
//  2. 制作材料
  Widget buildMakeMaterial() {
    return Container(
      color: Colors.orange,
      child: ListView.builder(
        shrinkWrap: true,
        padding: EdgeInsets.zero,
        physics: NeverScrollableScrollPhysics(),
        itemCount: _meal.ingredients.length,
        itemBuilder: (ctx, index) {
          return Card(
            child: Padding(
              padding: const EdgeInsets.all(30.0),
              child: Text(_meal.ingredients[index]),
            ),
          );
        }
      ),
    );
  }

flutter常见报错 hasSize 为什么出现 解决办法

Column这个东西做为子Widget也是同理 所以我们需要设置属性来解决这个问题

如果是Column 的话我们可以给它设置

	Column {
		mainAxisSize: MainAxisSize.min
	}
相关标签: flutter