UIWebBrowser

open

hide

show

close

setRect

setSelected

论坛示例

为帮助用户更好更快的使用插件，论坛维护了一个示例，示例中包含示例代码、知识点讲解、注意事项等，供您参考。

概述

UIWebBrowser 是一个可加载 html 文件的 webView。调用 open 接口相当于打开了一个 frame。开发者可通过相应的参数设置、更改、重置该 “frame” 的大小、位置。

注意

1、UIWebBrowser插件打开的页面不支持YonBuilder移动开发平台提供的api接口和插件类接口以及apiready接口

2、UIWebBrowser支持alert接口和console接口(ios不支持console)

open

打开插件

open({params}, callback(ret))

params

path：

  • 类型：字符串
  • 描述：打开的页面所加载的 html 文件路径，支持本地、网络协议（http://、fs://、widget://）

rect：

  • 类型：JSON 对象
  • 描述：（可选项）插件的位置及尺寸
  • 内部字段：
{
    x: 0,       //（可选项）数字类型；插件左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认：0
    y: 0,       //（可选项）数字类型；插件左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认：0
    w: 320,     //（可选项）数字类型；插件的宽度，支持auto；默认：所属 Window 或 Frame 的宽度
    h: 220      //（可选项）数字类型；插件的高度，支持auto；默认：w - 100
}

button：

  • 类型：JSON对象
  • 描述：（可选项）插件上的控制按钮配置，本参数可不传，若不传则不显示控制按钮
  • 内部字段：
{
      normal: '',         //字符串类型；按钮常态下的背景图标路径
      highlight: '',      //（可选项）字符串类型；按钮点击状态下的高亮背景图标路径，若不传则同 normal
      selected: '',       //（可选项）字符串类型；按钮点击后的背景图标路径，若不传则同 normal
      width: 40,          //（可选项）数字类型；按钮的宽；默认：50
      height: 20,         //（可选项）数字类型；按钮的高；默认：30
      position: 'bottom'  //（可选项）字符串类型；按钮的位置，取值范围如下：
                          // bottom：紧贴插件视图下边缘居中（左右方向）显示
                          // top：紧贴插件视图上边缘居中（左右方向）显示
}

fixedOn：

  • 类型：字符串类型
  • 描述：（可选项）插件视图添加到指定 frame 的名字（只指 frame，传 window 无效）
  • 默认：插件依附于当前 window

fixed:

  • 类型：布尔
  • 描述：（可选项）插件是否随所属 window 或 frame 滚动
  • 默认值：true（不随之滚动）

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    eventType: 'show',     //字符串类型；交互事件类型，取值范围如下：
                           // show：打开插件并显示在屏幕上
                           // click：点击按钮事件
    buttonState: 'selected'//字符串类型；按钮的点击状态，取值范围：selected（点击状态）、normal（未点击状态）
}

示例代码

var obj = api.require('UIWebBrowser');
obj.open({
    rect: {
        x: 0,
        y: 0,
        w: 320,
        h: 190
    },
    path: '../UIWebBrowser-con.html',
    fixedOn: api.frameName,
    fixed: true,
    button: {
        normal: 'widget://res/UIWebBrowser/normal.png',
        highlight: 'widget://res/UIWebBrowser/highlight.png',
        selected: 'widget://res/UIWebBrowser/selected.png',
        title: 'test',
        width: 55,
        height: 30,
        position: 'bottom'
    }
}, function(ret) {
    api.alert({
        msg: JSON.stringify(ret)
    });
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

hide

隐藏插件

hide()

示例代码

var UIWebBrowser = api.require('UIWebBrowser');
UIWebBrowser.hide();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

show

显示已隐藏的插件

show()

示例代码

var UIWebBrowser = api.require('UIWebBrowser');
UIWebBrowser.show();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

close

关闭插件

close()

示例代码

var UIWebBrowser = api.require('UIWebBrowser');
UIWebBrowser.close();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

setRect

重设插件的 rect

setRect({params})

params

rect：

  • 类型：JSON 对象
  • 描述：（可选项）插件的位置及尺寸
  • 内部字段：
{
    x: 0,       //（可选项）数字类型；插件左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认：原值
    y: 0,       //（可选项）数字类型；插件左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认：原值
    w: 320,     //（可选项）数字类型；插件的宽度；默认：原值
    h: 220      //（可选项）数字类型；插件的高度；默认：原值
}

animation：

  • 类型：布尔
  • 描述：（可选项）重设 rect 时，是否带动画效果
  • 默认：true

示例代码

var UIWebBrowser = api.require('UIWebBrowser');
UIWebBrowser.setRect({
    rect: {
        x: 0,
        y: 0,
        w: 320,
        h: 420
    },
    animation: true
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

setSelected

设置按钮选中/取消状态

setSelected({params})

params

selected：

  • 类型：布尔
  • 默认值：true
  • 描述：(可选项)是否要将指定索引的按钮设置为选中状态

示例代码

var UIWebBrowser = api.require('UIWebBrowser');
UIWebBrowser.setSelected({
    selected: true
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

论坛示例

为帮助用户更好更快的使用插件，论坛维护了一个示例，示例中包含示例代码、知识点讲解、注意事项等，供您参考。

是否仍需要帮助？ 请保持联络！
最后更新于 2024/04/24