react-native 学习 ----- React Navigation
很久没有的登陆博客园了,密码都是找回的,从当年的大学生已经正常的走上了程序员的道路,看到之前发的博客还是写的android,现在自己已经在使用了react-native了。
大学毕业了,做了java后台台发,就再也没有写过移动端的东西了,知道rn的出现,发现这个比当年的web app phonegap好用多了就此一发不可收拾。公司app就是用的rn,我主要还是负责数据在store中的处理,框架也是公司大牛封装的,但是我心中总有一个移动端的梦想,所以我准备开始从零开始学习react-native。
这边呢我主要讲一下rn的导航器React Navigation,现在rn的版本时0.45,原来react-native的导航器已经换了地方,rn官网主推React Navigation,如何使用呢?
npm install --save react-navigation
这样就好了。里面主要有三个组件
StackNavigator
看到名字就知道他是栈一样的形式,一个页面盖一个页面,这让我想到android的activity,返回也是一层一层的返回
TabNavigator
这个就是tab,多选项标签,可以切换,组件里面自带原生的动画,自定义样式,个人感觉还是蛮强的
DrawerNavigator
这个就是抽屉,可以从屏幕边拖拽出一个抽屉,现在比较流行的样式
备注:
这边呢我就不贴代码了,一些demo代码在官方的文档上面都有,我也就不复制了,这边我正在学习的github地址在这边,这三个组件我用在了一个app里面,各个地方我也写了代码中文的哦
这里面的了内容也会经常更新,spring boot的后台接口也在准备开发中,后面会把redux框架融入进来,一些微信分享,登陆,还有一些第三方的插件我都会使用到,大家可以一起学习嘛、
git地址:
https://github.com/Radicalpro/AboutBall
喜欢的也可以follow和star那就太感谢啦~
react-native 学习 ----- React Navigation的更多相关文章
- React Native 学习-01
React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...
- react native 学习一(环境搭配和常见错误的解决)
react native 学习一(环境搭配) 首页,按照http://reactnative.cn/docs/0.30/getting-started.html#content上的介绍,下载安装pyt ...
- React Native 学习资料
React Native 学习资料 学习资料 网址 React Native中文网 https://reactnative.cn/
- React Native 学习(三)之 FlexBox 布局
React Native 学习(三)之 FlexBox 布局
- React Native 学习笔记--进阶(二)--动画
React Native 进阶(二)–动画 动画 流畅.有意义的动画对于移动应用用户体验来说是非常必要的.我们可以联合使用两个互补的系统:用于全局的布局动画LayoutAnimation,和用于创建更 ...
- 【React Native】React Native项目设计与知识点分享
闲暇之余,写了一个React Native的demo,可以作为大家的入门学习参考. GitHub:https://github.com/xujianfu/ElmApp.git GitHub:https ...
- React Native之React速学教程(下)
概述 本篇为<React Native之React速学教程>的最后一篇.本篇将带着大家一起认识ES6,学习在开发中常用的一些ES6的新特性,以及ES6与ES5的区别,解决大家在学习Reac ...
- React Native之React速学教程(中)
概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...
- React Native之React速学教程(上)
概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...
- React Native & react-native-web-player & React Native for Web
React Native & react-native-web-player & React Native for Web https://github.com/dabbott/rea ...
随机推荐
- JavaScript知识点整理 (二)
1)函数概述 1.函数是一块 JS 代码,被定义一次,但可以执行和调用多次. JS 中的函数也是对象,所以 JS 函数可以像其它对象那样操作和传递,所以也常叫 JS 中的函数为函数对象. 2.函数也是 ...
- 介绍几个python的音频处理库
一.eyeD3 直接在google上搜索python mp3 process ,推荐比较多的就是这个第三方库了.先来看看官方介绍吧. About eyeD3 is a Python tool for ...
- [笔记]ACM笔记 - 组合数
一.高中数学公式复习 , (好吧这个没学过但是既然看到了就一并抄过来了) 二.快速求组合数取模C(n, m)%p 当n和p大小不同时方法有不同. 1. n很小,p随意,p不需要为素数 1) 原理 使用 ...
- ShadowBroker释放的NSA工具中Esteemaudit漏洞复现过程
没有时间测试呢,朋友们都成功复现,放上网盘地址:https://github.com/x0rz/EQGRP 近日臭名昭著的方程式组织工具包再次被公开,TheShadowBrokers在steemit. ...
- Linux防火墙的关闭和开启
1) 重启后生效 开启: chkconfig iptables on 关闭: chkconfig iptables off 2) 即时生效,重启后失效 开启: service iptables sta ...
- DelayQueue的原理和使用浅谈
在谈到DelayQueue的使用和原理的时候,我们首先介绍一下DelayQueue,DelayQueue是一个无界阻塞队列,只有在延迟期满时才能从中提取元素.该队列的头部是延迟期满后保存时间最长的De ...
- 浏览器播放rtsp流媒体解决方案
老板提了一个需求,想让网页上播放景区监控的画面,估计是想让游客达到未临其地,已知其境的状态吧. 说这个之前,还是先说一下什么是rtsp协议吧. RTSP(Real Time Streaming ...
- <<、>>、>>>移位操作
<<,有符号左移位,将运算数的二进制整体左移指定位数,低位用0补齐. int leftShift = 10; System.out.println("十进制:" + l ...
- vim 和grep 正则表达式相似和区别
正则表达式由两种基本字符类型组成:原义(正常)文本字符和元字符.元字符使正则表达式具有处理能力.所谓元字符就是指那些在正则表达式中具有特殊意义的专用字符,可以用来规定其前导字符(即位于元字符前面的字符 ...
- java虚拟机学习-JVM内存管理:深入Java内存区域与OOM(3)
概述 Java与C++之间有一堵由内存动态分配和垃圾收集技术所围成的高墙,墙外面的人想进去,墙里面的人却想出来. 对于从事C.C++程序开发的开发人员来说,在内存管理领域,他们即是拥有最高权力的皇帝又 ...