flutter Assert宽度>0.0“失败：将单个图像放入FittedBox的容器中时不为真

jucafojl 于 2023-01-14 发布在 Flutter

关注(0)|答案(7)|浏览(156)

当我将www.example.com放在Image.networkFittedBox的子行或容器中时，查看它会导致错误/崩溃。
FittedBox实际上使用了一个函数作为它的子函数，它根据图像的数量返回一个小部件。当有两个图像时，它返回一个Row，每个图像都是它的子图像，这没有错误，但是当只有一个图像时，无论我返回一个Container，图像是它的子图像，还是一个Row，图像是一个Single child，都会发生错误。

Container(
              child: FittedBox(child: status.statusFiles()),
            ),

状态文件：

return Container(
        child: 
          Image.network(
            this.files[0].thumbnailUrl,
            fit: BoxFit.contain,
          ),
        );

我期望FittedBox包含适合的最大大小的图像，但在呈现小部件时却收到以下错误

I/flutter (26617): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (26617): The following assertion was thrown during performLayout():
I/flutter (26617): 'package:flutter/src/rendering/box.dart': Failed assertion: line 307 pos 12: 'width > 0.0': is not
I/flutter (26617): true.
...
I/flutter (26617): When the exception was thrown, this was the stack:
I/flutter (26617): #2      BoxConstraints.constrainSizeAndAttemptToPreserveAspectRatio (package:flutter/src/rendering/box.dart:307:12)
I/flutter (26617): #3      RenderFittedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:2275:26)
I/flutter (26617): #4      RenderObject.layout (package:flutter/src/rendering/object.dart:1634:7)
I/flutter (26617): #5      RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:738:15)
I/flutter (26617): #6      RenderObject.layout (package:flutter/src/rendering/object.dart:1634:7)
I/flutter (26617): #7      RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:798:17)
I/flutter (26617): #8      RenderObject.layout (package:flutter/src/rendering/object.dart:1634:7)
I/flutter (26617): #9      RenderPadding.performLayout (package:flutter/src/rendering/shifted_box.dart:199:11)
...
I/flutter (26617): The following RenderObject was being processed when the exception was fired:
I/flutter (26617):   RenderFittedBox#d752c relayoutBoundary=up8 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (26617):   creator: FittedBox ← Container ← Column ← Expanded ← Row ← Padding ← Container ←
I/flutter (26617):   RepaintBoundary-[<16>] ← IndexedSemantics ← NotificationListener<KeepAliveNotification> ←
I/flutter (26617):   KeepAlive ← AutomaticKeepAlive ← ⋯
I/flutter (26617):   parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
I/flutter (26617):   constraints: BoxConstraints(0.0<=w<=339.4, 0.0<=h<=Infinity)
I/flutter (26617):   size: MISSING
I/flutter (26617):   fit: contain
I/flutter (26617):   alignment: center
I/flutter (26617):   textDirection: ltr
I/flutter (26617): This RenderObject had the following descendants (showing up to depth 5):
I/flutter (26617):   RenderSemanticsAnnotations#df6f3 relayoutBoundary=up9 NEEDS-PAINT
I/flutter (26617):     RenderImage#63da1 relayoutBoundary=up10 NEEDS-PAINT
I/flutter (26617): ════════════════════════════════════════════════════════════════════════════════════════════════════

flutter

来源：https://stackoverflow.com/questions/54340675/failed-assertion-width-0-0-is-not-true-when-placing-single-image-in-containe

7条答案

按热度按时间

ruoxqz4g1#

前面的解决方案对我都不起作用，因为我使用的是fit: Boxfit.fitWidth，而且我确实需要祖先的高度取决于图像的宽度。
我的解决方案是将图像 Package 在一个ConstrainedBox中，然后手动应用最小高度和宽度1：

