React-native: [DatePickerIOS] Customize font color

[lewisbarber]

Is it possible to change the font color of the DatePickerIOS text? I have it on a black background and can't read the black text...

Passing color:'white' in the style param doesn't work, and from looking at the source code it looks like a RCTDatePickerIOS element is wrapped in a view. I can change the background color of this view, so the black text is legible, but this is not really ideal.

[facebook-github-bot]

Hey lewisbarber, thanks for reporting this issue!

React Native, as you've probably heard, is getting really popular and truth is we're getting a bit overwhelmed by the activity surrounding it. There are just too many issues for us to manage properly.

• If this is a feature request or a bug that you would like to be fixed by the team, please report it on Product Pains. It has a ranking feature that lets us focus on the most important issues the community is experiencing.
• If you don't know how to do something or not sure whether some behavior is expected or a bug, please ask on StackOverflow with the tag react-native or for more real time interactions, ask on Discord in the #react-native channel.
• We welcome clear issues and PRs that are ready for in-depth discussion; thank you for your contributions!

[mihirsoni]

Hi @lewisbarber ,

As iOS docs says there is no official API for changing appearance. You cannot customize the appearance of date pickers

[christopherdro]

Related #3768

[tbolt]

Anyone find a workaround for this? Would love to change the text color of the date picker.

[quangas]

Go to React.xcodeproj/views/RCTDatePickerManager.m

Replace the view with this - choose your own color. Tested on iOS 7 - 9.3

- (UIView *)view
{
 RCTDatePicker *datePicker = [RCTDatePicker new];
 [datePicker setValue:[UIColor whiteColor] forKeyPath:@"textColor"];

 return datePicker;
}

[nitrogenlabs]

A PR has been created to solve this issue:
https://github.com/facebook/react-native/pull/10356

[maurovisintin]

Hi, i tried @quangas solution, but doesn't see to work for me with RN 0.35, any hint?

[omar-salah-elboredy]

@maurovisintin I think you have to run the project in Xcode after applying edit you want, not using react-native run-ios