The screen will be black for one second on IOS platform

[jijkbird]

The screen will be black for one second on IOS platform

[✓] Flutter (Channel stable, 2.5.0, on macOS 11.6 20G165 darwin-x64, locale zh-Hans-CN) [!] Android toolchain - develop for Android devices (Android SDK version 31.0.0) ✗ cmdline-tools component is missing Run path/to/sdkmanager --install "cmdline-tools;latest" See https://developer.android.com/studio/command-line for more details. ✗ Android license status unknown. Run flutter doctor --android-licenses to accept the SDK licenses. See https://flutter.dev/docs/get-started/install/macos#android-setup for more details. [✓] Xcode - develop for iOS and macOS [✓] Chrome - develop for the web [✓] Android Studio (version 4.1) [✓] IntelliJ IDEA Ultimate Edition (version 2021.2.1) [✓] VS Code (version 1.60.1) [✓] Connected device (2 available)

[jonbhanson]

It may be caused by an iOS splash caching bug, which can be solved by uninstalling your app, powering off your device, power back on, and then try reinstalling.

[jijkbird]

@jonbhanson I tried. It didn't work

[jonbhanson]

Is it black after the native splash screen?

[jonbhanson]

Closing due to inactivity. Feel free to reopen if you still have a problem.

[jijkbird]

@jonbhanson After the app opens, the screen is black, and then the startup page is displayed one second later.

[lam-nv]

I also had similar experience with @jijkbird. android app work well

[kkoken]

I have the similar issue on android. After Native splash approximately 1 sec black screen then splash screen that I created (via widget) is seen.

Edit: I think removing this creates black screen

     <meta-data
          android:name="io.flutter.embedding.android.SplashScreenDrawable"
          android:resource="@drawable/launch_background"/>

[jonbhanson]

Can any of you send me the codebase for your app (or a hollowed out version if you prefer) to help me diagnose this problem?

[iliser]

I have simmilar issue, on both platform. In transition beetween native splash and second splash that rendered by flutter, screen is filled by background color. In my case this behavior was caused by long time image loading.

I fixed it by preload image before runApp

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await _preloadAssetImage('assets/splash.png');
  runApp(MyApp());
}

[julienduchow]

I have the same problem, it is black for one second on my iPhone. @iliser Can you provide your implementation of the _preloadAssetImage method?

[iliser]

@julienduchow check it. https://github.com/massa-org/the_splash/blob/master/lib/preload_asset_images.dart You can just call it, in that case flutter cache loaded image and next usage of this image is significantly faster. Or use imageProvider returned by this method

await _preloadAssetImage('assets/splash.png');

[julienduchow]

Thanks @iliser , but does not fix the problem for me.

[jonbhanson]

I have added a removeAfter method in the latest version. You can place any code that loads resources for your app in this method, and the splash screen will remain up until this method completes. If you place any code that would delay the loading of your app into this method, it should solve any blank screen problems that you may have. Feel free to open a new ticket if you are still having a problem after trying this new method.