Skip to content

Commit e4e2193

Browse files
Stephane MaillardStephane Maillard
Stephane Maillard
authored and
Stephane Maillard
committed
Fix onDateChange on iOS
1 parent 95c7d64 commit e4e2193

File tree

1 file changed

+28
-11
lines changed

1 file changed

+28
-11
lines changed

index.js

Lines changed: 28 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,15 @@ class DatePicker extends Component {
2929
this.state = {
3030
date: this.getDate(),
3131
modalVisible: false,
32-
animatedHeight: new Animated.Value(0)
32+
animatedHeight: new Animated.Value(0),
33+
allowPointerEvents: true
3334
};
3435

3536
this.datePicked = this.datePicked.bind(this);
3637
this.onPressDate = this.onPressDate.bind(this);
3738
this.onPressCancel = this.onPressCancel.bind(this);
3839
this.onPressConfirm = this.onPressConfirm.bind(this);
40+
this.onDateChange = this.onDateChange.bind(this);
3941
this.onDatePicked = this.onDatePicked.bind(this);
4042
this.onTimePicked = this.onTimePicked.bind(this);
4143
this.onDatetimePicked = this.onDatetimePicked.bind(this);
@@ -165,6 +167,19 @@ class DatePicker extends Component {
165167
return (<Text style={[Style.dateText, customStyles.dateText]}>{this.getDateStr()}</Text>);
166168
}
167169

170+
onDateChange(date) {
171+
this.setState({
172+
allowPointerEvents: false,
173+
date: date
174+
})
175+
const timeoutId = setTimeout(() => {
176+
this.setState({
177+
allowPointerEvents: true
178+
})
179+
clearTimeout(timeoutId)
180+
}, 500)
181+
}
182+
168183
onDatePicked({action, year, month, day}) {
169184
if (action !== DatePickerAndroid.dismissedAction) {
170185
this.setState({
@@ -317,16 +332,18 @@ class DatePicker extends Component {
317332
<Animated.View
318333
style={[Style.datePickerCon, {height: this.state.animatedHeight}, customStyles.datePickerCon]}
319334
>
320-
<DatePickerIOS
321-
date={this.state.date}
322-
mode={mode}
323-
minimumDate={minDate && this.getDate(minDate)}
324-
maximumDate={maxDate && this.getDate(maxDate)}
325-
onDateChange={(date) => this.setState({date: date})}
326-
minuteInterval={minuteInterval}
327-
timeZoneOffsetInMinutes={timeZoneOffsetInMinutes}
328-
style={[Style.datePicker, customStyles.datePicker]}
329-
/>
335+
<View pointerEvents={this.state.allowPointerEvents ? 'auto' : 'none'}>
336+
<DatePickerIOS
337+
date={this.state.date}
338+
mode={mode}
339+
minimumDate={minDate && this.getDate(minDate)}
340+
maximumDate={maxDate && this.getDate(maxDate)}
341+
onDateChange={this.onDateChange}
342+
minuteInterval={minuteInterval}
343+
timeZoneOffsetInMinutes={timeZoneOffsetInMinutes}
344+
style={[Style.datePicker, customStyles.datePicker]}
345+
/>
346+
</View>
330347
<TouchableHighlight
331348
underlayColor={'transparent'}
332349
onPress={this.onPressCancel}

0 commit comments

Comments
 (0)