Float Web View
/ Title: floatWebView Description: floatWebView /
论坛示例
为帮助用户更好更快的使用模块,论坛维护了一个示例(模块demo论坛帖链接),示例中包含示例代码、知识点讲解、注意事项等,供您参考。
作者联系方式QQ:503870798 ;有不解的地方可以随时咨询,同时欢迎提供有效意见和建议
模块demo论坛帖:https://community.apicloud.com/bbs/thread-173419-1-1.html
概述
简介
本模块主要是为创建一个悬浮窗,Android7.0版本以上适用。编译的时候,记得使用升级环境编译。悬浮窗内容为html页面
模块接口
create
创建一个悬浮窗,悬浮窗为一个html网页,该网页有一个floatWebView的对象,包含了功能相同的show,hide,remove,offset,size,noTouch,noLimit,center,canFocus,followTouch,stickSide方法,以及event方法用于和APP交互
create({params}, callback(ret, err))
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
url:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗html地址,支持http:// 和 widget:// 路径
w:
- 类型:整数
- 默认值:屏幕宽度*0.6
- 描述:(可选项)悬浮窗的宽度
h:
- 类型:整数
- 默认值:屏幕高度*0.6
- 描述:(可选项)悬浮窗的高度
x:
- 类型:整数
- 默认值:0
- 描述:(可选项)悬浮窗坐标x方向偏移量
y:
- 类型:整数
- 默认值:0
- 描述:(可选项)悬浮窗坐标y方向偏移量
noTouch:
- 类型:布尔
- 默认值:false
- 描述:(可选项)悬浮窗不可触摸,不能拦截触摸事件
noLimit:
- 类型:布尔
- 默认值:false
- 描述:(可选项)悬浮窗不限制在屏幕内
center:
- 类型:布尔
- 默认值:false
- 描述:(可选项)悬浮窗居中,默认为false,也就是悬浮窗在左上方
followTouch:
- 类型:布尔
- 默认值:false
- 描述:(可选项)悬浮窗是否跟随触摸控制移动
stickSide:
- 类型:布尔
- 默认值:false
- 描述:(可选项)悬浮窗是否需要自动贴边,只有在followTouch为true是生效
callback(ret, err)
ret:
- 类型:JSON 对象
- 描述:返回执行结果,或者响应悬浮窗中js调用event方法的交互事件
- 返回执行结果的内部字段:
{ status: true, //布尔类型;操作成功状态值,true|false msg: "OK", //字符串类型;文字描述 }
- 响应悬浮窗中js调用event方法的交互事件的内部字段:
{ status: true, //布尔类型;操作成功状态值,true|false msg: "event", //字符串类型;表示此次回调为浮窗中js调用event方法 eventName: "msg", //字符串类型;浮窗中js调用event方法传递的eventName,用于区分不同事件 data: {}, //JSON 对象类型;表示此次event传递的数据 }
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
},function(ret){
if (ret.msg=='event') {
switch (ret.eventName){
case 'msg':
tips(ret.data?JSON.stringify(ret.data):'测试event');
break;
}
}
});
可用性
Android系统
可提供的1.0.0及更高版本
eval
悬浮窗内执行js代码,效果类似于js的eval方法
eval({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:需要js代码的悬浮窗的名字
jsstring
- 类型:字符串
- 默认值:无
- 描述:需要执行的js代码
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.eval({name:"test",jsstring:'alert("提示弹窗")'})
可用性
Android系统
可提供的1.0.1及更高版本
show
显示悬浮窗,悬浮窗创建后默认是显示的
show({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:需要显示的悬浮窗的名字
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.show({name:"test"})
可用性
Android系统
可提供的1.0.0及更高版本
hide
隐藏指定悬浮窗
hide({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:需要隐藏的悬浮窗的名字
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.hide({name:"test"})
可用性
Android系统
可提供的1.0.0及更高版本
remove
移除指定悬浮窗
remove({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:需要移除的悬浮窗的名字
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.remove({name:"test"})
可用性
Android系统
可提供的1.0.0及更高版本
offset
设置指定悬浮窗的偏移量
offset({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
x:
- 类型:整数
- 默认值:0
- 描述:悬浮窗坐标x方向偏移量
y:
- 类型:整数
- 默认值:0
- 描述:悬浮窗坐标y方向偏移量
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.offset({name:"test",x:300,y:300})
可用性
Android系统
可提供的1.0.0及更高版本
size
设置指定悬浮窗的大小
size({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
w:
- 类型:整数
- 默认值:0
- 描述:(悬浮窗的宽度
h:
- 类型:整数
- 默认值:0
- 描述:悬浮窗的高度
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.size({name:"test",w:300,h:300})
可用性
Android系统
可提供的1.0.0及更高版本
noTouch
设置指定悬浮窗是否无法触摸
noTouch({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
noTouch:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否无法触摸
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.noTouch({name:"test",noTouch:true})
可用性
Android系统
可提供的1.0.0及更高版本
noLimit
设置指定悬浮窗是否可以显示到屏幕外
noLimit({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
noLimit:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否可以显示到屏幕外
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.noLimit({name:"test",noLimit:true})
可用性
Android系统
可提供的1.0.0及更高版本
center
设置指定悬浮窗是否居中
center({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
center:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否居中,如果为true,会重置偏移量offset为{x:0,y:0}
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.center({name:"test",center:true})
可用性
Android系统
可提供的1.0.0及更高版本
canFocus
设置指定悬浮窗是否可获得焦点,通常获取焦点后,悬浮窗可以和软键盘发生交互,但被覆盖的应用会失去焦点,具体表现例如:游戏将失去背景音乐
canFocus({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
canFocus:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否可获取焦点
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.canFocus({name:"test",canFocus:true})
可用性
Android系统
可提供的1.0.0及更高版本
followTouch
设置指定悬浮窗是否跟随触摸移动
followTouch({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
followTouch:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否跟随触摸移动
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.followTouch({name:"test",followTouch:true})
可用性
Android系统
可提供的1.0.0及更高版本
stickSide
设置指定悬浮窗是否自动贴边,近在会跟随触摸移动时生效
stickSide({params})
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
stickSide:
- 类型:布尔
- 默认值:false
- 描述:(可选项)是否自动贴边
示例代码
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
floatWebView.stickSide({name:"test",stickSide:true})
可用性
Android系统
可提供的1.0.0及更高版本
悬浮窗内接口
和同名模块接口功能相同,下面仅仅列举一下size方法的使用
悬浮窗内接口的传参不同于模块接口,传入参数必须为json字符串,也就是需要使用JSON.stringify编译一次,具体看示例
floatWebView.size( JSON.stringify({params}) )
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
w:
- 类型:整数
- 默认值:0
- 描述:(悬浮窗的宽度
h:
- 类型:整数
- 默认值:0
- 描述:悬浮窗的高度
示例代码
APP中
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
});
悬浮窗中
var data = {name:"test",w:300,h:300};
floatWebView.size( JSON.stringify(data) );
可用性
Android系统
可提供的1.0.0及更高版本
event
悬浮窗给APP发送事件,用于和APP进行交互行为
floatWebView.event( JSON.stringify({params}) )
params
name:
- 类型:字符串
- 默认值:无
- 描述:悬浮窗的名字
eventName:
- 类型:字符串
- 默认值:无
- 描述:事件名称
data:
- 类型:JSON对象
- 默认值:无
- 描述:传递的数据
示例代码
APP中
var floatWebView = api.require('floatWebView');
floatWebView.create({
name:"test",
url:"widget://html/test.html",
},function(ret){
if (ret.msg=='event') {
switch (ret.eventName){
case 'msg':
tips(ret.data?JSON.stringify(ret.data):'测试event');
break;
}
}
});
悬浮窗中
var data = {name:"test",eventName:"msg",data:{"text":"APP响应了事件"}};
floatWebView.event( JSON.stringify(data) );
可用性
Android系统
可提供的1.0.1及更高版本