firebase - 如何在 flutter 的轮播 slider 中从firebase中删除图像之间的加载时间

Question

我正在 flutter 的旋转木马 slider 中查看来自 firebase 的图像。但是每次我滑动到下一张图片时都会有一个小的加载间隙。
是否可以以某种方式保存图像以消除图像之间的加载时间？
这是我的代码:

class ViewImages extends StatelessWidget {
  
  Future getCarouselWidget() async {
        var firestore = Firestore.instance;
        QuerySnapshot qn = await firestore.collection("images").getDocuments();
        return qn.documents;
      }

  @override
  Widget build(BuildContext context) {
    var idx = 1;
    return Container(
      child: FutureBuilder(
          future: getCarouselWidget(),
          builder: (context, AsyncSnapshot snapshot) {
            List<NetworkImage> list = new List<NetworkImage>();
            if (snapshot.connectionState == ConnectionState.waiting) {
              return new CircularProgressIndicator(); 
            } else {
              if (snapshot.hasError) {
                return new Text("fetch error");
              } else {

                //Create for loop and store the urls in the list 
                for(int i = 0; i < snapshot.data[0].data.length; i++ ) {
                  debugPrint("Index is " + idx.toString());
                  list.add(NetworkImage(snapshot.data[0].data["img_"+idx.toString()]));
                  idx++;
                }
                return new Container(
          height: MediaQuery.of(context).size.width,
          width: MediaQuery.of(context).size.width,
                    child: new Carousel(
                      boxFit: BoxFit.cover,
                      images: list,
                      autoplay: false,
                      autoplayDuration: Duration(seconds: 5),
                      dotSize: 4.0,
                      indicatorBgPadding: 16.0,
                      animationCurve: Curves.fastOutSlowIn,
                      animationDuration: Duration(milliseconds: 2000),
            dotIncreasedColor: Colors.white,
            dotColor: Colors.grey,
            dotBgColor: Colors.transparent,
            
                    ));
              }
            }
          }),
    );
  }}

Answer 1

你要找的是CachedNetworkImage , CachedNetworkImage，顾名思义只会获取一次图片并缓存，所以下次构建widget时，就不会再调用了。