uniapp开发App引导页

App的引导页是当用户第一次打开一款App时所展示的3-5精美的图片，用于告知用户产品的功能及特点。好的引导页会促使用户对产品增加更多的兴趣，当然这是UI设计的能力体现了，尽管很多人都会快速的滑过。对于开发人员怎么去添加这几张图片只有在用户第一次打开app时展示呢。

以uniapp开发的项目为例：在onLaunch函数中，检查flag是否为false，如果为false,则跳转到引导页面，在引导页中可设置跳转到首页。注意，最好用reLaunch，避免，用户物理按键返回；为true，则存储flag到本地。原理既是如此；但是实际开发时，会发现，存在闪屏现象，这样用户的体验就不太好，所以比较关键的地方就在于这块，还是以uniapp为例，需要在uniapp的源码视图下将splashscreen的设置进行修改，将autoclose改为false，在onLaunch中通过设置延迟时间调用plus.navigator.closeSplashscreen方法来关闭启动图。delay设置为0。这样启动图的设置就ok了。

以下封装了检查是否进入引导页的方法，仅供参考下：

Tip:在多次的应用中发现，如果在手机本身比较卡的情况下，用户在第一次开启app时，还是会存在首页在引导页之前出现，这种情况的处理方式是将引导页默认设置为主页，即在路由管理中，将引导页写在第一个，然后通过flag去判断是否跳转到首页；

以上的引导页开发只是提供一种思路，还有很多其他的方式，比如后端去控制是否展示引导页，引导页的动态变化。当然问题本身不难实现，关键在于实际应用时所存在的问题。

一、首先在app.js的onLaunch方法中获取到设备信息，根据设备信息判断设备屏幕下边是否有横杆并设置到全局变量。

二、在页面中获取到该变量，为true时就动态改变底部按钮高度，使按钮d起一定高度，从而实现横杠遮挡不了按钮

在开发中，会有一些判断是在小程序初始化的时候建立的，比如说个人信息同步，同步之后在进行其他页面的相应的 *** 作，查看官方文档发现这个；

看到这个的时候，豁哈，找到宝了，是不是可开心了；

但是！你高兴的太早了！！哈哈哈... （都是泪）

实际上进入小程序首页的时候有时候会先执行onlaunch方法，有时又会先执行首页的onload的方法，最后经过测试可以确定，在小程序中这两个方法并没有执行先后的顺序，因为他们都是异步执行的。（前人的教训）

在page页面判断一下当前app.globalData.employ是否有值，如果没有，说明是第一次调用，则定义一个（回调函数）

App页面在请求success后判断时候有Page页面定义的回调方法，如果有就执行该方法。

在首页里

这样就可以实现我们想要的顺序:

[App] onLaunch => [Page] onLoad => [App] onLaunch sucess callback

源码可见 github

---