I'm using a react-native Modal, which contains a View. The View has some TextInput elements. When the keyboard pops up, the View elements all collapse to fit into the remaining space, but I don't want the View to change at all.
This does not happen for IOS. And also, it does not happen in non-modal Views for Android within the same app.
I have windowSoftInputMode="adjustPan" set in my android Manifest, but it doesn't seem to be applied on the Modal.
return(
<ImageBackground source={require('./../images/IMG1.png')}
style={{flex: 1}} imageStyle={{resizeMode: 'cover'}}>
<View style={{flex: 1}}>
(...)
<Modal visible={this.state.modalVisible} animationType={'slide'}
presentationStyle={'fullScreen'}
onRequestClose={() => this.closeModal()}>
<ImageBackground source={require('./../images/IMG2.png')}
style={{flex: 1}} imageStyle={{resizeMode: 'cover'}}>
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
<View style={{flex:1}}>
(...)
<View style={{flex:0.9, alignItems:'center', justifyContent: 'center',
flexDirection: 'row'}}>
<TextInput style={MyStyle.textInput}
onChangeText={(myTitle) => this.setState({myTitle})}
placeholder='Title'
/>
</View>
As a workaround, I ended up using a fixed height value for the Modal’s child View instead of flex. (Got it using Dimensions height). It seems to work as I expected.