Flutter：来自网络的 ImageCache 使应用程序崩溃 - 警告数据库已被锁定为 0:00:10.000000。确保您始终使用答案

【问题标题】：Flutter: ImageCache from Network make application crash - Warning database has been locked for 0:00:10.000000. Make sure you always useFlutter：来自网络的 ImageCache 使应用程序崩溃 - 警告数据库已被锁定为 0:00:10.000000。确保您始终使用
【发布时间】：2020-05-24 02:26:14
【问题描述】：

我有一个包含从 CDN 加载的图像的卡片列表视图。当滚动到页面的 50%（分页）时，我得到 20 个新产品。但是，一段时间后它总是崩溃。

会不会是大图的原因？有些图像尚未上传并返回 404。图片有时也会闪烁并重新加载。

使用flutter推荐的以下包：https://github.com/renefloor/flutter_cached_network_image

代码：

Container(
    padding: EdgeInsets.only(
    top: MediaQuery.of(context).size.height * 0.02),
    width: MediaQuery.of(context).size.width * 0.3,
    child: CachedNetworkImage(
    placeholder: (context, url) => Container(
    padding: EdgeInsets.only(
        top: MediaQuery.of(context).size.height *
            0.05),
    child: placeholder,
    ),
    imageUrl: widget.product.pictureUrl,
)

堆栈跟踪：

MultiFrameImageStreamCompleter._decodeNextFrameAndSchedule (image_stream.dart:680)
MultiFrameImageStreamCompleter._handleCodecReady (image_stream.dart:644)
FileImage._loadAsync (image_provider.dart)
FileImage.load (image_provider.dart:638)
ImageProvider.resolve.<fn>.<fn>.<fn> (image_provider.dart:327)
ImageCache.putIfAbsent (image_cache.dart:160)
ImageProvider.resolve.<fn>.<fn> (image_provider.dart:325)
SynchronousFuture.then (synchronous_future.dart:38)
ImageProvider.resolve.<fn> (image_provider.dart:323)
ImageProvider.resolve (image_provider.dart:315)
_ImageState._resolveImage (image.dart:1010)
_ImageState.didChangeDependencies (image.dart:967)
StatefulElement._firstBuild (framework.dart:4376)
ComponentElement.mount (framework.dart:4201)
Element.inflateWidget (framework.dart:3194)
Element.updateChild (framework.dart:2988)
SingleChildRenderObjectElement.mount (framework.dart:5445)
Element.inflateWidget (framework.dart:3194)
MultiChildRenderObjectElement.mount (framework.dart:5551)
Element.inflateWidget (framework.dart:3194)

编辑1：

经过一番调查，我发现如果我在任何地方都使用相同的图片（可以是高分辨率的），效果很好。那么，要么是一些图片可能损坏，要么很难处理许多不同的图片？

编辑2： 崩溃时发生的输出之一如下：

I/flutter (5858)：警告数据库已被锁定 0:00:10.000000。确保您始终使用事务对象事务期间的数据库操作

也感觉和 404 图像越来越相关。缓存是否被锁定？

【问题讨论】：

使用 errorWidget: (context, url, error) => Icon(Icons.error)，在 url 失败时会显示这个图标
@NavinKumar 我之前有那个代码，但没有区别。我删除了它，因为我使用了与占位符相同的错误图标，所以只是一个我不需要的额外重绘。

标签： image flutter

【解决方案1】：

我将代码更改为：

FadeInImage(
  placeholder: MemoryImage(kTransparentImage),
  image: new CachedNetworkImageProvider(
      widget.product.pictureUrl),
))

我还更改了显示所有图片的列表：

SliverGridDelegateWithFixedCrossAxisCount(
    childAspectRatio: _aspectRatio, crossAxisCount: 2),
    itemCount: widget.products.length,
    addAutomaticKeepAlives: false,
    itemBuilder: (context, index) {
      return ProductCard(
          showProductFunction: showProductFunction,
          product: widget.products[index]);
    },

可能产生影响的财产：

addAutomaticKeepAlives: false

但最重要的是浏览所有图像：

所有图片都存在（无 404）
所有图片的最大尺寸为 500x500（之前的某些图片为 4000x4000）
现在所有图片都已压缩

【讨论】：