在 Flutter/Dart 中使用动态预加载图像

Question

I currently have images which the image name is returned by a function and is dynamically called based on a variable like this:

String _setImage() {
  if (currentQuestion > 1 && currentQuestion < 11) {
    return "assets/images/image_$intensityIndex.png";
  } else {
    return "assets/images/image.png";
  }
}

I want to switch to preloading the images and I am using the technique described at Preload images in a stateful widget on Flutter , but I am not sure how to have the function return an image which the name is dynamically determined based on another variable. Here is what I have so far:

void initState() {
   super.initState();

  image0 = Image.asset('assets/images/image_0.png'); 
  image1 = Image.asset('assets/images/image_1.png');
  image2 = Image.asset('assets/images/image_2.png');
  image3 = Image.asset('assets/images/image_3.png');
}

void didChangeDependencies() {
  super.didChangeDependencies();

  precacheImage(image0.image, context);
  precacheImage(image1.image, context);
  precacheImage(image2.image, context);
  precacheImage(image3.image, context);
}

Image _setImage() {
  if (currentQuestion > 1 && currentQuestion < 11) {
    return ______________;
  } else {
    return image0;
  }
}

All help is appreciated!

Answer 1

Am not sure how to return an image which the name is dynamically determined based on another variable

You don't need to return with precach because if you use exact image that you cache.

Ex:

precacheImage('assets/images/image_1.png'); // if this is the image name

Image.asset('assets/images/image_1.png'); // when you use this it is getting from the cache but the path should be same.

If I explain it another way:

precacheImage("assets/images/image_$intensityIndex.png"); // image_1.png
Image.asset('assets/images/image_1.png'); // when you do this, asset taking from the cache by looking at the path.