时间戳

首页 > 解决方案 > 如何从资产中预加载图像？

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

问题描述

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

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

    super.didChangeDependencies();
  }

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

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

标签： flutter

解决方案

的返回值，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，图像将已经加载。

推荐阅读