On iOS, Apple provides a way to implement a splash screen and all you need to do is assign the splash image in the iOS pane in Standalone Settings. iOS will automatically display the splash when the app is loading without any other actions on your part. If no splash is assigned, you see a black screen instead. The splash is only displayed briefly, so there will be a very quick (under 1 second) black screen and then the first card of the app will appear. If you do assign a splash image, you'll see that instead. This all occurs before the stack is loaded, and is outside of your control because it happens before any of your scripts.
The first card does not appear until all initial pre* and open* messages are complete. Anything you do in a preOpenStack, preOpenCard, etc. will run during the (sometimes black) splash display. If you really do want the splash to appear for longer, then add a very brief wait to any pre- or open- handler (usually the preOpenCard on the first card.) You do not need to specify any navigation because the first card of the app will appear automatically after the splash, since LC always opens a stack to the first card on launch.
A caution about iOS splash screens, per Apple's guidelines: A splash screen should not be used as a place for an app title, credits, or any other content unrelated to the first visible screen. The purpose of an iOS splash is to make the user think that the app has started up instantly without any delay. A splash screen should be an image of the first screen of the app, without any of the dynamic content. I.e., if the app displays info from a database, the splash would contain an empty data field, along with all images, buttons, etc. that form the content of the card. The user will see this structure immediately on launch, and while it is displayed, the app should be loading content in the background (during one of the pre* messages.) When the splash disappears, the content is already there. The user's experience is that the app started up instantly and soon after, the content appeared.
The reason for this is because user studies have shown that a delay of 2 or so seconds makes a user uneasy, and any delay of 3 seconds or more is interpreted as a crash or some other catastrophe. Thus, the splash simulates an instant startup, allowing the data to load at a slightly slower rate. I think a 5-second wait is way too long, btw. Also keep in mind that the splash will display every time the user returns to it, even if they just answered a phone call. When they hang up the phone they will want to be right back where they started, but instead they will need to wait 5 seconds again. They won't like it.
However, Apple does allow you to submit non-content-related splash screens, even though they don't meet the guidelines. Apple also accepts apps with no splash at all, and if your app starts up quickly then you don't need one and probably should not impose one on the user.
Splash screens on Android:
Android has no automatic mechanism for splash screens, so you can use the first card as the splash, or Richmond's suggestion to show/hide an overlay image on the first card. I like the overlay idea because if the app has more than one card, you don't need to navigate around the splash when scripting "previous" and "next" buttons. But either way will work.
You can use the techniques you've already tried on Android. Android loads the app first and then executes all the scripts, so using pre* or open* handlers should be fine.
Cross platform splash screens
If you are planning to release a cross-platform mobile app then you can use the Android technique for both platforms if you don't want to branch your startup code by platform.
If you do, then on iOS you will need to send the instruction that removes the splash image (or navigates away from it) using a "send in time" construct. That avoids the problem with the pre*/open* messages during startup on iOS and still works on Android. You do not need to supply a splash image for iOS in standalone settings with this method, though it won't hurt if you do. On iOS the transition from the supplied splash to your first card image will be unnoticeable provided they are identical.
Then on openCard on the first card:
Code: Select all
send "closeSplash" to me in 1 second