React Native DateTime Picker Dynamic Dark/Light Mode

Question

I struggle to find a DateTime Picker library for React Native which supports dynamic changes from light to dark mode or any other styling changes on runtime for that matter. The library I use now and is the most common, you can only change styles.xml before compiling.

https://github.com/react-native-datetimepicker/datetimepicker

Anyone has used a library which supports dynamic styling on runtime?

Answer 1

To change the color of the react-native-date-picker textColor based on the Android theme (dark or light), you can use the useColorScheme hook from React Native.

import { useColorScheme } from 'react-native';

for example :

const colorScheme = useColorScheme();
const datePickerColor = colorScheme === 'dark' ? 'white' : 'black';

 <DatePicker
    date={new Date()}
    onDateChange={(date) => console.log(date)}
    textColor={datePickerColor}
 />