When returning from background image dissapear

[aleksandar-radivojevic]

Hey bro, I really love your plugin and I am using it for almost 3 years now. Thank you very much because FadeInImage sucks, and your plugin is way better.

I found a bug where when I return from background, images disappear, please take a look at video. So this images were here and everything was working perfectly but when I put app in background, lock screen and wait for 1 or 2 minutes, and then open again app, images disappear and after some scrolling they appear again.

I tried replacing ImageFade with FadeInImage and this is not happening, images don't disappear with FadeInImage.

FLUTTER DOCTOR:
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.0.5, on macOS 11.6.4 20G417 darwin-x64, locale en-GB)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2020.3)
[✓] VS Code (version 1.70.2)
[✓] Connected device (2 available)
[✓] HTTP Host Availability

• No issues found!

TESTED on iPHONE 6s, iOS 15.3.1

Below is my code, so nothing fancy.

Container(
      decoration: BoxDecoration(
        color: Theme.of(context).appBarTheme.backgroundColor,
      ),
      child: ClipRRect(
        borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(5), topRight: Radius.circular(5)),
        child: ImageFade(
          image: NetworkImage(featuredMedia),
          excludeFromSemantics: true,
          placeholder: Image.memory(
            kTransparentImage,
            fit: BoxFit.cover,
          ),
          fit: BoxFit.cover,
          duration: const Duration(milliseconds: 300),
          // fadeInCurve: Curves.easeInOut,
          height: useTabletLayout ? 400 : 220,
          alignment: Alignment.center,
          width: MediaQuery.of(context).size.width,
        ),
      ),
    );

RPReplay_Final1662013878.MP4

[good-good-study]

mee to !!! , what i do ?

[kitsuniru]

@gskinner @maks any fix for this?

[kapilsharma-gts]

I think this will work

import 'package:cached_network_image/cached_network_image.dart';
import 'package:image_fade/image_fade.dart';

ImageFade(
  image: CachedNetworkImageProvider(featuredMedia), // Use CachedNetworkImageProvider
  placeholder: Image.memory(
    kTransparentImage,
    fit: BoxFit.cover,
  ),
  fit: BoxFit.cover,
  duration: const Duration(milliseconds: 300),
  height: useTabletLayout ? 400 : 220,
  alignment: Alignment.center,
  width: MediaQuery.of(context).size.width,
);

Additionally, increase the image cache size:

PaintingBinding.instance.imageCache.maximumSize = 1000; // Number of images
PaintingBinding.instance.imageCache.maximumSizeBytes = 100 * 1024 * 1024; // 100 MB

This should help manage image caching more effectively and prevent issues with disappearing images when returning from the background