更新记录
1.0.8(2024-11-18) 下载此版本
修复发布失败问题
1.0.7(2024-11-18) 下载此版本
新增uniapp发送数据到js
1.0.6(2024-10-25) 下载此版本
修复回调函数只接收一次问题
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.91,Android:4.4,iOS:不确定,HarmonyNext:不确定 | × | × | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
android-floatwindow
长期维护,有任何问题在插件群联系
推荐作者保活插件一起使用
功能介绍
- 支持不申请权限时 当前app 全局页面弹窗 申请权限时 退出app 和app 时均显示
- 浮窗可以设置拖动
- 浮窗可以自定义大小 网页px 转换android px 使其大小对应
- h5 网页直接透传消息到uniapp 代码,相互交互
uniappx
import {FloatWindow} from "@/uni_modules/android-floatwindow"
var window:FloatWindow|null=null;
window=new FloatWindow();
window!.loadUrl("file:///android_asset/test.html");
window!.setFixedWidthHeight(true,window!.convertHtmlPxToAndroidPx(300),window!.convertHtmlPxToAndroidPx(200))
window!.setGravity(4)
window!.onListenerWebData(function(type:number,data:string){
if(type==0){
window!.dismiss();
}
})
window!.createAndShow();// 首次显示 之后可以用 window!.show(); window!.hide(); 原位置显示隐藏
//window!.sendDataToJs(1,"hello uniapp");// uniapp 调用js 方法 dataFromUniapp 并传输数据
uniapp
import {FloatWindow} from "@/uni_modules/android-floatwindow"
var window=null;
window=new FloatWindow();
window.loadUrl("file:///android_asset/test.html");
window.setFixedWidthHeight(true,window.convertHtmlPxToAndroidPx(300),window.convertHtmlPxToAndroidPx(200))
window.setGravity(4)
window.onListenerWebData(function(type,data){
if(type==0){
window.dismiss();
}
})
window.createAndShow();// 首次显示 之后可以用 window!.show(); window!.hide(); 原位置显示隐藏
//window.sendDataToJs(1,"hello uniapp");// uniapp 调用js 方法 dataFromUniapp 并传输数据
h5 使用介绍
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>window</title>
</head>
<!-- 这里需要去掉边框 否则可能出现滑动 -->
<body style="margin: 0px;padding: 0px;" >
<div class="content">
<div id="paragraph">
这是一个浮窗h5
</div>
<div class="close_btn">
<img id="close" src="close.png" style="width: 30px;height: 30px;"/>
</div>
</div>
<style>
.content{
background-color: green;
border-radius: 10px;
margin: 0px;
padding: 0px;
color: white;
width: 300px;
display: flex;
align-items: center;
justify-content: center;
height: 200px;
}
.close_btn{
position: absolute;
right: 10px;
top: 10px;
}
</style>
<script>
// 为按钮添加点击事件监听器
document.getElementById('close').addEventListener('click', function() {
uniapp.sendDataToUni(0,"")
});
function dataFromUniapp(type,msg){
console.log(type,msg);
var paragraph = document.getElementById("paragraph");
paragraph.textContent =type+ msg;
}
</script>
</body>
</html>
api 介绍
设置是否固定宽高
setFixedWidthHeight
参数1 boolean 为true 时生效
参数2 number 宽
参数3 number 高
设置位置 不可与setGravity共存
setLocation
参数1 number x 位置
参数2 number y 位置
设置是否超过状态栏
setImmersionStatusBar
参数1 boolean
设置对齐位置
setGravity
参数1 number 0-8 分别对应 上左 上中 上右 中左 中中 中右 下左 下中 下右
设置对齐位置
setGravityMore
参数1 number 0-8 分别对应 上左 上中 上右 中左 中中 中右 下左 下中 下右
参数2 number x 偏移
参数3 number y 偏移
设置是否可以拖动
setDragEnable
参数1 boolean
设置拖动范围
setBorder
参数1 number 左
参数2 number 上
参数3 number 右
参数1 number 下
创建并显示
createAndShow
取消
dismiss
显示
show
隐藏
hide
是否已经显示
isShow
更新窗口内容(已经显示的窗口更新内容)
updateWindow
设置显示方式
setShowPattern
参数1 number 0当前应用显示(无需权限) 1 前台显示 2 后台显示 3 一直显示
设置滑动样式
setSidePattern
参数1 number 0~14 效果自行测试
网页px 转换android px
convertHtmlPxToAndroidPx
return number androd px 参数1 number 网页px
检查是否有浮窗权限
checkPermission
return 是否有浮窗权限
网页数据传输到uniapp
onListenerWebData
参数1 为回调方法 回调 参数1 number 参数2 string
申请浮窗权限
打赏
感谢您使用此插件,如果你觉得本插件,解决了你的问题,赠人玫瑰,手留余香。
许可协议
MIT协议