RN 实战 & React Native 实战 https://abc.xgqfrms.xyz/react-native-docs/ 0.59 https://github.com/xgqfrms/react-native-docs/blob/master/docs/getting-started.md React Native Navigation React Native Navigation provides 100% native platform navigation on both…

React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发   2016/09/23 |  React Native技术文章 |  Sky丶清|  4 条评论 |  11232 views   尊重版权,未经授权不得转载 本文来自:画虎烂的专栏(http://blog.csdn.net/it_talk/article/details/52638456) (一)原生UI组件之VideoView视频播放器开发 React Native并没有给我们提供VideoView…

###React简介 RN是基于React设计,了解React有助于我们开发RN应用: React希望将功能分解化,让开发变得像搭积木一样,快速而且可维护 React主要有如下3个特点: *作为UI(Just the UI) *虚拟DOM(Virtual DOM) 这是亮点  是React最重要的一个特性  放进内存   最小更新的视图 差异部分更新 diff算法 *数据流(Date Flow)单向数据流 学习React需要掌握哪些知识? *JSX语法   类似XML *ES6相关知识 *前端基…

先说一下我为什么学习RN 18年3月29号,随着自己内心的欲望和冲动,任务交接了一下,正式离开一家医疗公司.第二天就入职了这之前已经找好的公司,由于自己对代码浓厚的热情,自己终于也不再带团队.正好有充足的时间去学习和研究技术! 公司没有iOS,总监要求后期打算用React Native开发,why? —— no why.是的,是时候去学习React Native 了! 技术背景 关于RN的背景,相信大家都知道了. React Native (简称RN)是Facebook于2015年4月开源的跨平…

flexbox是Flexible Box的缩写,弹性盒子布局  主流的浏览器都支持 flexbox布局是伸缩容器(container)和伸缩项目(item)组成 Flexbox布局的主体思想是元素可以改变大小以适应可用空间,当可用空间变大,Flex元素将伸展大小以填充可用空间,当Flex元素超出可用空间时将自动缩小.总之,Flex元素是可以让你的布局根据浏览器的大小变化进行自动伸缩. 按照伸缩流的方向布局 伸缩容器有主轴和交叉轴组成! 主轴既可以是水平轴,也可以是垂直轴 flexbox目前还处于…

###伸缩项目的属性 1.order 定义项目的排列顺序,数值越小,排列越靠前,默认值为0,语法为:order:整数值 2.flex-grow 定义伸缩项目的放大比例,默认值为0,即表示如果存在剩余空间,也不放大,语法为:flex-grow:整数值 3.flex-shrink 定义伸缩项目的收缩能力,默认值为1 ,其语法为:flex-shrink:整数值 4.flex-basis 用来设置伸缩项目的基准值,剩余的空间按比率进行伸缩,其语法为:flex-basis:length | auto,默认…

1.前言蘑菇街用打乱方向的图片作为验证码,既起到了验证码的作用又宣传了图片,今天我们就用React Native来实现这样的功能. 2.属性 Image标签属性resizeMode enum('cover', 'contain', 'stretch') cover: 在保持图片宽高比的前提下缩放图片,直到宽度和高度都大于等于容器视图的尺寸(如果容器有padding内衬的话,则相应减去).译注:这样图片完全覆盖甚至超出容器,容器中不留任何空白.contain: 在保持图片宽高比的前提下缩放图片,直…

1.前言今天介绍React Native来实现二维码扫描的功能.首先我们要借助第三方插件react-native-barcode-scanner-universal来实现跨平台二维码扫描. 2.介绍 react-native-barcode-scanner-universal react-native-barcode-scanner-universal是react-native-barcodescanner和react-native-camera的结合,react-native-barcodes…

1.前言 商品分类是各种app常见的一种操作,一般都是左右两栏构成,左边栏是商品的分类,右边栏是商品的展示,同时左右两栏都可以滑动.今天我们就用React Native来实现这种效果. 实现内容:1)分栏显示 2)左右两栏都可以上下滑动,联网操作后可以上拉下拉刷新,加载更多等一些操作. 3)分类栏(左边栏),选中后更改背景色:商品栏(右边栏) ,根据选中的分类,展示对应的商品. 2.属性 Dimensions: Dimensions.get('window').height; 获取当前屏幕的高度…

React是由ReactJS与React Native组成,其中ReactJS是Facebook开源的一个前端框架,React Native是ReactJS思想在native上的体现! JSX并不是一门新的语言,仅仅是个语法糖,允许开发者在JavaScript中书写HTML语法.,最后每个HTML标签都转化为JavaScript代码来运行 1.环境 2.载入方式 3.标签  HTML标签 与  ReactJS创建的组件类标签(首字母一定要大写) 4.转换 解析器 `<h3>输入</h3&…