在flutter中滚动列表视图时网络图像总是消失?

问题描述 投票:0回答:5

我有一个列表视图,其中加载了来自 api 的图像,我注意到偶尔滚动时图像会消失几秒钟。这里只是图像部分的代码:

Container(
padding: EdgeInsets.only(top:5.0,left:15.0,right:1.0,bottom:0.0),
constraints: new BoxConstraints.expand(
   height: 130.0,
   width: 150.0,
),
decoration: new BoxDecoration(
            image: new DecorationImage(
            image: NetworkImage(artworksAndEventsFinal[index]['thumbnail']),fit: BoxFit.cover,),
            ),
           child: new Stack(
              children: <Widget>[
                   new Positioned(
                   right: 0.0,
                   bottom: 0.0,
                   child: Container(
                   height: 24.0,
                   padding: EdgeInsets.only(top:5.0,left:10.0,right:5.0,bottom:5.0),
             decoration: new BoxDecoration(
             color: Theme.of(context).primaryColor,
             ),
             child: new Text(artworksAndEventsFinal[index]['year'],
                    style: new TextStyle(
                    fontWeight: FontWeight.bold,
                    fontSize: 11.0,
                    color: Colors.white
                     )
                    ),
             )
            ),
            new Positioned(
                right: 3.0,
                top: 0.0,
                child: new Icon(Icons.favorite_border,color: 
                Colors.white,),
                ),
            ],
          )
        ),

flutter dart flutter-layout
5个回答
15
投票

cacheExtent
值更改为 9999,它对我有用:

ListView.builder(
  cacheExtent: 9999,
  …
),

3
投票

List View 在可见时创建小部件。因此,只有可见的孩子有图像,而消失的孩子会删除小部件,而尚未加载的孩子不会获取图像。 这种方法具有优化内存利用率的好处。假设您在列表视图中有 1000 张带有图像的卡片,目前在屏幕上只显示 2-3 张,因此只有 2-3 张可见的卡片图像会被加载,并且当用户滚动并从列表中取出其他卡片时,它只会在可见时加载图像。

如果你想缓存图片,请考虑使用包Cached_network_image


0
投票

尝试给列表中的每个项目一个

ValueKey


0
投票

将大数字设置为

cacheExtent
值,如 99999,它将起作用。

请从

这里查看
cachExtent做什么


0
投票

尝试使用

AutomaticKeepAliveClientMixin
,其他帖子的答案对我有帮助,你可以去这个链接:

https://stackoverflow.com/a/65625128

© www.soinside.com 2019 - 2024. All rights reserved.