openFrame

打开 frame

若 frame 已存在，则会把该窗口显示到最前面并显示，如果 url 和之前的 url 有变化，或者 reload 为 true 时，页面会刷新

此方法对 frameGroup 里面的 frame 不起作用

openFrame({params})

params

name：

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

url：

  • 类型：字符串
  • 默认值：无
  • 描述：页面地址，可以为本地文件路径，支持相对路径和绝对路径，以及 widget://、fs://等协议路径，也可以为远程地址。 当data参数不为空时，url将做为baseUrl，data中的html引用的资源文件根路径以该url为基础。

data：

  • 类型：字符串
  • 默认值：无
  • 描述：（可选项）页面加载的数据内容，可以为html片段或者整张html文件的数据

headers：

  • 类型：JSON 对象
  • 默认值：无
  • 描述：（可选项）请求头

useWKWebView：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）是否使用WKWebView来加载页面。参考WKWebView介绍。

historyGestureEnabled：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）是否可以通过手势来进行历史记录前进后退，只在useWKWebView参数为true时有效。

syncCookie：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）是否自动同步WKWebView外部如ajax产生的Cookie到WKWebView中，只在useWKWebView参数为true时有效。

pageParam：

  • 类型：JSON 对象
  • 默认值：无
  • 描述：（可选项）页面参数，在新页面通过 api.pageParam 获取

bounces：

  • 类型：布尔
  • 默认值：若在 config.xml 里面配置了 pageBounce，则默认值为配置的值，否则为 true
  • 描述：（可选项）页面是否弹动。注意如果页面使用了上拉、下拉刷新等功能，该属性可能会被刷新组件重新设置。

bgColor：

  • 类型：字符串
  • 默认值：若在 config.xml 里面配置了 frameBackgroundColor，则默认值为配置的值，否则透明
  • 描述：（可选项）背景色，支持图片和颜色，格式为#fff、#ffffff、rgba(r,g,b,a)等，图片路径支持fs://、widget://等 APICloud 自定义文件路径协议，同时支持相对路径

scrollToTop：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）当点击状态栏，页面是否滚动到顶部。若当前屏幕上不止一个页面的 scrollToTop 属性为 true，则所有的都不会起作用。只iOS有效

scrollEnabled：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）页面内容超出后是否可以滚动，只支持iOS

vScrollBarEnabled：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）是否显示垂直滚动条

hScrollBarEnabled：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）是否显示水平滚动条

scaleEnabled：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）页面是否可以缩放

fixedOn：

  • 类型：字符串
  • 默认值：若当前在tabLayout组件中为ui_layout，否则为ui_window
  • 描述：（可选项）frame所要添加到的目标页面。
  • 取值范围：
  1. ui_window    //页面添加到当前window中。若当前在tabLayout组件中，页面只能添加到navigationBar和tabBar之间的区域，无法覆盖在navigationBar、tabBar之上。
  2. ui_layout    //页面添加到当前tabLayout中。此时页面能够添加到tabLayout中任意位置，能够覆盖在navigationBar、tabBar之上，只在tabLayout组件中有效。

rect：

  • 类型：JSON 对象
  • 默认值：充满整个父页面
  • 描述：（可选项）设置页面的位置和大小。如果要固定宽高则使用x、y、w、h等参数；如果要自适应状态栏高度变化、横竖屏切换等，则需要使用margin相关参数，不能使用w、h固定宽高。推荐使用margin相关参数来布局。
  • 内部字段：
  1. {
  2.     x:,             //左上角x坐标，数字类型
  3.     y:,             //左上角y坐标，数字类型
  4.     w:,             //宽度，若传'auto'，页面从x位置开始自动充满父页面宽度，数字或固定值'auto'
  5.     h:,             //高度，若传'auto'，页面从y位置开始自动充满父页面高度，数字或固定值'auto'
  7.     marginLeft:,    //相对父页面左外边距的距离，数字类型
  8.     marginTop:,     //相对父页面上外边距的距离，数字类型
  9.     marginBottom:,  //相对父页面下外边距的距离，数字类型
  10.     marginRight:    //相对父页面右外边距的距离，数字类型
  11. }

