混合开发的大趋势之一React Native之页面跳转(2)+物理返回+特定平台代码
转载请注明出处:这里写链接内容
今天是10月份的最后一天,我加了3个月来的第一个班,挤出了这篇。
废话不多先安利,然后继续学习 RN
有好东西都往里面丢,努力做好归纳
https://github.com/ddwhan0123/Useful-Open-Source-Android
demo还是在上次的ui,只是加了新功能,回退键!
效果图可以看http://blog.csdn.net/ddwhan0123/article/details/52913765
这边就不重复贴了
BackAndroid
理论介绍是api扣来的:
监听硬件的back键操作。如果没有任何监听函数,或者监听函数的返回值不是true,则会调用默认的back键功能来退出应用。
默认是退出应用
有三个常用的方法
static exitApp()
static addEventListener(eventName: BackPressEventName, handler:
Function) #static removeEventListener(eventName: BackPressEventName, handler:
Function)
看名字就很好理解,分别是
退出APP
增加监听事件
移除监听
exitApp很简单,直接调用即可
两个listener方法需要传入2个参数,1为”tag效果的BackPressEventName”,2为具体实现逻辑的方法。
这里为什么说是类似于tag的BackPressEventName可以看:http://www.jianshu.com/p/44e415a3cb0b 解释的非常棒,图文并茂
Platform
在制作跨平台的App时,多半会碰到针对不同平台编写不同代码的需求。
在不用分包的情况下 可以用Platform来做手机的判断,诸如我要判断是ios还是安卓
if (Platform.OS === 'android') {
//安卓的事
}
if (Platform.OS === 'ios') {
//ios的事
}
安卓还可以用Platform.Version来判断sdk等级
if(Platform.Version === 21){
console.log('Running on Lollipop!');
}
变化大多在main.android.js
import React, {Component, Navigator} from 'react';
import {
AppRegistry,
View,
StyleSheet,
Text,
BackAndroid,
Platform
} from 'react-native';
var titleStr;
var _navigator;
var name;
BackAndroid.addEventListener('hardwareBackPress', function() {
if (_navigator == null) {
return false;
}
if (_navigator.getCurrentRoutes().length === 1) {
return false;
}
if (Platform.OS === 'android') {
_navigator.pop();
}
return true;
});
export default class Main extends Component {
constructor(props) {
super(props);
_navigator = this.props.navigator;
titleStr = this.props.titleStr;
name = this.props.name;
}
render() {
return (
<View>
<Text>{titleStr}
页面 获得的参数: value = {name}</Text>
</View>
);
}
}
AppRegistry.registerComponent('Main', () => Main);
在这个页面我们设置的返回键的监听事件,然后判断了只在上一页有页面,并且导航不为空的时候才做返回行为,不然直接退出 app(默认)
这次我把navigator对象”带来带去”,让他很好的管理者,页面集合。
这篇内容比较简单,但是打好基础也很重要哦!!
源码地址:https://github.com/ddwhan0123/ReactNativeDemo (有点包结构问题,看着调就行,操作起来不复杂)
混合开发的大趋势之一React Native之页面跳转(2)+物理返回+特定平台代码的更多相关文章
- 混合开发的大趋势之一React Native之页面跳转
转载请注明出处:王亟亟的大牛之路 最近事情有点多,没有长时间地连贯学习,文章也停了一个多礼拜,愧疚,有时间还是继续学习,继续写! 还是先安利:https://github.com/ddwhan0123 ...
- 混合开发的大趋势之一React Native与Android联调
转载请注明出处:王亟亟的大牛之路 先安利,有空我都会更,看到的好东西都会放进来:https://github.com/ddwhan0123/Useful-Open-Source-Android 公司某 ...
- 混合开发的大趋势之一React Native之简单的登录界面
转载请注明出处:王亟亟的大牛之路 这些天都在学习RN这部分吧,然后写了个简单的登陆业务,从"实战"中讲解吧 还是继续安利:https://github.com/ddwhan0123 ...
- 混合开发的大趋势之一React Native手势行为那些事
转载请注明出处:王亟亟的大牛之路 最近项目部分模块重构,事情有点多,学习进度有所延缓,外加一直在吸毒(wow你懂的),导致好多天没发问了,其实这部分知识月头就想写了,一直没补. 话不多说先安利:htt ...
- 混合开发的大趋势之一React Native之Image (脑动理解)
文章是宝宝自己写的,你可以转走,标明哪来的就行王亟亟的大牛之路 国庆这些天要么旅游要么WOW,感觉整个人都废了.. 直接从黄种人晒成了非洲大酋长..然而还是无橙,这礼拜要做7天,昨天把单元测试的东西整 ...
- react native 之页面跳转
第一章 跳转的实现 1.component 中添加这行代码 <View style={styles.loginmain}> <Text style={styles.loginte ...
- 混合开发的大趋势之 一个Android程序员眼中的 React.js 块级作用域 和 let
转载请注明出处:王亟亟的大牛之路 最近都有事干然后,快到月底了这个月给CSDN的博文也就两篇,想想也蛮多天没更了,那就来一篇. 老规矩,先安利:https://github.com/ddwhan012 ...
- 混合开发的大趋势之 一个Android程序员眼中的 React.js 箭头函数,const, PropTypes
转载请注明出处:王亟亟的大牛之路 昨天写了篇React.js的开头之作,讲了讲块级作用域和let,先安利:https://github.com/ddwhan0123/Useful-Open-Sourc ...
- 移动开发发展方向-----Hybird混合开发3大方案
移动开发发展方向-----Hybird混合开发3大方案
随机推荐
- DELPHI中调用XSD去验证XML的合法性
procedure TFrmPrintReport.Button3Click(Sender: TObject);var SchemaDoc, XmlDoc: IXMLDOMDocument2; S ...
- SignalR循序渐进(二)泛型Hub
接上一篇,文章末尾抛出了2个问题: 能不能让客户端声明一个强类型的方法列表呢?这样首先不容易写错. 同样的,能不能让服务端声明一个强类型的方法列表给客户端调用呢? 如果要让客户端的方法以强类型出现在服 ...
- 记录一次gitlab->github企业版的迁移
cd到你想要存放新的工程的文件夹内, 1.使用git clone --mirror命令制作旧git的镜像 $ git clone --mirror git@git.aaaa.com:mario/my- ...
- intellij idea 主题更换(换黑底或白底)
更换主题: File-->setting-->Appearance&Behavior-->Appearance Intellij:白底黑字 Darcula:黑底白字
- UNIX或LINUX时间戳转时间
ORACLE: select TO_DATE('19700101', 'yyyymmdd') + 1481148929 / 86400 + TO_NUMBER(SUBSTR(TZ_OFFSET(ses ...
- 剑指Offer——二叉搜索树与双向链表
题目描述: 输入一棵二叉搜索树,将该二叉搜索树转换成一个排序的双向链表.要求不能创建任何新的结点,只能调整树中结点指针的指向. 分析: 二叉搜索树,中序遍历就是排序的. 所以我们利用中序遍历,将前后两 ...
- JAVA—List集合总结
List接口总结: List接口是Collection接口的子接口,从其名称可以看出,是一个元素有序(并不是按大小排序,具有顺序索引,类似于数组),默认按照元素的添加顺序设置元素的索引,List和Se ...
- html禁止选中文字
简单的办法,可以直接使用CSS: div { -moz-user-select:none; -webkit-user-select:none; user-select:none; } 嗯,就酱~
- 利用AES算法加密数据
准备工作: 模块安装问题: 首先在python中安装Crypto这个包 但是在安装模块后在使用过程中他会报错 下面是解决方法: pip3 install pycrypto 安装会报错 https:// ...
- View的几个坐标的问题 ,涉及到动画
event.getX():表示的是触摸的点距离自身左边界的距离 event.getY():表示的是触摸的点距离自身上边界的距离 event.getRawX:表示的是触摸点距离屏幕左边界的距离 eve ...