Opens the standard Android date picker dialog.
The available keys for the options object are:
date (Date object or timestamp in milliseconds) - date to show by default
minDate (Date or timestamp in milliseconds) - minimum date that can be selected
- * maxDate (Date object or timestamp in milliseconds) - minimum date that can be selected
Returns a Promise which will be invoked an object containing action, year, month (0-11),
+ maxDate (Date object or timestamp in milliseconds) - minimum date that can be selected
+ mode (enum('calendar', 'spinner', 'default')) - To set the date-picker mode to calendar/spinner/default
+ - 'calendar': Show a date picker in calendar mode.
+ - 'spinner': Show a date picker in spinner mode.
+ - 'default': Show a default native date picker(spinner/calendar) based on android versions.
Returns a Promise which will be invoked an object containing action, year, month (0-11),
day if the user picked a date. If the user dismissed the dialog, the Promise will
still be resolved with action being DatePickerAndroid.dismissedAction and all the other keys
being undefined. Always check whether the action before reading the values.
Note the native date picker dialog has some UI glitches on Android 4 and lower
@@ -38,6 +42,9 @@ class DatePickerAndroidExample extends : new Date(2020, 4, 5),
allDate: new Date(2020, 4, 5),
simpleText: 'pick a date',
+ spinnerText: 'pick a date',
+ calendarText: 'pick a date',
+ defaultText: 'pick a date',
minText: 'pick a date, no earlier than today',
maxText: 'pick a date, no later than today',
presetText: 'pick a date, preset to 2020/5/5',
@@ -70,6 +77,24 @@ class DatePickerAndroidExample extends ={styles.text}>{this.state.simpleText}</Text>
</TouchableWithoutFeedback>
</UIExplorerBlock>
+ <UIExplorerBlock title="Simple spinner date picker">
+ <TouchableWithoutFeedback
+ onPress={this.showPicker.bind(this, 'spinner', {date: this.state.spinnerDate, mode: 'spinner'})}>
+ <Text style={styles.text}>{this.state.spinnerText}</Text>
+ </TouchableWithoutFeedback>
+ </UIExplorerBlock>
+ <UIExplorerBlock title="Simple calendar date picker">
+ <TouchableWithoutFeedback
+ onPress={this.showPicker.bind(this, 'calendar', {date: this.state.calendarDate, mode: 'calendar'})}>
+ <Text style={styles.text}>{this.state.calendarText}</Text>
+ </TouchableWithoutFeedback>
+ </UIExplorerBlock>
+ <UIExplorerBlock title="Simple default date picker">
+ <TouchableWithoutFeedback
+ onPress={this.showPicker.bind(this, 'default', {date: this.state.defaultDate, mode: 'default'})}>
+ <Text style={styles.text}>{this.state.defaultText}</Text>
+ </TouchableWithoutFeedback>
+ </UIExplorerBlock>
<UIExplorerBlock title="Date picker with pre-set date">
<TouchableWithoutFeedback
onPress={this.showPicker.bind(this, 'preset', {date: this.state.presetDate})}>