progress：

  • 类型：JSON 对象
  • 默认值：无
  • 描述：（可选项）页面加载进度配置信息，若不传则无加载进度效果
  • 内部字段：
  1. {
  2.     type:            //加载进度效果类型，默认值为 default，取值范围为 default|page，为 page 时，进度效果为仿浏览器类型，固定在页面的顶部
  3.     title:           //type 为 default 时显示的加载框标题，字符串类型
  4.     text:            //type 为 default 时显示的加载框内容，字符串类型
  5.     color:           //type 为 page 时进度条的颜色，默认值为 #45C01A，支持#FFF，#FFFFFF，rgb(255,255,255)，rgba(255,255,255,1.0)等格式
  6.     height:          //type 为 page 时进度条高度，默认值为3，数字类型
  7. }

reload：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）页面已经打开时，是否重新加载页面

allowEdit：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）是否允许长按页面时弹出选择菜单

softInputMode：

  • 类型：字符串
  • 默认值：auto
  • 描述：（可选项）当键盘弹出时，输入框被盖住时，当前页面的调整方式,只iOS有效，Android请在 config.xml 里面配置并云编译使用

softInputDismissMode：

  • 类型：字符串数组
  • 默认值：[‘tap’]
  • 描述：（可选项）收起键盘的方式，只iOS有效。
  • 取值范围：
  1. tap              //点击页面收起键盘，可以和drag或interactive同时使用
  2. drag             //拖拽页面时收起键盘，可以和tap同时使用
  3. interactive      //在键盘和页面交界处上下滑动收起键盘，可以和tap同时使用

softInputBarEnabled：

  • 类型：布尔
  • 默认值：true
  • 描述：（可选项）是否显示键盘上方的工具条。只支持iOS

overScrollMode:

  • 类型：字符串
  • 默认值：never
  • 描述：（可选项）设置页面滚动到头部或尾部时，显示回弹阴影效果的模式，仅Android有效。
  • 取值范围：
  1. never            //永远不显示
  2. always           //总是显示
  3. scrolls          //只有当页面内容超出设备屏幕大小，发生滚动行为时显示，建议设置为该模式。

dragAndDrop：

  • 类型：布尔
  • 默认值：false
  • 描述：（可选项）是否允许iOS 11及以上系统中页面元素默认的拖拽行为。只支持iOS

animation：

  • 类型：JSON 对象
  • 默认值：无
  • 描述：（可选项）动画参数，不传时无动画
  • 内部字段：
  1. {
  2.     type:"none",                //动画类型（详见动画类型常量）
  3.     subType:"from_right",       //动画子类型（详见动画子类型常量）
  4.     duration:300                //动画过渡时间，默认300毫秒
  5. }
  7. type 取值范围：
  9. none            //无动画效果
  10. push            //新视图将旧视图推开
  11. movein          //新视图移到旧视图上面
  12. fade            //交叉淡化过渡（不支持过渡方向）
  13. flip            //翻转效果
  14. reveal          //将旧视图移开,显示下面的新视图
  15. ripple          //滴水效果（不支持过渡方向）
  16. curl            //向上翻一页
  17. un_curl         //向下翻一页
  18. suck            //收缩效果（不支持过渡方向）
  19. cube            //立方体翻滚效果
  21. subType 取值范围：
  23. from_right      //从右边开始动画
  24. from_left       //从左边开始动画
  25. from_top        //从顶部开始动画
  26. from_bottom     //从底部开始动画

defaultRefreshHeader：

  • 类型：字符串
  • 默认值：pull
  • 描述：（可选项）设置使用默认下拉刷新类型，取值范围：pull、swipe

customRefreshHeader：

  • 类型：字符串
  • 默认值：无
  • 描述：（可选项）设置使用自定义下拉刷新模块的名称，设置后可以使用 api.setCustomRefreshHeaderInfo 方法来使用自定义下拉刷新组件

示例代码

  1. api.openFrame({
  2.     name: 'page2',
  3.     url: './page2.html',
  4.     rect: {
  5.         x: 0,
  6.         y: 0,
  7.         w: 'auto',
  8.         h: 'auto'
  9.     },
  10.     pageParam: {
  11.         name: 'test'
  12.     }
  13. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本