Search code examples
iosxcodedelphifiremonkeyios-darkmode

iOS launch screen for light and dark modes


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?


Solution

  • 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