1

My app loads a new image from the internet as a background image for the screen when the user taps on a FAB. I can determine what URL to load prior to the user tapping the screen.

Is there a way to lazy load an image prior to it needing to be displayed by FadeInImage or another Flutter Widget image display mechanism?

5
  • see ImageProvider
    – pskink
    Feb 24, 2019 at 12:40
  • Thank you. Isn't that pretty much what image.network is? Do you have a snippet of code I can learn from? Feb 24, 2019 at 12:52
  • Yes. Thank you. The code doesn't help explain how to cache and retrieve images. It is more like skeleton code to make any general provider. Again, thank you but it is of minimum help (at least I can see...I am easily confused I guess) Feb 24, 2019 at 13:02
  • "The code doesn't help explain how to cache and retrieve images." yes, it does, see _getImage() method
    – pskink
    Feb 24, 2019 at 14:47

1 Answer 1

3

You can load an Image ahead of being request in the ui with the precacheImage method. Any future requests for a matching image - the same url in the case of a network image - will pull from the cache. To load a network image, you can pass it an instance of the NetworkImage class.

Example:

class SomeWidgetState extends State<SomeWidget> {

  @override
  void initState() {
    super.initState();
    precacheImage(NetworkImage('someurl.jpg'));
  }

  ...
}
3
  • Thank you. Certainly looks promising! The doc notes: The ImageCache will find the image as long as both images share the same key. Is there a way to make sure if I use the same URL it is the same key? Feb 25, 2019 at 14:14
  • Only the URL has to match Feb 26, 2019 at 0:00
  • How can I load images from API?
    – phuocding
    Oct 3, 2019 at 8:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.