react-native中View组件这是单纯的视图容器,并不能响应交互变化,绑定事件,rn提供了TouchableOpacity等封装组件以正确响应触摸操作。

TouchableWithoutFeedback:单纯的用户点击触摸响应组件,不会改变视图UI,仅绑定press、longPress等事件;
TouchableOpacity:响应用户触摸操作,继承TouchableWithoutFeedback组件所有功能与属性,点击下降低视图透明度,可以绑定perss、longPress等事件;
TouchableHighlight:响应用户触摸操作,继承TouchableWithoutFeedback组件所有功能与属性,点击下背景变暗,可以添加press、longPress等事件绑定;
TouchableNativeFeedback:Android平台组件,继承TouchableWithoutFeedback组件所有功能与属性,同时可以设置background用于反馈触摸操作(形成波纹背景效果)
更多知识见原文:https://blog.csdn.net/Wbiokr/article/details/79167771

react-native---rn中的修饰组件(TouchableHightlight、TouchableOpacity、TouchableNativeFeedback等)的更多相关文章

  1. react native( rn) 中关于navigationOptions中headerRight 获取navigation的问题 rn

    使用以下代码获取navigation static navigationOptions = ({ navigation, navigationOptions }) => { const { pa ...

  2. React Native开发中自动打包脚本

    React Native开发中自动打包脚本 在日常的RN开发中,我们避免不了需要将我们编写的代码编译成安装包,然后生成二维码,供需要测试的人员扫描下载.但是对于非原生的开发人员来说,可能不知如何使用X ...

  3. RN中的常用组件-----图片

    1.RN中的常用组件-----图片 本地图片: <Image  source={require('../src/assets/x.jpg')}/> 本地图片可以无需指定尺寸(因为导入/打包 ...

  4. React Native之本地文件系统访问组件react-native-fs的介绍与使用

    React Native之本地文件系统访问组件react-native-fs的介绍与使用 一,需求分析 1,需要将图片保存到本地相册: 2,需要创建文件,并对其进行读写 删除操作. 二,简单介绍 re ...

  5. React Native工程中TSLint静态检查工具的探索之路

    建立的代码规范没人遵守,项目中遍地风格迥异的代码,你会不会抓狂? 通过测试用例的程序还会出现Bug,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...

  6. React Native 系列(九) -- Tab标签组件

    前言 本系列是基于React Native版本号0.44.3写的.很多的App都使用了Tab标签组件,例如QQ,微信等等,就是切换不同的选项,显示不同的内容.那么这篇文章将介绍RN中的Tab标签组件. ...

  7. React Native入门教程2 -- 基本组件使用及样式

    在上一篇文章中,我们学会了如何搭建React Native的环境(React Native入门教程(笔记) 1 – 开发环境搭建),不知道你们是否搭建好了呢,如果还没有,那么快动起小手,来体验RN带给 ...

  8. React native开发中常见的错误

    react native环境搭建请移步:react native环境搭建 这里说说react native创建完成之后,运行中出现的常见问题, 问题1: java.lang.RuntimeExcept ...

  9. 【React Native开发】React Native控件之Image组件解说与美团首页顶部效果实例(10)

    ),React Native技术交流4群(458982758),欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送! Im ...

  10. React Native填坑之旅--组件生命周期

    这次我们来填React Native生命周期的坑.这一点非常重要,需要有一个清晰的认识.如果你了解Android或者iOS的话,你会非常熟悉我们今天要说的的内容. 基本上一个React Native的 ...

随机推荐

  1. 在 Ubuntu14.04 上搭建 Spark 2.3.1(latest version)

    搭建最新的 Spark 2.3.1 . 首先需要下载最新版 jdk .目前 2.3.1 需要 8.0 及其以上 jdk 才可以允许. 所以如果你没有 8.0  jdk 安装好了之后会报错.不要尝试安装 ...

  2. video maker & video tutorials

    video maker & video tutorials 视频课程制作工具 https://ke.qq.com/agency/personal/intro.html 成为网络老师 https ...

  3. Appium之开发计算器自动化测试脚本Demo

    1.依赖包 <!-- https://mvnrepository.com/artifact/io.appium/java-client --> <dependency> < ...

  4. css3实现背景渐变

    #grad { background: -webkit-linear-gradient(left,rgba(255,0,0,0),rgba(255,0,0,1)); /* Safari 5.1 - 6 ...

  5. H5(仅仅是个地址)

    http://www.w3school.com.cn/html5/html_5_intro.asp (▼ヘ▼#)   怕你不看,我特地给你记个地址,应该不能再故意不看了吧   (▼ヘ▼#)

  6. 使用Spring的@Scheduled实现定时任务参数详解

    Spring配置文件xmlns加入 xmlns:task="http://www.springframework.org/schema/task" xsi:schemaLocati ...

  7. Spring 使用介绍(八)—— 零配置(一)

    一.概述 所谓零配置,并不是说一点配置都没有了,而是配置很少而已.通过约定来减少需要配置的数量,提高开发效率. 零配置实现主要有以下两种方式: 惯例优先原则:也称为约定大于配置(convention ...

  8. 未能写入输出文件“c:\Windows\Microsoft.NET\Framework64\v4.0.30319\Temporary ASP.NET Files\root\2da42acc\ab2935

    未能写入输出文件“c:\Windows\Microsoft.NET\Framework64\v4.0.30319\Temporary ASP.NET Files\root\2da42acc\ab293 ...

  9. 基于OpenCv和swing的图片/视频展示Java实现

    基于OpenCv和swing实现图片/视频的展示 图片的展示 swing展示图片,多为操作BufferedImage,这里要关注的核心是将Mat转为BufferedImage. 代码如下: publi ...

  10. js自动运行

    叹号后面跟函数!function 和加号后面跟函数+function 都是跟(function(){})();这个函数是一个意思,都是告诉浏览器自动运行这个匿名函数的