2

I'm using react-native-modal-datetime-picker in my React Native app on iOS, and when the modal pops up, instead of having a range of dates to scroll through, it shows only the current date:

enter image description here

<DateTimePickerModal
    datePickerModeAndroid={'spinner'}
    mode={'date'}
    is24Hour={false}
    isVisible={this.state.isDatePickerVisible}
    onConfirm={() => {}}
    onCancel={() => {}}/>

react-native-modal-datetime-picker@8.9.3 react-native@0.63.4

Does anyone know how to approach solving this?

gkeenley
  • 6,088
  • 8
  • 54
  • 129
  • Does this happen on the real device only or also on your simulator? – David Scholz Feb 20 '22 at 12:10
  • @DavidScholz Both, emulator and real device – gkeenley Feb 20 '22 at 21:55
  • I've tried it using `react-native-modal-datetime-picker@13.0.1` and it works on my setup. Are you allowed to upgrade? It might work in the newer version. – David Scholz Feb 20 '22 at 21:57
  • I'm not able to upgrade the react-native version, and it seems like I can't upgrade react-native-modal-datetime-picker beyond 8.9.3 with react-native@0.63.4. I can mess around with that more though. What version of react-native are you using? – gkeenley Feb 20 '22 at 22:42

2 Answers2

0

Just add display={"spinner"}

Your device/simulator use default display style which is calendar and in calendar case above UI will be render.

Example Code:

<DateTimePickerModal
    date={this.props.currentDate || undefined}
    maximumDate={this.props.maximumDate}
    minimumDate={this.props.minimumDate}
    mode="date"
    onCancel={this.onCancel}
    onConfirm={this.onConfirm}
    isVisible={this.state.modalOpened}
    display={this.props.display}
/>
Juliano Alves
  • 2,006
  • 4
  • 35
  • 37
Pradeep Kumar
  • 41
  • 4
0

  1. add display = 'spinner'

    and inside ios->myappname->AppDelegate.m add these lines inside didfinishlaunch options;

    
    if (@available(iOS 14, *)) {
        UIDatePicker *picker = [UIDatePicker appearance];
        picker.preferredDatePickerStyle = UIDatePickerStyleWheels;  }
abolfazl sadeghi
  • 2,277
  • 2
  • 12
  • 20
ABHILASH BHOSLE
  • 11
  • 2