The overflowing RenderFlex has an orientation of Axis.horizontal. The edge of the RenderFlex that is

错误日志:

Performing hot reload...
Syncing files to device MI 8...
Reloaded 9 of 1380 libraries in 963ms.

======== Exception caught by rendering library =====================================================
The following assertion was thrown during layout:
A RenderFlex overflowed by 289 pixels on the right.

The relevant error-causing widget was: 
  Row file:///H:/project/flutter/anguo/flutter_ad/lib/page/res_detail_page.dart:29:8
The overflowing RenderFlex has an orientation of Axis.horizontal.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.

Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.

导致原因:

Row或者是Column这种没有确定宽高度的Widget中使用了同样没有确定宽高度的子Widget导致的,例如ListViewWrapGridView等,Flutter不知道该用什么样的宽高来渲染widget,所以就会显示不出来。

代码:

_buildBody() {
    return Stack(
      children: [
        //第一层
        Row(
          children: [
            Lottie.asset('assets/lottie/background.json'),
          ],
        ),
        //第二层
        ListView(
          children: [],
        )
      ],
    );
  }


如何解决?

Flutter Expanded

Expanded是一个用展开Row、Column、或者Flex子控件的一个Widget,用于填充可用空间。这个好像可以满足我们的需求,下面我们详细看看它。

  _buildBody() {
    return Stack(
      children: [
        //第一层
  
          Row(
            children: [
              Expanded(child: Lottie.asset('assets/lottie/background.json')),
            ],
          ),
        //第二层
        ListView(
          shrinkWrap: true,
          children: [],
        )
      ],
    );

Flutter Flexible

这要也可以

   Row(
            children: [
              Flexible(child: Lottie.asset('assets/lottie/background.json')),
            ],
          ),

如果是ListView出现的问题可以使用

ListView(
  shrinkWrap: true,
  children: [],
)

shrinkWrap 使用子组件高度。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Introduction Any idiot can write code. Even teenagers can sling gates and PAL equations around. What is it that separates us from these amateurs? Do years of college necessarily make us professionals, or is there some other factor that clearly delineates engineers from hackers? With the phrase "sanitation engineer" now rooted in our lexicon, is the real meaning behind the word engineer cheapened? Other professions don't suffer from such casual word abuse. Doctors and lawyers have strong organizations that, for better or worse, have changed the law of the land to keep the amateurs out. You just don't find a teenager practicing medicine, so "doctor" conveys a precise, strong meaning to everyone. Lest we forget, the 1800s were known as "the great age of the engi- neer." Engineers were viewed as the celebrities of the age, as the architects of tomorrow, the great hope for civilization. (For a wonderful description of these times, read Isamard Kingdom Brunel, by L.T.C. Rolt.) How things have changed! Our successes at transforming the world brought stink and smog, fac- tories weeping poisons, and landfills overflowing with products made obsolete in the course of months. The Challenger explosion destroyed many people's faith in complex technology (which shows just how little understanding Americans have of complexity). An odd resurgence of the worship of the primitive is directly at odds with the profession we em- brace. Declining test scores and an urge to make a lot of money now means that U.S. engineering enrollments have declined 25% in the decade from ……

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

安果移不动

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值