react-native-modalize
react-native-modalize copied to clipboard
TextInput with iOS hardware keyboard not working
Describe the bug
The bug appears when I switch from a software keyboard to a hardware keyboard. It occurs when I move the popover and release it in any place. I also noticed that when the prop avoidKeyboardLikeIOS
is set to false
, the issue with the hardware keyboard goes away, but in that case, the software keyboard overlaps the modal content. I suppose that the problem is with KeyboardAvoidingView, which the library utilizes under the hood.
Reproduce
Simulator iPad Pro (12.9 inch) - 6th generation - iOS 16.2
Dependencies:
- "expo": "~48.0.9",
- "expo-status-bar": "~1.4.4",
- "react": "18.2.0",
- "react-native": "0.71.4",
- "react-native-gesture-handler": "^2.9.0",
- "react-native-modalize": "^2.1.1",
- "expo-splash-screen": "~0.18.1"
import { StatusBar } from 'expo-status-bar';
import React, { useRef } from 'react';
import { StyleSheet, Text, View, TouchableOpacity, TextInput } from 'react-native';
import { Modalize } from 'react-native-modalize';
export default function App() {
const modalizeRef = useRef(null);
const onOpen = () => {
modalizeRef.current?.open();
};
return (
<View style={styles.container}>
<StatusBar style="auto" />
<TouchableOpacity onPress={onOpen}>
<Text>Open the modal</Text>
</TouchableOpacity>
<Modalize adjustToContentHeight ref={modalizeRef}>
<TextInput
placeholder="Placeholder"
style={{
borderWidth: 1,
padding: 20,
margin: 50,
fontSize: 30,
}}
/>
</Modalize>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});