Skip to main content
Douglas McCarroll
Inspiring
May 27, 2013
Question

iOS launch screen / splash screen shift

  • May 27, 2013
  • 1 reply
  • 6135 views

Hi All,

I've implemented launch screen images, including Default@2x.png, and am testing on an iPhone 4.

When I disable my splash screen (i.e. I don't set the app's splashScreenImage prop) the launch image displays briefly, then I get a blank white screen for multiple seconds while my app loads.

If I enable the splash screen, like this...

     splashScreenImage = "@Embed('Default@2x.png')"

the app displays the image continuously, first as iPhone launch screen, then as AIR splash screen, but when it switches from launch screen to splash screen the image is displayed about 19 pixels lower than it was when displayed as launch screen.

This happens with splashScreenScaleMode set to both "stretch" and "zoom".

I can provide two different images, instead of using the same image, and make most of the shift invisible to the user, but there are two problems with this approach:

  • It's obviously kludgy. It would be nice if this just worked.
  • I'm fairly sure that even if I get this to look good on iPhone 4, it will look bad on iPhone 5, and vice-versa. If we could use different splash screen images for 4 and 5 we could kludge a fix that way, but I don't believe that that's possible.

Two questions:

  • Any suggestions? 
  • Should I report this as a bug?

Thanks,

Douglas

This topic has been closed for replies.

1 reply

Colin Holgate
Inspiring
May 27, 2013

I suspect it's 20 pixels out. The Default@2x.png wants to be 640x960, but if your app is showing the status bar, then the matching image inside Flash may need to be 640x920, or thereabouts. Are you showing the status bar?

Douglas McCarroll
Inspiring
May 27, 2013

Hi Colin,

Thanks for the input. It looks as though your theory is correct. I've tried using an image that is 40 pixels shorter, i.e. the top 40 rows of pixels have been removed, and it appears to work perfectly.

But I'm guessing that I'll still have a problem on iPhone 5. I don't have an iPhone 5 to test on, so this is all guesswork.     I'm guessing that as the Default-568h@2x.png is taller than the Default@2x.png, and my splash screen image is a shortened version of Default@2x.png, it isn't going to look very good on iPhone 5. If I understand correctly we can't set splashScreenImage dynamically because it's used during the app's "loading" frame.... (my app is a Flex app - things may be a bit different in pure AS apps?)   ... and any code that I write is never executed until the second frame.

Am I missing something here?

Thanks,

Douglas

Colin Holgate
Inspiring
May 27, 2013

There is a cost to taking control of layout with code. If you are using no_scale layout, you're going to have to take care of what happens on every screen size that you come across. For iOS that's relatively easy, you only have five sizes. To seamlessly jump from the five splash screens to the five stage sizes, have five images in the timeline, and use code to jump to the right one, in frame 1, before the user has seen anything. That may mean not using the Flex approach to embed the splash screen. The value of that splash screen in Flex is when running on Android, which doesn't have its own splash screen system.