在 Flutter 中如何知道图像是否在内存中？

Question

我的应用中有一个以图像为背景的屏幕，该图像位于我的资产文件夹中。当我导航到这个屏幕时，背景瞬间是空白的，然后图像被加载并出现。这使我的屏幕在半秒或更短的时间内看起来很奇怪，但足以让用户注意到。

我希望能够仅在加载图像后导航到该屏幕（我可以在前一个屏幕上等待），因此我可以避免这种行为并在用户导航到那里时将整个屏幕作为一个整体。

我知道可以使图像淡入，但这不是我想要的体验。

Answer 1

你需要使用ImageProvider.resolve方法

假设您在资产中注册了一些图像。 然后你可以获取图片提供者为

_imageProvider = Image.asset("your_asset").image.

那么你可以添加这样的方法：

import 'dart:ui';

Image _image;
bool _resolved;

void _resolveImageProvider() {
    ImageStream stream = _imageProvider.resolve(createLocalImageConfiguration(context));
    stream.addListener(ImageStreamListener((info, _) {
      setState(() {
        //here you may set some flags or anything which indicates the image is in memory now.
        _resolved = true;
        _image = info.image;
      });
    }));
  }

然后你可以在“上一屏”调用这个方法，等到监听器被触发，然后才导航到下一个视图。