apiCloud中Frame框的操作,显示与隐藏Frame

简介:

Frame是一层一层的概念,

有的位于上层,有的位于下层。

1.加载菜单

2.加载页面层

3.首页拆分出内容层,这个时候内容层位于页面层的上方,当点击其他页面的时候,内容层遮挡住了他们

解决方案一

判断是否是首页,如果不是首页,则将内容层调整到页面层后方。

如果是首页,则将内容层调整到前方。

这种方案有个弊端,就是其它层下拉的时候,还能够看到内容层的残留。

解决方案二

通过设置Frame属性,将Frame进行隐藏和显示操作。这就完美了。

具体代码如下,

     var eFooterLis = $api.domAll('#footer .aui-bar-tab-item'),
            frames = []; // 选择所有匹配的DOM元素
        for (var i = 0,len = eFooterLis.length; i < len; i++) {
                // 判断是否登录
                var username = $api.getStorage('customer_id');
                var url = './html/frame'+i+'.html';
                if (i==4 && !username) {
                    url = './html/userLogin.html';
                }
                frames.push( { 
                    name: 'frame'+i, 
                    url: url,
                    bgColor : 'rgba(0,0,0,.2)',
                    bounces:true,
                    pageParam:{
                        'footer_height':$api.dom('footer').offsetHeight
                    },
                } )
        }

        api.openFrameGroup({ // 打开 frame 组
            name: 'group',
            scrollEnabled: false,
            rect: {
                x: 0,
                y: 0,
                w: api.winWidth,
                h: api.winHeight-$api.dom('footer').offsetHeight
            },
            index: 0, // 默认是首页
            frames: frames
        }, function (ret, err) {
            if (ret.index != '0') { // 不是首页
//                api.sendFrameToBack({ // 调整到后方
//                    from: 'frame0Con',
//                    to: ret.frameName
//                });

                api.setFrameAttr({ // 隐藏内容层
                    name: 'frame0Con',
                    hidden:true,
                });
            } else { // 是首页
//                api.bringFrameToFront({ // 调整到前方
//                    from: 'frame0Con',
//                    to: ret.frameName
//                });

                api.setFrameAttr({ // 显示内容层
                    name: 'frame0Con',
                    hidden:false,
                });
            }
        });


本文转自TBHacker博客园博客,原文链接:http://www.cnblogs.com/jiqing9006/p/5970419.html,如需转载请自行联系原作者

相关文章
|
2月前
Frame用于导航
Frame用于导航。
15 2
|
7月前
|
Python
update_frame 图象刷新
update_frame 图象刷新
48 4
|
移动开发 前端开发
h5 video以及img控件加上border显示不全的解决方案!
h5 video以及img控件加上border显示不全的解决方案!
292 0
VC中GDI+双缓冲实现Picture控件中显示png图片
VC中GDI+双缓冲实现Picture控件中显示png图片
233 0
|
存储
使用Dynamic Data Display控件绘图时无法删除已经画好的曲线
最近在使用Dynamic Data Display画图的时候发现,多次画图时,之前画的图无法清除,造成图像混乱。找了好久发现这样可以消除。 在调用AddLineGraph时,使用一个全局的变量来存储这个方法返回的对象(LineGraph), 点击...
924 0
SwiftUI—使用Image图像视图显示项目中的图片
SwiftUI—使用Image图像视图显示项目中的图片
649 0
SwiftUI—使用Image图像视图显示项目中的图片
|
Android开发
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)
313 0
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(二)
|
前端开发 Android开发
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(一)
【Android 应用开发】Paint 渲染 之 BitmapShader 位图渲染 ( 渲染流程 | CLAMP 拉伸最后像素 | REPEAT 重复绘制图片 | MIRROR 绘制反向图片 )(一)
429 0