当前文档:《 Sprite API手册 我要修改这篇文章

x5webview组件使用


x5webview集成了腾讯X5内核,用于屏蔽Android原生webview系统差异性,关于腾讯X5引擎介绍见https://x5.tencent.com/tbs/guide/sdkInit.html,仅Android支持。

X5引擎采用动态加载机制,即只有当设备和网络环境满足X5引擎的加载要求时,才会使用X5引擎,若加载失败或者加载异常则自动切换至系统webview,下面描述下X5内核启用流程。

1:如果手机上未安装微信,手Q或者QQ浏览器,接入X5应用会自己去下载X5内核,并在应用重启后启用;

2:如果手机上安装了手Q或者微信或者浏览器,则会去寻找共享的X5内核,而不会自己下载新X5内核;

3:如果手Q或者微信没打开过网页,则内核还是不会启用,需要先手动点开网页;

4:如果应用依赖的是手Q的内核,在手Q被卸载之后,应用会去寻找其他共享X5内核,走第2步;

辨别是否使用x5webview的方法,显示网页文字时,可通过长按选择文字的标识判断,如下水滴状选择效果是x5webview的标志,如下图所示。

x5webview为外置组件。

属性

公共属性

参见公共属性章节,包括:id、style、class;

url

浏览器控件需加载页面地址

支持本地页面方式加载(res: , file:),也支持网络页面方式加载(http://)

bridge

是否注入桥接Api

注入后可在浏览器中使用本地能力Js函数,[true,false]

true:注入桥接Api

false:不注入(默认)

zoom

浏览器加载页面是否支持缩放

取值 [true,false ]

true:支持缩放

false:不支持缩放(默认)

checkSsl

访问https网站时是否校验ssl证书

取值 [true,false]

true:校验ssl证书 (默认)

false:不校验ssl证书

注: 仅Android支持,iOS固定校验ssl证书

progress

网络url加载时顶部进度条是否显示

取值 [true,false]

tue:网络url加载时显示顶部进度条(默认)

false:网络url加载时不显示顶部进度条

样式

公共样式

参见公共样式章节,包括:

尺寸

定位

外边距

flexbox布局:align-self,flex

progress-color

进度条颜色

默认值:#00bf12

事件

plusready

页面加载完成后触发

event事件对象包括:

type:事件类型,字符串类型,固定值:plusready

target:触发事件的目标组件,dom对象

timestamp:事件触发的时间戳,单位毫秒,数字类型

failed

页面加载失败后触发

event事件对象包括:

type:事件类型,字符串类型,固定值:failed

target:触发事件的目标组件,dom对象

timestamp:事件触发的时间戳,单位毫秒,数字类型

titleChange

x5webview页面加载url,若标题更新则触发回调函数

event事件对象包括:

type:事件类型,字符串类型,固定值:titleChange

target:触发事件的目标组件,dom对象

timestamp:事件触发的时间戳,单位毫秒,数字类型

param对象为Json对象,定义如下:

title:当前页面标题,字符串类型

url:当前页面url,字符串类型

js方法

本节目录:

公共方法

executeScript(scriptText:string): void 执行x5webview控件加载html页面js脚本

clearCache(): void 清理x5webview浏览器缓存

canBack(): boolean 基于已打开html页面是否支持回退

back(): void 基于已打开html页面回退

canForward(): boolean 基于已打开html页面是否支持前进

forward (): void 基于已打开html页面前进

公共方法

事件相关,包括:

on(messageName:string,callback:Function): void 组件注册事件的触发函数

fire(messageName:string,params:Array<any>): void 组件事件的触发函数

off(messageName:string,callback:Function): void 组件移除事件的触发函数

getOn(messageName:string): Array<Function> 获取已绑定的事件的触发函数

动画相关,包括:

startAnimation(jsonData:Object,callback:Function): void 启动UI组件动画

startAnimator(jsonData:Object,callback:Function): void 启动UI组件属性动画

startKeyFrameAnimator(jsonData:Object,callback:Function): void 启动UI组件关键帧动画

releaseAnimator(): void 结束控件动画

尺寸和位置,包括:

getFrame(): Object 获取组件在父容器中的位置

setFrame(frame:Object): void 设置组件在父容器中的位置

getCenter(): Object 获取组件中心点在父容器中的位置

getAbsoluteFrame(): Object 获取组件在绘制窗口中的位置

普通Dom节点操作,包括:

getParent(): IElement 获取父节点

getNext(): IElement 获取同级下一个节点

getPrevious(): IElement 获取同级前一个节点

remove(): void 从父容器中移除自身

clone(isDeep:boolean):IElement 对当前Dom节点进行克隆

setAttr(attrName:string,attrValue:string): void 设置节点属性

getAttr(attrName:string):string 获取节点属性值

getAttrs(): Object 获取节点所有属性

removeAttr(attrName:string): void 移除节点属性

hasAttr(attrName:string): boolean 节点是否具有该属性

setStyle(styleName:string,styleValue:string): void 设置节点样式值

getStyle(styleName:string):string 获取节点样式值

clearStyle(styleName:string): void 移除节点样式值

setClassStyle(className:string,domobj:IElement): void 设置节点对应Class样式

getClassStyle(): string 获取节点已设置Class样式

getTag(): string 获取UI组件类型

getId(): string 获取UI组件Id标识

executeScript(scriptText:string): void

执行x5webview控件加载html页面js脚本

参数:

scriptText:需要执行x5webview控件内(page内)脚本方法,必选项,支持传递字符串类型变量

返回值:无

clearCache(): void

清理x5webview浏览器缓存

参数:无

返回值:无

canBack(): boolean

基于已打开html页面是否支持回退

参数:无

返回值:bool型

true:支持回退

false:不支持回退

back(): void

基于已打开html页面回退

参数:无

返回值:无

canForward(): boolean

基于已打开html页面是否支持前进

参数:无

返回值:bool型

true:支持前进

false:不支持前进

forward (): void

基于已打开html页面前进

参数:无

返回值:无

内置对象

内置NativePage对象用于实现x5webview内调用外部uixml页面JS。

executeScript(scriptText:string):void

x5webview控件内部调用外部uixml页面JS

参数:

scriptText:需要执行外部uixml页面脚本方法,必选项,字符串类型

返回值:无

内置Sprite对象用于实现桥接功能。

require(moduleName:string): object

x5webview控件实现对系统api对象引用

参数:

moduleName:待引用模块标识,必选项,字符串

返回值:模块对象,js对象

桥接功能

通过Sprite.require("模块标识")来实现对系统api对象引用,如使用Device对象方法。

var device = Sprite.require("Device");
var version = device.getVersion();

支持桥接组件

内置功能组件

App

Window 注:

  • 方法不支持:hideSip();
  • 事件不支持:loader,animator

Device

Native

Encryption

Time

Http

NetInfo

File

UI MemCache

DiskCache

Camera

Console

Pixel

ImageUtil

Location

外置功能组件

Db

DbCipher

Barcode

XmlDocument

XmlElement

AccessAuth

VideoUtil

Phone

Sms Contact

AudioPlay

AudioRecord

MapUtil

IapPay

WeiXin

Qq WeiBo

BaiduLocation

AliPay

BaiduVoice

BaiduTts

SanforVpn

ExMobiPush