TextInput组件和Touchable组件

来源:互联网 发布:python遍历一个字符串 编辑:程序博客网 时间:2024/05/16 15:37
一、TextInput组件

   1. 通过键盘将文本输入到应用程序的一个基本组件,写法如下:

       <TextInput />

   2. 组件的常用属性

     1) placeholder

         占位符,在输入前显示的文本内容。

     2) value

        文本输入框的默认值,该值设置过后,不能在输入框内直接修改,在下一篇会讲解修改方式,这个属性在本篇先不用管。

     3) placeholderTextColor

        占位符文本的颜色

     4) multiline

        如果为 true,表示多行输入

     5) editable

        默认为 true。如果设置为 false 表示不可编辑。

     6) autoFocus

        如果为 true,则自动获取焦点

     7) maxLength

        能够输入的最长字符数

     8) secureTextEntry

        默认为 false。如果为 true,则像密码框一样隐藏输入内容。

     9) underlineColorAndroid

        设置默认下划线的颜色,设置为transparent,相当于让下划线消失

   3. 组件的方法

     1) onChangeText

         当文本发生变化时,调用该函数。

     2) onEndEditing

         当结束编辑时,调用该函数。也就是当输入框上没有光标去闪烁时代表输入结束。

     3) onBlur

         失去焦点时触发,和onEndEditong基本上是一样的
     
     4) onFocus

         获得焦点时触发。

     5) onSubmitEditing

        当结束编辑后,点击键盘的提交按钮触发该事件

二、组件Touchable系列

   1. 之前可以触摸的组件

      RN的很多组件默认都不支持点击,目前我们学习的能够点击的组件只有一个Text,之前我们可以使用Text来实现按钮,RN其实给我们提供了几个组件专门让我们给默认不能点击的组件设置点击事件。

   2. Touchable系列组件

      TouchableHighlight(触摸点击高亮效果),TouchableNativeFeedback(仅限android平台),TouchableOpacity(透明度变化),TouchableWithoutFeedback。其中最后一个控件是触摸点击不带反馈效果的,另外三个都是有反馈效果。可以这样理解前面三个都是继承自TouchableWithoutFeedback扩展而来。本篇我只讲解一个TouchableOpacity,其他的有兴趣可以自行研究。

   3. TouchableOpacity(透明度变化)

       1) 该组件封装了响应触摸事件,当点击按下的时候,该组件的透明度会降低

       2) 常用属性

           a) activeOpacity number

          设置组件在进行触摸的时候,显示的不透明度(取值0-1之间)

           b) underlayColor

              当触摸或者点击控件的时候显示出的颜色

           c) style

          可以设置控件的风格演示,该风格演示可以参考View组件的style

       3) 常见的触摸事件

           注意:调用得用箭头函数,比如
 
              onPress={()=>this.press()}

           a) onPress 点击

           b) onPressIn 按下

           c) onPressOut 抬起

           d) onLongPress 长按不放

   4. 使用方式

       将想要实现点击的组件用Touchable系列组件给包含起来,然后给Touchable系列组件添加触摸事件即可,比如让View组价可点击

         <TouchableOpacity onPress={()=>this.press()}>'
              <View><View/>
         <TouchableOpacity/>


0 0
原创粉丝点击