How can I specify dark/light mode images for a slider in an iOS settings bundle?

375 views Asked by At

I have a slider in my settings bundle, using the PSSliderSpecifier type. I use the MinimumValueImage and MaximumValueImage keys to provide images that appear to the left/right of the slider. However, as seen in the screenshots below, those images do not adjust based on light/dark mode.

How can I specify a different image to be used, or a different tint color, in light/dark mode? All of the sliders in Apple's settings seem to adjust based on the mode, so it feels like there should be a way, but I don't see any documentation of how to make this happen.

Light mode

Light mode

Dark mode

Dark mode

2

There are 2 answers

1
Benzy Neez On

You can make do with one set of images for both modes of display if you use a medium shade of gray as foreground color. I found that #707070 works quite well, see below.

Light mode Dark mode

1
Andres Gomez On

well. first you can detect the dark mode

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    if traitCollection.userInterfaceStyle == .light {
        print("Light mode")
    } else {
        print("Dark mode")
    }
}

and you can custom the slider with his properties

 slider.minimumTrackTintColor = .green
 slider.maximumTrackTintColor = .red
 slider.thumbTintColor = .black

and the icons for volume you can change when your detect any userInterfaceStyle