Help with Splash Screen

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7393
Joined: Sat Apr 08, 2006 8:31 pm
Contact:

Re: Help with Splash Screen

Post by jacque » Sun Jun 01, 2014 7:33 pm

Splash screens on iOS:

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
And in the script of the first card, have a "closeSplash" handler that does whatever is needed to remove the splash image, or navigate to the main card. This avoids the iOS issues with startup because the closeSplash doesn't happen while the app is loading.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

dazza the stag
Posts: 44
Joined: Sat May 17, 2014 1:48 pm

Re: Help with Splash Screen

Post by dazza the stag » Sun Jun 01, 2014 8:02 pm

Jacque

Thank you for the very comprehensive info regarding splash screens.

Simon - I just started again and I have copied that file below. It only contains the two cards, so all i get when i run this is a black screen that sits there for the 5 seconds and then it moves on to the Main card. I don't see the flowers ?

Something simple I'm sure....
splash.livecode.zip
(57.72 KiB) Downloaded 205 times

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7393
Joined: Sat Apr 08, 2006 8:31 pm
Contact:

Re: Help with Splash Screen

Post by jacque » Sun Jun 01, 2014 8:15 pm

Just put the flowers pic into standalone settings. You can't control the splash from a script on iOS.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

dazza the stag
Posts: 44
Joined: Sat May 17, 2014 1:48 pm

Re: Help with Splash Screen

Post by dazza the stag » Sun Jun 01, 2014 8:53 pm

jacque wrote:Just put the flowers pic into standalone settings. You can't control the splash from a script on iOS.

I really appreciate that Jacque - clearly i was trying to do something that I couldn't and getting frustrated in the mean time !.
It now makes sense as to why i was seeing a black screen i.e. this is just the app starting up.

Also a great explanation on how you should use the splash screen and the fact it should just look like the first card to "fool" the user - I will remember that every time i open an app in future ! :D Ive tried it all and it works just fine

Thanks again

Post Reply