react-native-modal-datetime-picker: "Confirm" and "Cancel" buttons don't work in portrait mode (iOS)
Environment
Platforms
Versions
- iOS: 14.0
- react-native-modal-datetime-picker: 9.0.0
- react-native-community/datetimepicker: 3.0.4
- react-native: 0.63.3
- react: 16.13.1
Description
“Confirm” and “Cancel” buttons don’t work in portrait mode (not tappable).

code:
import React, { useState } from "react";
import { Button, View } from "react-native";
import DateTimePickerModal from "react-native-modal-datetime-picker";
const Example = () => {
const [isDatePickerVisible, setDatePickerVisibility] = useState(false);
const showDatePicker = () => {
setDatePickerVisibility(true);
};
const hideDatePicker = () => {
setDatePickerVisibility(false);
};
const handleConfirm = (date) => {
console.warn("A date has been picked: ", date);
hideDatePicker();
};
return (
<View>
<Button title="Show Date Picker" onPress={showDatePicker} />
<DateTimePickerModal
isVisible={isDatePickerVisible}
mode="date"
onConfirm={handleConfirm}
onCancel={hideDatePicker}
/>
</View>
);
};
export default Example;
Reproducible Demo
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 2
- Comments: 19 (6 by maintainers)
https://github.com/facebook/flipper/issues/1399#issuecomment-681902393
https://github.com/facebook/react-native/issues/29492#issuecomment-681888873
Any solution on this behavior?
https://user-images.githubusercontent.com/6825724/120190032-59692a00-c218-11eb-896a-75f8902602d6.mov
When opening the DatePicker in landscape mode, the view changes to portrait mode. When closing the DatePicker, the view changes to landscape mode again.