Android上已经自动对键盘遮挡输入框做了处理,所以我们只需要关注ios。

1.首先引入 KeyboardAvoidingView

import { KeyboardAvoidingView } from 'react-native';

2.然后在页面的最外层加上 KeyboardAvoidingView

render(){
return <KeyboardAvoidingView behavior={'padding'} style={{flex: 1}}>
{/*具体页面内容*/}
</KeyboardAvoidingView>
}

如果适配ios和Android,可以将页面提取出来

    getPageView = () => {
//return 具体页面内容
}
getPlatformView = () => {
if (Platform.OS === 'ios') {
return <KeyboardAvoidingView behavior={'padding'} style={{flex: 1}}>
{this.getPageView()}
</KeyboardAvoidingView>
} else {
return this.getPageView();
}
}; render() {
return this.getPlatformView();
}

react-native 键盘遮挡输入框的更多相关文章

  1. react native 键盘遮挡按钮点击事件

    在做项目的时候,我遇到一个很奇怪的问题,我先描述一下问题,在InputText输入内完成以后,点击按钮进行下一步的操作的时候,第一次点击的时候,按钮没有响应,第二次点击的时候才会响应.这样对用户体验有 ...

  2. React-native键盘遮挡输入框问题的解决

    2016年10月25日更新: 现在有一个更准确一点的做法是用一个View包裹住TextInput,然后通过该View的onLayout方法获取该输入框的y轴位置,再减去一个适当的高度去处理scroll ...

  3. iOS键盘遮挡输入框,输入区域自动上移

    在iOS开发过程当中,遇到关于键盘遮挡输入框的问题,经过网络参考与实践,总结如下: 登录窗口,上下放置两个UITextField,一个用户名,一个密码,放置的在屏幕下方1/3处,当点击用户名时,自动弹 ...

  4. iOS- UITextView与键盘回收与键盘遮挡输入框

    一.UITextView 可以实现多行输入的文本框,基本属性与UITextField相似,可以输入多行,可以滚动.UITextView还有个代理方式- (BOOL)textView:(UITextVi ...

  5. iOS 键盘遮挡输入框万能解决方案(多个输入框)

    效果图如下: 思路分析: 代码: 知识点: 问题: 效果图如下: 思路分析: 当我们有很多输入框时,有时候键盘弹出来会遮挡着输入框.我们需要获取输入框和键盘相对于最外层视图的位置来判断是否遮挡,如果遮 ...

  6. [RN] React Native 键盘管理 在Android TextInput遮盖,上移等问题解决办法

    React Native 键盘管理 在Android TextInput遮盖,上移等问题解决办法 解决办法: 打开android工程,在AndroidManifest.xml中配置如下: <ac ...

  7. iOS Android中 h5键盘遮挡输入框的问题和解决方案

    问题发现:在 Android 部分机型 和 iOS部分系统下 键盘会出现遮挡输入框的情况(壳内).问题解决: Android 经过测试,Android 的6.0版本以上均会出现改问题,归根到底是之前的 ...

  8. iOS 开发之路(登陆页键盘遮挡输入框问题)一

    在学习开发登陆页的时候,遇到的问题分享如下: 首先是swift 3.0 中,NotificationCenter 设置 selector 如下: @IBOutlet weak var bottomCo ...

  9. android webview 输入法键盘遮挡输入框的问题

    新建一个工具类: /** * 解决webView键盘遮挡问题的类 * Created by zqy on 2016/11/14. */ public class KeyBoardListener { ...

随机推荐

  1. JQuery 基本使用、操作样式、简单动画

    JQ与JS JQ是JS写的插件库,就是一个JS文件 凡是用JQ能实现的,JS都能实现,JS能实现的,JQ不一定能实现 引入 BootCDN:https://www.bootcdn.cn/jquery/ ...

  2. 4.Android-adt安卓打包过程、adb指令学习

    本章学习adt安卓打包过程.adb指令学习.并通过adb将打包的APK发给设备 1.打包 在eclipse中已经帮我们实现打包了. 具体打包流程如下: 最终一个APK包含了如下: classes.de ...

  3. 【iOS翻译】对UIGestureRecognizer多种手势傻傻分不清

    UIGestureRecognizerDelegate A set of methods implemented by the delegate of a gesture recognizer to ...

  4. React的世界观及与Vue之比较

    写在前面:本文谈论的是主观的个人感受,不追求立场的“客观.公正”,因此我下面所说的很可能是错的,欢迎交流指正. 我学习前端时,跟大部分beginner一样,学的第一个框架是Vue,入职后也一直写Vue ...

  5. PHP中使用date获取上月最后一天出现的问题

    上次做项目时,发现一个问题,这里记录一下: 问题: 在使用date函数获取上一个月最后一天或下个月最后一天时,如果当前日期是31号,获取的数据有问题. // 2019-12-01 正确应该是 2019 ...

  6. Android Studio中的AndroidManifest.xml文件分析

    一.关于AndroidManifest.xml AndroidManifest.xml清单文件是每个Android程序中必须的文件,它是整个Android程序的全局描述文件,除了能声明程序中的Acti ...

  7. RDP矢量数据压缩算法

    在绘制对象边缘时涉及到了这个算法,记录一下. 该算法递归进行,首先设定一个阈值,在点集的第一个点和最后一个点间拉一条线段,找出剩下的点集中离线段最远的一个点,如果该点到线段的距离小于阈值则舍弃中间的所 ...

  8. 修改HTML元素

    通过HTML DOM,JavaScript能够访问并修改HTML文档中的每个元素 修改元素文本内容 document.getElementById("p1").innerHTML= ...

  9. Docker异常:/lib/x86_64-linux-gnu/libnss_files.so.2: symbol __libc_readline_unlocked, version GLIBC_PRIVATE not defined in file libc.so.6 with link time reference

    当使用docker cp 将容器内数据拷贝至主机时,或是使用docker export 命令归档容器文件时,出现下述异常: Error response from daemon: error proc ...

  10. MyBatis操作Oracle批量插入 ORA-00933: SQL 命令未正确结束

    最近在使用MyBatis操作Oracle数据库的时候,进行批量插入数据,思路是封装一个List集合通过Myabtis 的foreach标签进行循环插入,可是搬照Mysql的批量插入会产生 异常 ### ...