Change UIDatePicker selected Date text Color for Dark mode (iOS 13)

Question

Having trouble to find out a solution for changing the color of text for the selected Date in iOS 13 dark mode.

I know how to change the color of the text of a UIPicker view using code

self.timePicker.setValue(UIColor.black, forKeyPath: "textColor")

OR using User Defined Runtime Attributes. But nothing is working for changing the selected date color for iOS 13 Dark mode. With background white color and black text color, my date picker-view looks like this:

So with changing the text color black, does not change the selected date text color. It changes all the other text color to black; but not the selected one. Selected one stays white, which is default for dark mode.

Sorry didn't get it. Why would I use label? I am change the color. Should I mention the color as value for the keyfield 'textColor' ? — A K M Saleh Sultan, Sep 24 '19 at 21:02
Don't change the color in code! Set all colors in Interface Builder to `default` — vadian, Sep 24 '19 at 21:02
Well, the problem is that, our app background color is dark gray. So i use the default mode, it will bring the text color to white with clear background. So we wanted to keep it same for both dark and normal mode, which is black text color with white background. — A K M Saleh Sultan, Sep 24 '19 at 21:05
Possible duplicate of [iOS13 White Color issue with textColor of UIKit](https://stackoverflow.com/questions/57985583/ios13-white-color-issue-with-textcolor-of-uikit) — Pratik Sodha, Sep 25 '19 at 13:55
Refer this - https://stackoverflow.com/questions/57985583/ios13-white-color-issue-with-textcolor-of-uikit/57985965#57985965 — Pratik Sodha, Sep 25 '19 at 13:55
The "label" color doesn't solve it. UIDatePicker ignores both the background-color and "tint" settings. If your app has a dark background, date pickers are illegible in Light mode. — Oscar, Oct 14 '20 at 23:35

score 13 · Answer 1 · edited Nov 11 '19 at 14:18

13

You can set self.window inside AppDelegate.m and override Interface style like so

if (@available(iOS 13, *)) {
    self.window.overrideUserInterfaceStyle = UIUserInterfaceStyleLight;
}
return YES;

Swift 5.*

if #available(iOS 13.0, *) {
    self.window?.overrideUserInterfaceStyle = .light
}

edited Nov 11 '19 at 14:18

Mohit Kumar

2,898
3
21
34

answered Oct 07 '19 at 10:51

copser

2,523
5
38
73

This also makes embedded maps use the light color scheme when they should be using the dark one. – craigpatik Dec 12 '19 at 11:53

A K M Saleh Sultan · Accepted Answer · 2019-09-25T13:33:17.780

I found something that solves the problem in a way. If I mark 'hightlightsToday' color to false, then the selected text shows with the color you set your code.

self.datePicker.setValue(false, forKey: "highlightsToday")

But if I wanted to highlight my selected date text color with a different color; in that case not sure which key value I have to change. So I am going to leave the question open, incase anyone knows how to change the selected date text color for dark mode.

score 6 · Answer 3 · edited Jun 03 '21 at 22:53

6

You can resolve this problem via Info.plist file. Add "UIUserInterfaceStyle" key and "Light" value in Info.plist file.

<key>UIUserInterfaceStyle</key>
<string>Light</string>

Reference: https://github.com/xgfe/react-native-datepicker/issues/365#issuecomment-532875809

edited Jun 03 '21 at 22:53

teradyl

2,584
1
25
34

answered Dec 12 '19 at 20:55

muratoner

2,316
3
20
32

score 3 · Answer 4 · answered Feb 10 '20 at 07:41

You can write an extension for UIDatePicker and then set the textColor of the datePicker text to UIColor.label, it will dynamically change according to the interface mode(light/dark mode).

extension UIDatePicker {

     var textColor: UIColor? {
         set {
              setValue(newValue, forKeyPath: "textColor")
             }
         get {
              return value(forKeyPath: "textColor") as? UIColor
             }
     }  

     var highlightsToday : Bool? {
         set {
              setValue(newValue, forKeyPath: "highlightsToday")
             }
         get {
              return value(forKey: "highlightsToday") as? Bool
             }
     }      
 }

After this, you can set the textColor value like:-

  let datePicker = UIDatePicker()  
  datePicker.textColor = UIColor.label

For Obj-C. this worked for me: [self.datePicker setValue:[UIColor whiteColor] forKey:@"textColor"]; — Ken Roy, Apr 10 '21 at 13:51

Change UIDatePicker selected Date text Color for Dark mode (iOS 13)

4 Answers4