DatePicker modal background color

I have gone through these following points

• Check latest documentation: https://docs.nativebase.io/
• Check for existing open/closed issues for a possible duplicate before creating a new issue: https://github.com/GeekyAnts/NativeBase/issues
• Use the latest NativeBase release: https://github.com/GeekyAnts/NativeBase/releases
• Check examples from NativeBase KitchenSink https://github.com/GeekyAnts/NativeBase-KitchenSink
• [] For discussion purpose make use of NativeBase Slack: http://slack.nativebase.io/
• For queries related to theme, check Theme Variables from Docs and live NativeBase Theme Editor http://nativebase.io/customizer/

Issue Description

node, npm, react-native, react and native-base version, expo version if used, xcode version

Expo v35.0.0

Expected behaviour

The date should be seen in order to select.

Actual behaviour

For iOS dark mode the date is not seen. Actually it is rendered but the color matches with modal’s background so can not be seen.

Steps to reproduce

Just a standard DatePicker code causes same experience if the code is tested with iOS dark-mode.

import * as React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import { DatePicker } from 'native-base';

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = { chosenDate: new Date() };

    this.setDate = this.setDate.bind(this);
  }
  setDate(newDate) {
    this.setState({ chosenDate: newDate });
  }
  render() {
    return (
      <View style={styles.container}>
        <Text />
        <Text />
        <Text />
        <DatePicker
          defaultDate={new Date(1976, 12, 23)}
          minimumDate={new Date(1940, 1, 1)}
          maximumDate={new Date(2040, 12, 31)}
          locale={'en'}
          timeZoneOffsetInMinutes={undefined}
          modalTransparent={false}
          animationType={'fade'}
          androidMode={'default'}
          placeHolderText="Select date"
          textStyle={{ color: 'green' }}
          placeHolderTextStyle={{ color: '#d3d3d3' }}
          onDateChange={this.setDate}
        />
        <Text>Date: {this.state.chosenDate.toString().substr(4, 12)}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  },
});

Is the bug present in both iOS and Android or in any one of them?

Problem is only for iOS in dark mode

Any other additional info which would help us debug the issue quicker.

###Important

Expo snack here: (https://snack.expo.io/@mehmetkaplan/native-base-datepicker-test)

[Kuhne1]

I know it isn’t a solution, but for those looking for a temporary fix on their apps, you can add this to your AppDelegate.m. This will force light mode, for your application.

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

Source https://github.com/facebook/react-native/issues/26299

[MehmetKaplan]

Closed as per the duplicate label