React Native 中出现键盘时如何移动视图？

Question

当 TextInput 获得焦点时，键盘会隐藏提交按钮。 如何自动滑动 TextInput 下面的组件

Answer 1

现在使用react-native KeyboardAvoidingView怎么样（官方文档）

import {KeyboardAvoidingView} from 'react-native';

<KeyboardAvoidingView style={styles.container} behavior="padding" enabled>
  ... your UI ...
</KeyboardAvoidingView>;

在 iOS 上进行了测试，对我来说开箱即用效果很好。对于 Android，请考虑添加参数：

android:windowSoftInputMode="adjustResize"

到您的 AndroidManifest.xml

Answer 2

我遇到了同样的问题，想要在键盘出现时移动内容。

我通过使用类似问题的最后一个答案解决了它：

当TextInput获得焦点时如何自动将窗口从键盘后面滑出？

您基本上使用键盘事件侦听器并相应地调整内容。但请注意，iOS 和 Android 之间的侦听器有所不同。 Android仅支持keyboardDidShow和keyboardDidHide，而iOS也支持keyboardWillShow和keyboardWillHide。

希望有帮助！

Answer 3

我只是想在解决自己的问题后添加答案。我发现

<KeyboardAvoidingView>

无论出于何种原因都不能很好地发挥作用。

您还可以使用事件侦听器和

Keyboard

类直接操作视图。

Keyboard.addListener('keyboardDidShow', () => {
    // manipulate views in whatever way you need to
}
Keyboard.addListener('keyboardDidHide', () => {
    // manipulate views in whatever way you need to
}

在 Android 上对我来说效果很好。