react-native如何在键盘上方向上移动文本字段 [英] React-native how to move up Textfield above keyboard

问题描述

我正在尝试在显示键盘时向上移动文本字段.我正在用React Native应用程序登录屏幕，所以，我添加了 Scrollview .

I am trying to move textfields up while showing the keyboard. I am doing login screen in react native application, So, I have added Scrollview.

但是，它可在所有设备上滚动.但是，我只需要iPhone 5s设备.

But, Its scrolling for all devices. But, I need only for iPhone 5s device only.

即使我尝试使用 KeyboardAvoidingView ，但是，由于整个数据都是重叠的.

Even I tried with KeyboardAvoidingView, But, due to this entire data is overlapping.

有什么建议可以避免这个问题?

Any suggestions to avoid this issue?

推荐答案

对于仍在寻找的任何人:对于内容上的任何输入字段，有2个库可帮助获得最佳效果.

For anyone that is still looking: There are 2 libraries that help to get the best result with that, for any input field on the content.

1. 'react-native-keyboard-aware-scrollview';
2. 'react-native-keyboard-tracking-view';

只需导入以下内容:

   import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scrollview';
   import {KeyboardAwareInsetsView} from 'react-native-keyboard-tracking-view';

和您的render方法应该像这样:

and your render method should be like:

public render(): JSX.Element {
    return (
       <View style={{flex: 1}}>
       <KeyboardAwareScrollView style={{flex: 1}} keyboardShouldPersistTaps={'always'}>
          {this.renderInputContent()}
        </KeyboardAwareScrollView>
        {this.renderCTA()}
        <KeyboardAwareInsetsView/>
       <View/>

    );
  }

这篇关于react-native如何在键盘上方向上移动文本字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！