引导页优雅效果实现

yanxlg

Apicloud提供了FrameGroup可以实现类似引导界面的功能，但是如果想要fixed在视图上的索引条（点）的话就会出现一些小问题，在Android上回出现FrameGroup 显示后很久才会显示另一个表示索引条的Frame，尽管设置了Timeout，但是仍然不起作用，而且跨多个视图来实现引导页功能涉及到视图交互，虽然AC交互机制很强大，但是任然繁琐，而且FrameGroup消耗资源比较多，这里使用swipe.js来实现纯H5的引导页，源码和App附上：
体验接近原生

mlken

手残支持一下~感谢分享

t10378

今天來得正是時候~謝謝分享

白貂

导入不到apicloud studio啊

lins

apiready = function(){
   api.getPrefs({
            key: 'splash'
        }, function(ret, err){
            var v = ret.value;
            if(v!="true"){
                api.openFrame({
                    name: 'name',
                    url: './guide.html',
                    bounces: false,
                    rect: {
                        x: 0,
                        y: 25,
                        w: 'auto',
                        h: 'auto'
                    },
                    bgColor:"./image/image/bg.jpg"
                });
                api.setPrefs({
                    key: 'splash',
                    value: 'true'
                });
            }
            setTimeout(function(){
                api.removeLaunchView({
                    animation:{
                        type:'fade',
                        duration:500
                    }
                });
            },1000)
            var first = null;
            $.splashBool=false;
            api.addEventListener({
                name: 'keyback'
            }, function (ret, err) {
                if($.splashBool||v=="true"){
                    if (!first) {
                        first = new Date().getTime();
                        api.toast({
                            msg: '再按一次退出TCloud',
                            duration: 1000,
                            location: 'bottom'
                        });
                        setTimeout(function() {
                            first = null;
                        }, 1000);
                    } else {
                        if (new Date().getTime() - first < 1000) {
                            api.closeWidget({
                                id: 'A0000002200001',
                            });
                        }
                    }
                }
            });
        });
        api.openSlidLayout({
                leftEdge:80,
                type:'left',
                fixedPane:{
                    name: 'homeFixed',
                    url: './html/homeFixed.html'
                },
                slidPane:{
                    name: 'homeSlide',
                    url: './html/homeSlide.html'
                }
            }, function(ret) {
                /* 暂时不需要做任何事. */

            }
        );


这样子放对吗？ 闪一下就进入主页了。。。

xupeng

谢谢分享哦，应该贴一些图或者二维码更好

popliu

感谢分享

王心诚

这个不错，顶一个！

liuxw

谢谢分享

智慧学者

赶紧试试