在RN学习中,按照一本书中案例书写TextInput框, 书中给了两种写法 写法1: <TextInput style={styles.pswInputStyle} placeholder='请输入密码' password={true} onChangeText={(newText) => this.updatePws(newText)} /> 写法2: <TextInput style={styles.pswInputStyle} placeholder='请输入密码' pass…

终于,终于,可以总结自己使用RN时的分享功能了-- 为什么呢?且听我慢慢道来吧: 从刚开始接触React Native(2017年9月中旬)就着手于分享功能,直到自己参与公司的rn项目开发中,再到现在几乎"竣工"的过程中,这一路的"艰辛"估计也只有自己能体会到了吧.其实自己并不喜欢抱怨,也不喜欢把负能量带给身边的朋友,因此在遇到问题后,都是竭尽全力的攻克它,也许会"废寝忘食",也许是"徒劳无功",即使中间道路实在太曲折,但庆幸…

上篇博客我们聊了RN中关于Timing的动画,详情请参见于<ReactNative之结合具体示例来看RN中的的Timing动画>本篇博客我们将从一个“拉皮条”的一个动画说起,然后来看一下RN中Spring动画的使用方式以及具体效果.Spring从名字中不难看出是弹性弹簧的意思,也就是我们可以使用Spring这个动画来实现一些弹性的动画效果.本部分我们先通过一个“拉皮条”的示例来简单的看一下Spring动画的使用方式,然后在看一下Spring动画中可配置的属性以及每个属性的作用. 一.从“拉皮条…

今天继续更新RN相关的博客.上篇博客详细的聊了RN中关于Flex布局的相关东西,具体请参见<ReactNative之参照具体示例来看RN中的FlexBox布局>.本篇博客继续更新RN的动画部分,博客中的内容依然是依托于具体的示例来进行的. 下方是官网对RN动画的的一个综述,意思就是说在RN的组件中View.Text.Image 和ScrollView是支持动画的,不过你可以使用Animated.createAnimatedComponent()这个方法来创建一个支持动画的组件稍后会介绍到.这些…

今天是重阳节,祝大家节日快乐,今天继续更新RN相关的博客.上篇博客<ReactNative之从HelloWorld中看环境搭建.组件封装.Props及State>中我们通过一个HelloWorld的一个示例介绍了RN的环境搭建.组件封装.Props以及States.经过这么多天,今天我们继续来看RN的东西,本篇博客是关于RN的Flex布局的,也就是说是关于RN中控件放哪儿的一篇博客.在RN中使用的是Flex布局,如果你之前接触过Web前端的话对FlexBox布局并不陌生,但是如果你之前没做过W…

1.RN中的常用组件-----图片 本地图片: <Image  source={require('../src/assets/x.jpg')}/> 本地图片可以无需指定尺寸(因为导入/打包在服务器端进行),默认是原始尺寸;如果指定了width,height不会自动的修改, 也必须手工赋值. 远程图片:<Image  source={ {uri:'http://t.cn/logo.png'} }  style={{width:x,height:x }}/> 注意:Image的sour…

在日常的开发中,时常需要去获取应用的一权限 比如查看通讯录/打开摄像机等 1:ios  iOS 的权限管理在info.plist里设置 info.plist主要是管理了app 的一些信息文件,比如版本啊 权限等 这里主要是设置了应用的http的访问权限 2:android 安卓的权限在RN中有PermissionsAndroid 这个API ,权限主要是设置在androidmainfest.mxl 文件中进行注册, 这个API主要是分为2步,第一步是检测是否权限已经有了,如果没有就申请权限 Pe…

在原生的开发中,如果要自定义一些控件,可能会用到touch的相关方法,而React Native也有一套touch机制,说白了就是用JS写了一套方法打通android和ios平台,这里简单讲解下React Native(RN)的touch机制,这里先不过多深入研究,先熟悉下流程,至于RN的touch分发机制之后再详细讲解. PanResponder:可以将多点触摸操作协调成一个手势.它使得一个单点触摸可以接受更多的触摸操作,也可以用于识别简单的多点触摸手势. 下面来看下如何创建: compone…

1. ListView dataSource 介绍: ListView需要指定数据的来源.传入数据必须是数组,或者是字典里面嵌套数组 系统会根据你传入的数据自动生成section和row 每一个字典的key会被ListView拆分成一个section(小节,这里的section和原生的一样),如果你不指定sectionId,则key就是sectionId 如何使用. 在构造函数中指定ListView的取值策略,先new一个dataSource对象 constructor(props) { sup…

我们在做移动端项目和手机APP应用时,避免不了要获取用户手机的网络状况.在使用RN技术开发APP时,其内置的NetInfo API就是为了解决这一问题的.下面简单的讲下NetInfo如何使用. 最新的API与以往的有些不同,具体如下: - `fetch`方法过时了,用`getConnection`替代 - `change`事件过时了,用`connectionchange`替代. - `fetch`/`change`过时了,用`getConnection`/`connectionchange`替代…