frameTree

来自于:开发者

openFrame closeFrame FrameTo setFrameAttr setFrameBind update

概述

frameTree增强了frame的控制能力,把窗口中的win和打开的frame当作树管理,win为树根节点,frame为父节点或子节点,逻辑关系如下图,这样能够方便的控制frame的后台预打开、层级显示、跟随父节点xy移动等等 frameTree - 图1

知识点:

1.一个win中只有一颗树

2.父节点不能改变,也就是说只能在同层中改变显示顺序,如F1只能提升到F2或者F3的前面,而不能把F21作为父节点

3.改变了显示顺序那么子节点也相应改变,如F1改到F3前面,那么F1下面的子节点也相应会移到前面显示

4.父节点的xy发生变化时,下面的所有子节点也会相应发生变化(在绑定情况下,默认绑定,可以解绑)

5.关闭一个父节点,下面的所有子节点都会关闭

6.只有用本模块的 openFrame 打开的 Frame 才会受到管理

7.可以在 win 或者任一 Frame 中用 api.require(‘frameTree’) 引用出来的对象对本窗口树管理,操作的都是窗口中唯一的一颗树结构

8.兼容api中同名函数的参数,并增加了一些参数

9.用 frameTree.openFrame 打开的 frame 可以像 api.openFrame 打开的一样操作,所有相关api都可使用

openFrame

打开 frame 并加入树管理

若frame已存在,表现和api.openFrame一样,但不会改变显示顺序,没写的参数和api.openFrame一样,参见//docs.apicloud.com/Client-API/api#27

openFrame({params})

params

name:

  • 类型:字符串
  • 默认值:无
  • 描述:frame 名字

url:

  • 类型:字符串
  • 默认值:无
  • 描述:页面地址,可以为本地文件路径,支持相对路径和绝对路径,以及 widget://、fs://等协议路径,也可以为远程地址

rect:

  • 类型:JSON 对象
  • 默认值:充满整个父页面
  • 描述:(可选项)frame 的位置和大小

fixedOn:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)父节点frame,如果不写或者””就是win,这样打开的frame就在第1层。想在当前frame打开子frame,可传递api.frameName

offsetX:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)绑定相对于父节点的x坐标,添加此参数将忽略rect中的x值

offsetY:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)绑定相对于父节点的y坐标,添加此参数将忽略rect中的y值

preload:

  • 类型:布尔
  • 默认值:false
  • 描述:(可选项)是否预加载,true会在同层级的底层打开,不会影响前面的frame,如果同层级还没有frame,那么即使true也会看到的
  • 出现这种情况的处理方案:如果快速打开多个同层frame,首先看到的frame不是你想看到的frame(出现闪屏),那么先只打开你想首先看到的frame,然后在这个frame里的apiready里面调用frameTree.openFrame加preload:true打开剩余的frame。

示例代码

  1. var frameT; //变量可以设置为全局,这样方便在任何地方调用,你不这样做也可以
  2. apiready = function(){
  3. frameT = api.require('frameTree');
  4. frameT.openFrame({
  5. name: 'f1',
  6. url: 'f1.html',
  7. rect:{w:200, h:200},
  8. offsetX:10,
  9. offsetY:60,
  10. preload:true
  11. });
  12. }

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

closeFrame

关闭 frame 并关闭所有子 frame

closeFrame({params})

params

和api.closeFrame一样,参见//docs.apicloud.com/Client-API/api#10

name:

  • 类型:字符串
  • 默认值:无
  • 描述:frame 名字

示例代码

  1. frameT.closeFrame({
  2. name: 'F1'
  3. });

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

FrameTo

在同层中移动显示顺序,子frame也会相应变动

FrameTo({params})

params

from:

  • 类型:字符串
  • 默认值:无
  • 描述:待调整显示顺序的 frame 名字

to:

  • 类型:字符串
  • 默认值:无
  • 描述:(可选项)frame 名字,不传时调整 from 对应 frame 到本层级的最高层,否则调整 from 对应 frame 到此 frame 前面,特殊参数”~frameTreeMin~”,调整 from 对应 frame 到本层级的最低层

示例代码

  1. frameT.FrameTo({
  2. from:'F1',
  3. to:'F2'
  4. });

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFrameAttr

设置 frame 属性,没写的参数和api.setFrameAttr一样,参见//docs.apicloud.com/Client-API/api#41

setFrameAttr({params})

params

name:

  • 类型:字符串
  • 默认值:无
  • 描述:frame 名字

rect:

  • 类型:JSON 对象
  • 默认值:充满整个父页面
  • 描述:(可选项)frame 的位置和大小

offsetX:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)绑定相对于父节点的x坐标,添加此参数将忽略rect中的x值

offsetY:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)绑定相对于父节点的y坐标,添加此参数将忽略rect中的y值

示例代码

  1. frameT.setFrameAttr({
  2. name:'F1',
  3. rect:{
  4. x:200, //会被忽略
  5. y:200 //会被忽略
  6. },
  7. offsetX:100,
  8. offsetY:100
  9. });

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFrameBind

设置 frame 的xy是否绑定到父节点,通过本模块openFrame的 frame 是默认绑定的

setFrameBind({params})

params

name:

  • 类型:字符串
  • 默认值:无
  • 描述:待调整绑定的 frame 名字

bindX:

  • 类型:布尔
  • 默认值:无
  • 描述:(可选项)是否绑定到父节点的x坐标,如true父节点的x变动时 name 对应 frame 的x也会相应变动,反之则反

bindY:

  • 类型:布尔
  • 默认值:无
  • 描述:(可选项)是否绑定到父节点的y坐标,如true父节点的y变动时 name 对应 frame 的y也会相应变动,反之则反

x:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)name 对应 frame 的x相对于窗口的坐标改变,这个只是修正了对象内部值,不会立即有所变化,而且也不影响子 frame ,这个只是用来配合frameTree.setFrameAttr时用

y:

  • 类型:数字
  • 默认值:无
  • 描述:(可选项)name 对应 frame 的y相对于窗口的坐标改变,这个只是修正了对象内部值,不会立即有所变化,而且也不影响子 frame ,这个只是用来配合frameTree.setFrameAttr时用

示例代码

  1. frameT.setFrameBind({
  2. name:'F1',
  3. bindX:false,
  4. bindY:false
  5. })

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

update

刷新树层级显示,一般不用调用这个函数,如果发现显示层次混乱了就调用一下。

update()

params

无参数

示例代码

  1. frameT.update();

补充说明

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本