如何在颤振的BoxDecoration中显示来自网络的图像？

Question

我想在BoxDecoration中显示来自网络的图像.但它的显示错误"参数类型'图像'无法分配给参数类型'imageProvider'".这是我的代码.

decoration: new BoxDecoration(
          image: new DecorationImage(image: new Image.network("http://myurl.com/"+productList[index].thumbnail),
          fit: BoxFit.cover)
        ),

我正在尝试使用此代码显示图像.>>>

decoration: new BoxDecoration(
          image: new DecorationImage(image: new Image.network("http://myurl.com/"+productList[index].thumbnail),
          fit: BoxFit.cover)
        ),

Answer 1

我已经解决了这个问题,可以使用此代码实现.

decoration: new BoxDecoration(
      image: new DecorationImage(image: new NetworkImage("http://myurl.com/"+productList[index].thumbnail),
      fit: BoxFit.cover)
    ),

Answer 2

如果你想加载 CachedNetworkImage 则以这种方式使用 *** https://pub.dev/packages/cached_network_image

CachedNetworkImage(
  imageUrl: "http://via.placeholder.com/200x150",
  imageBuilder: (context, imageProvider) => Container(
    decoration: BoxDecoration(
      image: DecorationImage(
          image: imageProvider,
          fit: BoxFit.cover,
          colorFilter:
              ColorFilter.mode(Colors.red, BlendMode.colorBurn)),
    ),
  ),
  placeholder: (context, url) => CircularProgressIndicator(),
  errorWidget: (context, url, error) => Icon(Icons.error),
),

Answer 3

阿米的回答是对的。不过我想回答我使用 BoxDecoration() 的经验。

要从互联网或 Flutter 应用程序中的资源应用背景图像，我们可以在 BoxDecoration() 的图像属性中使用 DecorationImage() 类。

下面是一个代码片段，其中背景图像是从 Flutter 应用程序中的 URL 中的图像应用的：

Container(
  decoration: BoxDecoration(
    image: DecorationImage(
      image: NetworkImage('https://www.exampledomain.com/images/background.jpg'),
      fit: BoxFit.fill,
    ),
  ),

）

因此，要在容器小部件中应用背景图像，我们必须使用装饰属性。在装饰属性中，我们提供一个新的 BoxDecoration() 对象，该对象应该有一个指向图像资源 URL 的图像属性。在上面的代码片段中，图像属性被实例化为一个指向图像 URL 的 NetworkImage() 对象。