带你从零学ReactNative开发跨平台App开发(六)
ReactNative跨平台开发系列教程:
今天早上九点起来撸码的,心情美滋滋。废话不多说,开始撸码,你准备好了吗?另外本系列文章的源码已经上传到github,请自行获取!
预加载|缓存
expo中提供了一个 AppLoading 的方法,你可以用它去干一些后台加载数据,缓存之类 的工作,当他没有缓存完成需要的资源时,你的screen是不会显示出来的,所以这个方法,我个人感觉总是那么的蹩脚。上个图说明一下:
在上图中屏幕会出现卡白的情况,什么原因呢?我让其在AppLoading ,app加载的时候干了一些加载资源的事情,右图是我模拟的加载资源,用的for循环,结果程序启动,他就会走apploading,干他里面的事情,所以应用程序就会卡白,显然这不是我们想要的,下面我们尝试一下splash,我可以用splash。
搞了我的笑了,splash在expo中配置文件配置一些就可以了,
如果这样的话,我就还是不满意,大家可以放肆的去用第三方了,甚至我自己洗的那一个也凑合。
这里推荐两个第三方,不一定是最好的但是是我找到的。
既然这里写到了splash,我也好好的回顾一些很久以前写到一篇文章:react native 第一次下载app的欢迎页+每次启动app的启动页设计 顺便在本项目中实现一下。
貌似有点小问题,上次我在原生混合模式里,往<Image> 组件里添加子组件没有报错,这次在expo里,他不让我这样操作,很是尴尬!
所以啊,我建议做splash就直接用第三方吧,简单粗暴省事!
这个splash我就不想提及了,下面说一下 Push Notifications,消息推送服务
Push Notifications|消息推送
简单的测试了一下他的推送api,说我没有注册,如图:
出现这个错误原因很正常,官方给出的是:
DeviceNotRegistered: the device cannot receive push notifications anymore and you should stop sendingmessages to the given Expo push token.
expo 消息推送不允许模拟器|仿真机测试,我用postman当然不行了,所以我们要改用真机,测试消息推送!
模拟器上推送依然报错:
换真机--今天就不吃瓜了,明天继续吃!我要体验大微软的跨平台去了!
这个项目我发布了一下:https://expo.io/@dongsheng/myappxde 可以在这里用expo扫码看一下,样式特别丑!
另外想说一下,expo现在最高版本是24.0.0
它和ReactNative版本对应:17.0.0→0.44| 18.0.0→0.45| 19.0.0→0.46| 20.0.0 →0.47| 21.0.0 →0.48| 22.0.0 →0.49| 23.0.0 →0.50| 24.0.0 →0.51
由此可以推出,expo是一个多么新的派生物种...
我的github地址 项目在这里找到!
后续文章持续更新,敬请期待!
文章为作者原创,转载请注明出处。
带你从零学ReactNative开发跨平台App开发(六)的更多相关文章
- 带你从零学ReactNative开发跨平台App开发(二)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(一)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发-[react native 仿boss直聘](十三)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(十一)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(十)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(九)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发[expo 打包发布](八)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(七)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(五)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
随机推荐
- Java之集合(十七)ConcurrentLinkedQueue
转载请注明源出处:http://www.cnblogs.com/lighten/p/7491057.html 1.前言 ConcurrentLinkedQueue是一个无界的线程安全队列,遵循FIFO ...
- 手风琴图片和钢琴导航栏JQ滑动特效
手风琴JQ滑动特效 1.效果预览: 2.相关代码: <!DOCTYPE html> <html lang="en"> <head> <me ...
- Android侧滑菜单和轮播图之滑动冲突
接手一个项目,有一个问题需要修改:轮播图不能手动滑动,手动滑动轮播图只会触发侧滑菜单. 猜测:viewpager控件(轮播图)的触摸事件被SlidingMenu控件(侧滑菜单,非第三方项目,乃是上个开 ...
- Mac下TensorFlow安装及环境搭建
在学习了一段时间台大李宏毅关于deep learning的课程,以及一些其他机器学习的书之后,终于打算开始动手进行一些实践了. 感觉保完研之后散养状态下,学习效率太低了,于是便想白天学习,晚上对白天学 ...
- MySQL数据库25条规范解读
一.基础规范 (1)必须使用UTF8字符集 解读:万国码,无需转码,无乱码风险,节省空间(由于移动设备原因最好使用utf8mb4) (2)禁止使用存储过程.视图.触发器.Event 解读:高并发大数据 ...
- OpenDaylight虚拟租户网络(VTN)详解及开发环境搭建
一.VTN简介及架构分析: 具体详见开发人员指南wiki:https://wiki.opendaylight.org/view/Release/Lithium/VTN/developer_Guid ...
- php的304方式
一般浏览器请求php是不会被缓存的,除非php直接显示的发送head 304 if(isset($_SERVER['HTTP_IF_MODIFIED_SINCE'])) { $browserCache ...
- SpringBoot入门 (五) 数据库访问之spring data jpa
本文记录学习使用spring data jpa访问数据库 一 什么是Spring Data JPA JPA(Java Persistence API)是Sun官方提出的Java持久化规范.它为Java ...
- MyEclipse设置选中单词其它同名单词前景色和背景色
General->Editors->Annotations->Occurrences
- MyEclipse中设置代码块快捷键
如果想用快捷键生成一段自定义代码,可以通过下面方式设置: Java->Editor->Templates->New 如果要设置或者更改某个快捷键,如要设置保存全部文档的快捷键(系统默 ...








