iOS Question Dynamic dark and light modes

justabill

Member
Licensed User
Longtime User
As Apple is requiring all new apps (in April 2020) to support iOS 13 at a minimum, I'd like to update my app to support the user's system choice of light or dark mode as part of the iOS 13 compatibility. However, I'm not sure how to implement this in b4i.

From Apple's documentation, it looks like iOS 13 has a traitcollection value that tells what the user selected
B4X:
enum UIUserInterfaceStyle: Int {
   case unspecified
   case light
   case dark
}

iOS 13 also has added dynamic system colors so instead of hard coding things to white or gray or black, you can use system defined colors that are appropriate for the current system setting.

from https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/
.
When I'm in the Designer in b4i, I don't see any way to select system colors for labels or headings or backgrounds. If I need to do this in code instead, I'm not sure how to set colors to one of these dynamic system color values for label text or background instead of a hard coded color from the defined list of colors in b4i.

If I can't use the dynamic system colors but have to design two different views in designer for light or dark with hard coded colors, is there a way in b4i to determine what the user selected as their userinterfacestyle so I would know which designer view to load?

I've seen some mentions in the forum that Dark Mode support might be forthcoming but those posts were from 2019. Have I missed where there is a guide to using these system colors or to otherwise support a user's choice in the system settings of dark versus light mode?

Sorry if this is too much of a newbie question but if anyone can direct me to a thread where this is already discussed that I missed in my searching, I would appreciate it.

PS: I am using a local Mac Builder where the current Xcode 11 is installed rather than the hosted builders if that still matters.
 

Erel

B4X founder
Staff member
Licensed User
Longtime User
This requirement is not related to dark theme. Your app meets the new requirements.

I've actually built an almost complete solution for cross platform dark / light theme. You can see some of the work here: https://www.b4x.com/android/forum/threads/dark-light-color-palette.114513/

However I met an issue which appears to be an iOS bug which made the approach I chose not stable enough. It will need to be implemented differently.
I recommend you to wait with this unless it is very important for your app.

You can check whether the device is in dark mode with:
B4X:
Public Sub IsDarkMode As Boolean
    Dim app As Application
    If app.OSVersion < 13 Then Return False
    Dim no As NativeObject = app.KeyController
    Return no.GetField("traitCollection").GetField("userInterfaceStyle").AsNumber = 2
End Sub
 
Upvote 0
Cookies are required to use this site. You must accept them to continue using the site. Learn more…