如何解决CachedNetworkImage中的错误？

Question

我想加载要缓存的图像。所以我为此使用了 CachedNetworkImage。当用户通过 gmail 帐户登录时，我会获取图像 url 并显示图像。但我需要将它保存在缓存中。这是我的代码：

new Center(
 child: new Column(
  children: <Widget>[
   new CircleAvatar(
    new CachedNetworkImage(
      placeholder: CircularProgressIndicator(),
      imageUrl: widget.currentUser?.profilUrl,
    ),
  ),
],
),
)

我也使用了 CachedNetworkImageProvider，但两者都出现了同样的错误。错误是

type'CachedNetworkImage'is not  a  subtype  of  type  'ImageProvider<dynamic>'

Answer 1

小部件CircleAvatar接收一个ImageProvider。

该cached_network_image你包提供两个类来使用：

1. CachedNetworkImage可用于显示缓存的网络图像的小部件。
2. CachedNetworkImageProvider提供缓存图像的ImageProvider。

因此你必须使用CachedNetworkImageProvider(2.)，如果你想把它传递给CircleAvatar.

这是一个完整的示例，您可以复制和粘贴以进行试用：

import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(),
      home: Scaffold(
        body: Center(
          child: CircleAvatar(
            backgroundImage: CachedNetworkImageProvider(
              'https://upload.wikimedia.org/wikipedia/commons/thumb/7/71/Bill_Gates_Buys_Skype_%285707954468%29.jpg/2560px-Bill_Gates_Buys_Skype_%285707954468%29.jpg'
            ),
          ),
        ),
      )
    );
  }
}