ionic1开发之APP引导页面

2018-03-17  本文已影响0人  hhjjj1010

前言:

写这篇文章的主要目的不是为了讲如何实现APP引导页面的界面。
主要是要讲在ionic1的APP中怎样控制引导页面出现的时机!

界面实现

对于APP引导页面,一般常规的操作都是用ion-slide-box或者ion-slides来实现。
这一点并没有太多可讲的内容,直接略过。

时机把握

APP引导页面的最大的功能就是提前告诉用户,某个版本更新的时候在我们的APP中发生了哪些比较值得注意的事情。

但是并不是每个版本更新的内容都需要告诉用户,因为有的时候我们更新的仅仅只是一些bug的修复或者一些小的用户体验的优化。
既然是要吸引用户的注意力,要提前告诉用户,那么引导页面就应该在第一时间出现在用户的眼前。

不是每个版本更新都会出现引导页面

到代码层面实现的思路其实很简单,给引导页面加一个版本号即可。
在缓存(一般用localStorage)里面加入一个缓存的版本号,然后再在代码里面加入一个当前需要更新的版本号即可。

首先判断缓存版本号有没有值,如果没有值那肯定是要显示引导页面的的。
如果缓存版本号有值,并且缓存版本号的值比当前版本号要小,那么也是要显示引导页面的。
显示引导页面的时候,需要用当前版本号去覆盖缓存版本号。

引导页面应该在所有页面出现之前出现

一开始的时候,把跳转引导页面的代码加在首页上,当首页开始加载的时候就进行判断是否需要跳转。
得到的结果是会先看到首页,然后再跳转到引导页面,页面出现的顺序不对。

然后经过多方查找发现,正确的姿势是把相关的代码放到app.js中的.run模块里面去。
.run(['$ionicPlatform', '$state'], function('$ionicPlatform', '$state'){

  shouldShowAppGuidePage ? $state.go('AppGuidePage') : $state.go('HomePage')
})

最后的建议

  1. APP引导页面虽好,但不要过度使用;
  2. APP引导页面上的大图片建议放在项目中,不建议放在服务器上。
上一篇下一篇

猜你喜欢

热点阅读