我正在研究使用react native cli创建的react native项目。问题在于,当键盘可见/活动时,TextInput会突出显示,并且会挤压视图并弄乱布局,这让我想起了KeyboardAvoidingView行为。即使我在此项目中不使用KeyboardAvoidingView
,因为所有文本输入都在屏幕的上半部分,因此它们不会被键盘覆盖。
<TextInput
style={styles.inputText}
multiline={false}
onSubmitEditing={() => Keyboard.dismiss()}
autoCapitalize="none"
autoCorrect={false}
keyboardType="number-pad"
onChangeText={numberInputHandler}
value={enteredValue}/>
inputText: {
borderBottomColor: "white",
borderBottomWidth: 2,
width: "30%",
position: "absolute",
bottom: Dimensions.get("window").height / 5,
left: Dimensions.get("window").width / 5,
color: "white",
fontSize: Dimensions.get("window").height * 0.03,
fontFamily: "Lato-Regular"
}
React Native Ver 0.61.5
测试已在Android模拟器和Android物理设备上完成
如我所见,您正在使用绝对定位,而底部使用Dimension api
来获取高度。由于此问题发生。尝试提供静态高度,而不是从Dimension获取,因为当键盘出现可见窗口缩小时,由于高度变化,导致重新渲染。
position: "absolute",
bottom: Dimensions.get("window").height / 5,
Nikosssgr提供的解决方案:
在AndroidManifest.xml中]
android:windowSoftInputMode =“ adjustResize”将其更改为“ adjustNothing”