flutter - 如何从 Assets 中预加载图像？

Question

我正在尝试像这样预加载一些在 PageView 中使用的 Assets ..

  @override
  void didChangeDependencies() {
    precacheImage(AssetImage("assets/images/background.png"), context)
      .then((result) {
        print('$result');
      });

    super.didChangeDependencies();
  }

预期结果:then() 中的结果值将返回预加载的图像实际结果:结果值为null

有没有人有任何关于 preloadCache() 是如何工作的例子，因为它的文档很差

Answer 1

precacheImage 的返回值是Future<void>所以使用then结果不会返回图像本身。

一种更简单的使用方法是在 build 中使用您想要像这样显示图像的小部件的父小部件的方法:

class ImagePage extends StatelessWidget{   
  @override
  Widget build(BuildContext context) {
    return Image.network("https://upload.wikimedia.org/wikipedia/commons/3/39/Periodic_table_large.png");
  }
}

然后，您可以调用precacheImage在像这样导航到 ImagePage 之前在小部件中:

class TestWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    precacheImage(NetworkImage("https://upload.wikimedia.org/wikipedia/commons/3/39/Periodic_table_large.png"), context);
    return Center(
          child: RaisedButton(
        child: Text('Launch screen'),
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => ImagePage()),
          );
        },
      ));
  }
}

这样当你按下按钮启动ImagePage ，图像将已经加载。