Flutter - Image remains after being deleted?

Question

I am experiencing some weird behavior around images in flutter.

I am using the camera package to capture images like so:

void _takePicture() {
_controller.takePicture(_tempImagePath).then((_) {
  setState(() {
    _captured = true;
    _shutterButtonController.forward();
    _acceptCancelController.forward();
  });
});
}

Pretty straightforward - the image is captured how I expect. If you notice the _captured member, I am using this to drive display of either the camera preview, or the captured image. Here is a snippet of my widget tree:

...
AspectRatio(
        aspectRatio: _controller.value.aspectRatio,
        child: _captured
            ? Image.file(File(_tempImagePath))
            : CameraPreview(_controller)),
...

This also behaves like I expect - the image is displayed after being captured. However, the catch appears to be that Image.file(...) will always display the same image. I have tried a number of ways to delete this image, and I believe it is working, yet the image somehow persists.

I'm at the point where I am deleting & recreating the entire directory inside of initState() as the screen is constructed like so:

Future<String> get getTempImageDirectory async {
  final directory = await getApplicationDocumentsDirectory();
  var imageDirectory = Directory(directory.path + '/images/');

  print('The image directory ${imageDirectory.path} exists: ${imageDirectory.existsSync()}');

  if (imageDirectory.existsSync()) {
    imageDirectory.deleteSync(recursive: true);
  }

  imageDirectory.createSync();

  return imageDirectory.path;
}

Even with this, or deleting the images manually by name, the originally captured image persists inside of the Widget created by Image.file(...). I am fairly certain that the delete is working fine - the camera API will throw an error that it cannot overwrite the previous image if you don't delete it.

Finally, if I kill the app and restart, I will be able to retake the picture and see a new one, but again, that one will remain until the whole application is killed. It seems like the image is somehow cached?

I'm fairly new to Flutter and Dart, so any help is appreciated.

Answer 1

After searching through Github issues, I was able to learn that Flutter is caching these images behind the scenes. They'll persist in-memory regardless of being deleted from disk.

I added this to my delete method, and my problem was solved.

import 'package:flutter/painting.dart';
...
imageCache.clear();

I've also found an answer here, however the import statement appears to be wrong based on Flutter v0.5.1.

Answer 2

in my case, need to clear live images too. And if your image is in ListView set Image key as UniqueKey().

imageCache.clearLiveImages();

Answer 3

Try adding these two lines to clear the cache:

  imageCache!.clearLiveImages();
  imageCache!.clear();

in my case it didn't worked with imageCache.clear(), so i had to clear live images too