-
Notifications
You must be signed in to change notification settings - Fork 990
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
bug: iOS 14 Black screen always on initial app launch prior to actually showing the splash screen [SplashScreen] #3589
Comments
Same here. Does someone have a workaround/quickfix for this? |
Launch screen with image stopped working with iOS 14, Xcode 12. Only workaround currently is to not use an image. |
Same issue here, ios 14 fresh cap app launch screen on ios is black. If anyone finds a solution please post |
I see the same issue happening, launch app --> black screen --> Splash |
I see the same issue happening, workaround for now, not use background image, replace it with a view and make the launch screen in there by hand. |
I have noticed a lot of apps displaying a black screen briefly before the launch screen on ios 14. I changed my SplashScreen plugin config to the below and the launch screen now displays: (delete the delay param) "SplashScreen": { |
@francodelsancio can you please provide some steps on how to do this. @chrisdelambert "launchAutoHide": false doesn't work still has the black screen. |
|
@francodelsancio thanks for the steps, I tried it and it's not solving the issue. Correct me if I'm wrong but your steps just set the initial logo it doesn't affect the splash screen. So this is what I see after your steps:
So unfortunately it is still not working. |
Above was the solution for me, i removed the other entries i had in there like launchShowDuration. |
@Exocomp i am sorry to hear that this not solve your problem, it seems, in my case, that the back screen is the background color coming from the imageView, because at run time its not loading from the resources, thats why i modify the launchscreen.storyboard, remove the imageView, added a view, set the background color, and put the logo. |
@francodelsancio it makes sense what you're saying but as soon as I add an image it goes to black, can you please include your LaunchScreen.storyboard file that will really help. |
@Exocomp i attach above an image of the tree in the splashscreen.storyboard if you change the background color of the elements you will notice that it is not loading the images. to load them you must attach them in the resource bundle. The assets folder are in the resource bundle, why are not loaded I don’t know. But the workaround works. All this assuming that we have the same problem. Regards |
Are there any updates on this problem here? Facing the same issues with the example app and its a pain point for me to see every time this black screen. Best regards |
Same problem here, black screen of the dead... it's totally anoying for user experience. I'v not found workaround... any solution here ? an update ? |
Same issue here, tried all workarounds explained above didn't work, I was able to fix it in Cordova by removing the UILaunchStoryboardName from the .plist file but it didn't work here |
I've tried all the proposed workarounds posted above and still have the same issue, usually with the black screen lasting for about 30 seconds to a minute before fully launching the app. It only happens on the first launch after installation; opening the app again a second time does not yield the black screen anymore. Are there any updates on this issue? |
TLDR: What worked for me was to reduce file size of launch images. I have 3 current Ionic/Capacitor/Angular apps. Two of them exhibit the same problem described here, initial black screen on app start prior to displaying actual launch image. The third never showed this problem and always started up fine. After digging through all set-ups, configs, dependencies, ..., I found nothing to help my 2 problem apps. Just this morning I noticed the file size differences of the launch images: First I just pulled the launch images from the good app to one of problem apps and launch screen at start up was perfect, i.e. no black screen. Then I ran the launch images from 2 problem apps through squoosh - 145KB images reduced to 37KB and 104KB images reduced to 45KB. Put these new launch screen images into respective iOS apps and built onto my iPhone. Both app now start up perfectly with no black screen image. Interesting note - both problematic apps are older and previously released to AppStore and have always worked fine. Something with iOS 14 definitely created this issue. Issue is not related to Xcode 12. Possibly cordova resources would help this if used, but I have not tried. I learned about squoosh from React Native Radio Podcast one of the most informative dev podcasts I've come across - even though I do no React Native development. |
Tried this and it does not work for me. |
Additional set up info in my apps, in case it helps, I am not using any splash screen plugin (Capacitor or Cordova). And no splash screen settings in |
Strangely enough, this somewhat fixed the issue for me. After reducing the splash image size, my app will load the splash image immediately. However, this only seems to be masking the underlying issue, as I still have a 1~2 minute hang-time before my app properly loads and hides the splash image. Either way, this fixes the original issue at hand, so thank you. |
I'll just throw my hat in the ring and also mention that i'm seeing this. Had an older cordova project where indeed removing the UILaunchStoryboardName from plist worked, but haven't been able to solve it in capacitor :( |
Hang in there, next week I'll be releasing a new splash screen plugin that will fix all of these problems. |
It turned out to be an image resolution for me, it was 2700x2700 initially, I dropped it down to 2300x2300 and I don't get the black screen anymore. If you try this just make sure to backup your original image so once this issue is fixed you can start using the higher resolution again. Note that the size on the disk stayed pretty much the same so not a size on disk issue. Thumbs up if this works for you too. 👍 |
@aparajita Any progress on this? We really waiting for this fix... 😞 |
@yacut Hopefully this week. I'm actually working on 3 killer plugins: splash screen, biometric auth, and console. It will be worth the wait. 😁 |
@aparajita hi my friend! any progress on this? |
@angelolencina 3 killer plugins became 4 😁, and I had a lot of work to do for my job, so it was a busy week. It looks good for releasing the splash screen plugin this week. |
Ok. Thank you!! 😁👍 |
Hey @aparajita, do you have any news about the splash screen plugin? At the moment our iOS App has a black screen and the Android App has a colored background (instead of a stretched image) before the ionic splash is displayed. Unfortunately there seems to be no proper solution until you rescue us 👍 Thank you for your effort, this sounds really great! |
@dkiselew |
I use 375 * 812 (iPhoneX@1x) |
2x image is iPhone 7/8 resolution: 750x1334 px |
@dkiselew Thanks. |
Reducing the image resolution no longer helps for iOS 15. |
For me the issue seems to be cordova-res. It only generates and copies these to Splash.imageset. splash-2732x2732.png It also needs to generate a splash-1334x1334.png and then add the additional references in the Content.json appropriately
I guess I'd also argue that you don't need 3 splash-2732x2732.png files. Just the one for all 3 scales would work? |
… app launch problem (see ionic-team/capacitor#3589)
* feat: hide keyboard shortcuts if not relevant * feat: theme based status bar styling * feat: sharing content via @capacitor/share plugin * feat: optimize spacing on mobile devices * feat: change browser tab color based on current theme color * feat: add ios platform * add capacitor splash screen plugin * fix: reduce launch image resolution to fix the iOS 14 black screen on app launch problem (see ionic-team/capacitor#3589) * chore: remove capacitor-resources dependency * style: update app icons * chore: update app images * chore: update README.md
None of these workaround work in ios 15. One thing I noticed playing with Xcode. In file LaunchScreen.storyboard > View Controller Scene > View Controller > Splash |
Thx. This works for me. Remember to del app, restart the phone and install it again, or try to install it on another phone to see if it works. Because apple will cache the splash, it is difficult to test whether it works or not. |
@Syahrul I can confirm this behaviour with the system icons. |
None of the solutions above worked for me. Still looking for a way to solve this |
Hi guys, really resizing the size will make it works, i just changed the splash screen to a smaller image make it works, |
I fixed this issue in my project using this answer from stackoverflow. https://stackoverflow.com/questions/58094614/ionic-capacitor-black-screen-after-splash |
This comment was marked as spam.
This comment was marked as spam.
For me an entry was missing in the Info: Key: Main storyboard file base name |
What helped for me to get rid of the black screen was:
|
Doing this worked perfectly on ionic 6 capacitor 4. Thank you ! Important: Delete the app, restart the device, install new. |
Hello Does anyone have fix, we are facing this issue with capacitor 5. Please help Thank you |
for me the light mode alway show when launch screen. I'm using capacitor 4 |
Resizing the splashScreen Image to 2400x2400 (+ deleting the app and restarting the phone) solved the issue for me. |
After reading tons of threads online and spending many hours trying to figure this out, I found a solution for eliminating the black screen that appears between the launch screen and the main app screen (something that I didn't see anyone else mention). It is very simple: leave out the .storyboard extension of the name of the launch screen. With this small (and illogical) change, my launch screen remains visible until it is replaced by the actual app, no more black in between. To solve this problem, I made this change in Info.plist: From:
To:
You can also make this change by editing the "Launch screen interface file base name" property value to remove the .storyboard part of the name shown there. I hope this helps others! |
Still no Capacitor fix here? |
Hello, I've tried many things, but none of them worked.
NOTE Project type:
|
How has no one from the capacitor team weighed in on this? This issue has been open for 4 YEARS!!! |
Same here, using Ionic 7 with Capacitor 5 and none of the solutions above helped... |
This bug is for the SplashScreen plugin described here.
Create an ionic app with capacitor, deploy it on the simulator or physical device:
Here is an example of a project where you can reproduce it: https://github.com/Exocomp/demo-ionic-swippable-modal.git
The text was updated successfully, but these errors were encountered: