redux 如何在React Native中显示键盘时移动视图?

jhkqcmku  于 12个月前  发布在  React
关注(0)|答案(3)|浏览(110)

当文本输入为焦点时,键盘会隐藏提交按钮。如何自动滑动文本输入下方的组件

pcrecxhr

pcrecxhr1#

如何使用react-native KeyboardAvoidingView(official docs

import {KeyboardAvoidingView} from 'react-native';

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

字符串
在iOS上测试,对我来说,开箱即用效果很好。对于Android,请考虑将参数:android:windowSoftInputMode="adjustResize"添加到您的AndroidManifest.xml

ds97pgxw

ds97pgxw2#

我遇到了同样的问题,当键盘出现时,我想移动内容。
我用一个类似问题的最后一个答案解决了这个问题:
How to auto-slide the window out from behind keyboard when TextInput has focus?
您基本上使用键盘的事件侦听器并相应地调整内容。请注意,iOS和Android之间的侦听器不同。Android仅支持keyboardDidShow和keyboardDidHide,而iOS还支持keyboardWillShow和keyboardWillHide。
希望有帮助!

vojdkbi0

vojdkbi03#

我只是想在解决了自己的问题后再加一个答案,我发现<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上运行得很好。

相关问题