ConstrainedBox(
      constraints: BoxConstraints(maxHeight: maxHeight),
      child: Hero(
        tag: 'SettingsPic',
        child: Container(
          width: double.infinity,
          decoration: BoxDecoration(
              borderRadius: BorderRadius.vertical(bottom: Radius.circular(25)),
              boxShadow: [BoxShadow(
                  color: Colors.black.withOpacity(0.2),
                  blurRadius: 10
              )]
          ),
          child: ClipRRect(
            borderRadius: BorderRadius.vertical(bottom: Radius.circular(25)),
            child: FittedBox(
              fit: BoxFit.fitWidth,
              alignment: Alignment.bottomCenter,
              child: ConstrainedBox(
                constraints: BoxConstraints(minWidth: 1, minHeight: 1), // here
                child: Image.asset(
                  'resources/images/background.png',
                ),
              ),
            ),
          ),
        ),
      ),
    )

赞(0）回复(0）举报 2023-01-14

bxjv4tth2#

Sizebox.expand解决了我的问题

Container(
  width: 50,
  height: 50,
  decoration: BoxDecoration(
    border: Border.all(color: Colors.grey),
    borderRadius: BorderRadius.circular(3),
    color: color,
  ),
  child: SizedBox.expand(
    child: FittedBox(
      child: Image.file(File(path)),
      fit: BoxFit.fill,
    ),
  ),
)

赞(0）回复(0）举报 2023-01-14

gopyfrb33#

这不起作用的原因是因为它不知道图像的宽度，因为图像在布局组件时还没有加载。它需要图像的宽度来进行计算。当你进行热加载时，Flutter会在此时检索图像。
在这种情况下，我所做的是通过我所有的图像，找出尺寸，我硬编码到文件中，我不喜欢这个解决方案，但它确实解决了我的错误。

我假设只有在出于性能原因需要资产时才从资产目录中检索资产（即，如果您有许多图像，则会导致手机启动时间滞后）*

Expanded(
      child: Column(
        children: [
          FittedBox(
            fit: BoxFit.scaleDown,
            child: Image.asset("assets/foot.png", width: 100, height: 100,),
          ),
        ],
      ),
    ),

赞(0）回复(0）举报 2023-01-14

busg9geu4#

强烈建议为Image小部件同时指定宽度和高度，或者将小部件放置在设置严格布局约束的上下文中，以便图像在加载时不会更改大小。
因此，如果不想指定高度/宽度，可以选择将FittedBox放入ConstrainedBox中，ConstrainedBox具有minWidth或infinity。
因此这里不需要minWidth/minHeight: 1。

赞(0）回复(0）举报 2023-01-14

mnowg1ta5#

这是我的解决方法，但我认为Konstantin Kozirev's answer更好

final image = Image.asset("assets/something.png");

...

FutureBuilder(
    future: Future.delayed(Duration(milliseconds: 100)).then((_) => image),
    builder: (context, snapshot) {
        if(snapshot.hasData) {
           return FittedBox(
              fit: BoxFit.scaleDown,
              child: image,
           );
        }
        return image;
    },
)

赞(0）回复(0）举报 2023-01-14

9w11ddsr6#

我有同样的问题，当我使用视频播放器在FittedBox，我使用：约束框（约束：框约束（最小宽度：1，最小高度：1），子项：图像.资产（“资源/图像/背景. png”，），），
或：大小化的框.expand（子级：拟合框（子级：图像.file（文件（路径）），适合：盒拟合填充，），），

赞(0）回复(0）举报 2023-01-14

noj0wjuj7#

minWidth隐藏此错误-在某些情况下效果良好：

Container(
  child: FittedBox(
  fit:BoxFit.scaleDown,
    Container(
        constraints:const BoxConstraints(minWidth:1), // Set Min Width
        child: status.statusFiles(),
    ),
  ),
),

赞(0）回复(0）举报 2023-01-14

我来回答

flutter Assert宽度>0.0“失败：将单个图像放入FittedBox的容器中时不为真

7条答案

相关问题

热门标签

最新问答