dart - NetworkImage 无法呈现 url

Question

我尝试使用 NetworkImage 使用 _renderImage 方法渲染图像，但显示的只是一个大红色方 block 。当我使用 Image.network 使用 _renderImage2 方法进行渲染时，它工作正常。不幸的是，我需要 renderImage 的装饰和边界半径。为什么它不起作用？

  Container _renderImage(GroupMessageController message) => new Container(
      width: 300.0,
      margin: const EdgeInsets.all(5.0),
      decoration: new BoxDecoration(
          borderRadius: const BorderRadius.all(const Radius.circular(25.0)),
          image: new DecorationImage(
              fit: BoxFit.contain,
              image: new NetworkImage(message.mediaUrl.toString()))));

  Container _renderImage2(GroupMessageController message) => new Container(
        width: 300.0,
        child: new Image.network(
          message.mediaUrl.toString(),
          fit: BoxFit.contain,
        ),
      );

    [√] Flutter (on Microsoft Windows [Version 10.0.16299.64], locale en-US, channel alpha)
    • Flutter at c:\sdks\flutter
    • Framework revision e8aa40eddd (5 weeks ago), 2017-10-17 15:42:40 -0700
    • Engine revision 7c4142808c
    • Tools Dart version 1.25.0-dev.11.0

[√] Android toolchain - develop for Android devices (Android SDK 27.0.1)
    • Android SDK at C:\Users\ride4\AppData\Local\Android\sdk
    • Platform android-27, build-tools 27.0.1
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-915-b01)

[√] Android Studio (version 3.0)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-915-b01)

[√] IntelliJ IDEA Community Edition (version 2017.2)
    • Flutter plugin version 19.1
    • Dart plugin version 172.4343.25

[√] Connected devices
    • Android SDK built for x86 • emulator-5554 • android-x86 • Android 7.1.1 (API 25) (emulator)

Answer 1

使用 decoration 属性和使用 Image 小部件是有区别的。

使用 DecoratedBox 的 decoration 就像定义盒子的背景图像。但是由于您的 DecoratedBox 根本没有子项，因此它的默认大小为 0x0。

另一方面，Image 有不同的用途，将有一个尺寸。

编辑

    return new DecoratedBox(
      decoration: new BoxDecoration(
        image: new DecorationImage(
          image: new NetworkImage("https://displate.com/displates/2017-09-04/7b4f0a94798f5d8c1ea094984c766911_0dc0c70583e9e27897d5c0125acac0c1.jpg?h=357&w=500&v=3"),
        ),
      ),
      child: new SizedBox(
        width: 300.0,
        height: 300.0,
      ),
    );