react native TextInput 对android 的适配

最新推荐文章于 2023-06-12 11:11:36 发布
最新推荐文章于 2023-06-12 11:11:36 发布
阅读量4.5k 收藏
点赞数
分类专栏： react-native 文章标签： react-native TextInput
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lpcz2010/article/details/53668096
版权

textInput 在iOS 显示正常，在android 会有一根线，以及字会被遮盖

属性加入：

style={{padding:0}}

underlineColorAndroid={'transparent'}


如果style里有其他padding的设置，把padding：0 放到其他padding的前面，这样不影响布局

kerrli
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
React-Native TextInput组件详解及实例代码
01-04
同时适配Android和IOS 代码注释比较详细 /** * Sample React Native App * https://github.com/facebook/react-native * @flow */ import React, {Component} from 'react'; import { AppRegistry, StyleSheet, Text, View, TextInput, Platform, TouchableOpacity, } from 'react-native'; //获取屏幕信息 var Dimensions
android字符输入框是什么类型,React Native - 文本输入框（TextInput）的使用详解
weixin_35649143的博客
05-26 330
6，组件的成员函数(1)isFocused()当得到一个 TextInput 组件的引用后，通过这个方法可以判断当前这个 TextInput 组件是否获得焦点。this.refs.aTextInputRef.isFocused();(2)clear()当得到一个 TextInput 组件的引用后，通过这个方法可以将 TextInput 组件中的字符串清空。this.refs.aTextInputR...
react native中ScrollView嵌套TextInput安卓端有滑动问题
最新发布
weixin_38009285的博客
06-12 227
（3）用TouchableOpacity包裹TextInput组件。⚠️：此种方法不能将光标移动到前面的位置，只能固定在最后，因为点击的事件是TouchableOpacity而非TextInput。react native中ScrollView嵌套TextInput，TextInput组件设置了 textAligin:‘right’ 后安卓端按住TextInput组件的区域无法正常进行滑动。ScrollView嵌套TextInput后，滑动事件被TextInput组件使用，没有被父组件捕捉到滑动。
ReactNative与Android中的屏幕适配
vv_bug
02-09 5867
前言：从开始接触rn到现在终于能写出点东西了，的确得为自己好好地点个赞 ，不管咋样，学习还是得继续啊，废话少说了，在rn中我们也需要对屏幕进行适配，但是rn中的适配貌似比android原生容易很多（不得佩服facebook那些大神哈，对android原生控件封装的太屌！）。我们先看看rn中的屏幕适配（作为一个android程序员去做rn确实比ios程序员考虑的东西多一点点哈，嘻嘻～～）： 结合an
React Native Android上TextInput输入值被遮挡
Arno的博客
04-08 2807
React native的TextInput的组件在Android上输入文字被遮挡住，直接在TextInput的样式上加padding:0
react-native textInput在android上显示不全的解决办法
爱开车的彬哥的CSDN博客
06-25 2829
在用react-native编写Android应用的遇到： 解决办法：给textInput加上 paddingVertical: 0, 关于该样式的详细介绍可以查看链接文章： paddingVertical的介绍
ReactNative系列之三屏幕适配
yeputi_WK的博客
04-05 3802
针对Android和iOS的不同机型进行屏幕适配是开发中不可避免的一部分。针对ReactNative提供的PixelRatio类。解决办法可以分为两种： 第一种，依据一个想要适配的分辩率为主适配对象，根据获取不同机型的手机密度算出显示相对合理的值。可以实现的效率为，在密度为2.5的机型上显示一张图片，宽度为屏幕的一半。经过换算，在机型为3.0的机型上也显示宽度为屏幕的一半。 实现的参考代码为：
React-Native:（多行文本）ios端将键盘回车改为确定键
GuoLinghang
11-30 7841
ios端<TextInput>设置为多行文本而调出键盘时，可能无法收回键盘（键盘上只有回车，没有确定）（安卓端键盘大多有收起键盘的按钮，不存在这个问题）TextInput 属性(Style) 类型 值/备注 returnKeyType enum(枚举) ‘default’, ‘go’, ‘google’, ‘join’, ‘next’, ‘route’, ‘search’, ‘
React Native之TextInput组件解析示例
08-29
本篇文章主要介绍了React Native之TextInput组件解析示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Android原生项目集成React Native的方法
08-28
this is my first react example
TextInputDemo
01-05
TextInputLayout & TextInputEditText
react-native-detect-navbar-android:React Native模块，告知android设备是否具有软导航栏
05-28
react-native-detect-navbar-android 检测Android设备的软导航栏，以便您知道哪个具有物理键（Home，Back，Menu），而哪些没有。 注意：该项目仅适用于Android，如果您使用它来检测软键是否被隐藏，它将无法正常...
React Native Android 下，TextInput 换行。
孑书力的博客
02-08 7381
在RN版本0.44，长文本编辑，使用TextInput。 出现以下问题： 1：点击软键盘中“回车”按钮，软键盘隐藏。 2：设置blurOnSubmit={false}，点击软键盘中“回车”按钮，没有换行。 3：TextInput设置高度，文字默认是居中显示。设置高度自增长，有闪烁。 根据问题来一步步解决 实现效果 1：点击软键盘中“回车”按钮，软键盘隐藏。 ...
React Native 之 TextInput组件去掉下划线
圣人男的博客
04-17 1595
在使用RN开发中，TextInput 组件使用，iOS 没有下划线 而安卓有下划线 ，特此需要设置&lt;View style ={ETTLogStyles.log_input_top}&gt; &lt;TextInput style ={this.inputStyle()} placeholder={this.placeholder() }&gt; &lt;/TextInput...
React Native控件只TextInput
xiangzhihong8的专栏
09-17 7460
学习React Native也有2个月了，从最开始的页面到点点击事件，到调用接口大体都会了，今天实现一个简单的登录功能。这里需要说明几点：1、组件在React Native中，默认是带一条横线的，如果想去掉输入框下面的横线，需要给指定一个underlineColorAndroid='transparent'，这样就可以去掉输入框下面的横线了；2、密码输入框需要指定属性：secureTextEntr
ReactNative屏幕适配解决方案
kakaxiqianxin的专栏
06-12 9154
ReactNative也是以pt为单位的，这种单位会导致界面变形 先上界面布局 render() { return ( &amp;lt;View style={styles.container}&amp;gt; &amp;lt;Text style={styles.welcome}&amp;gt; Welcome to React Native! &amp;...
input框行高在安卓和IOS的问题
ChuXin_0817的博客
07-24 2135
行高在不同的手机下还是有不同的区别，特别是ios就很容易体现出来，给了height属性之后，这时我们设置行高可以比高度大一点点，如：height: .45rem ; line-height: .5rem;(具体给多少要结合自己实际的情况)，要是安卓有问题的话，我们可以给下面这段代码监听： 判断是ios还是安卓：   var u = navigator.userAgent;         v
react-native 屏幕尺寸和文字大小适配
热门推荐
卓原的进化之旅
06-27 3万+
  现在的手机品牌和型号越来越多，导致我们平时写布局的时候会在个不同的移动设备上显示的效果不同， 比如我们的设计稿一个View的大小是300px，如果直接写300px，可能在当前设备显示正常，但到了其他设备可能就会偏小或者偏大，这就需要我们对屏幕进行适配。 安卓原生的话有自己的适配规则，可以根据不同的尺寸建立不同的文件夹，系统会根据当前的设备尺寸取对应的大小的布局。而RN本身并没有适配规则，...
react native 实现列表滑动 菜单栏悬停 （过程优化，体验更平滑）
娃娃鼠小抄
12-13 7949
菜单栏是个 Animated.View , 他的高度会随着列表的onScroll时间滑动重置 （这个很共识） 但是 你要把 view 的高度 放到state中，跟着onScroll 改变，这样的滑动效果会有卡顿感。 这里onScroll里的方法要这样写：  Animated.event(       [{ nativeEvent: { contentOffset: { y: this.st
react native textinput
04-09
react native textinput是一个React Native组件，用于创建可编辑的文本输入框。用户可以在文本输入框中输入和编辑文本，例如登录表单、搜索框等。这个组件支持自定义样式和事件处理，可以根据需要进行定制。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值