iOS launch screen for light and dark modes

2
votes

I follow the instruction in RSP-12931: Native resolution not supported on iPAD Pro to create an iOS LaunchScreen for my Delphi app. Now, with iOS 13, the problem is that I need 2 variants of this launch screen, one for dark mode and another for light mode. How do I create a basic launch screen in XCode that shows a customized background color w/ logo image in dark/light modes?

1
iosxcodedelphifiremonkeyios-darkmode
You only need one screen. You use dynamic colours and ensure that any images have a dark appearance version and iOS will take of the rest for you. – Paulw11
@Paulw11, thanks how to ensure that any images have a dark appearance? same for the background color ? – zeus
@loki I am unable to do it, nothing, I do not make it work. Could someone please upload an example? – elcharlie

1 Answers

4
votes

This is all done inside an Asset Catalog.

For the logo, open your asset catalog and select the image. Now, select the Appearances drop down on the right, and select Any, Light, Dark.

The Asset Catalog will now let you add different images for Any (pre-iOS 13), Light and Dark for that particular image:

Support dark mode in Asset Catalog images

For the background color, you'll need to define a custom Color set inside your asset catalog.

Press the + button at the bottom of your list of assets, and select New Color set.

Select the Color set that appears in your assets and, again, adjust the Appearances dropdown to read Any, Light, Dark.

You can now provide different colors for each mode using the RGB sliders underneath the Appearances dropdown:

enter image description here

Now, inside your storyboard you'll be able to select your custom color, and it will adapt depending on the mode running on the device:

enter image description here

You can test this by flipping the Interface Style widget at the bottom of the Interface Builder window between light and dark mode:

enter image description here