您现在的位置是:首页 >技术杂谈 >uniapp 来电显示悬浮窗插件(支持锁屏来电) Ba-CallerID网站首页技术杂谈

uniapp 来电显示悬浮窗插件(支持锁屏来电) Ba-CallerID

三杯五岳 2023-06-03 20:00:03
简介uniapp 来电显示悬浮窗插件(支持锁屏来电) Ba-CallerID

简介(下载地址

Ba-CallerID 是一款来电显示悬浮窗插件插件。

  • 支持显示、隐藏
  • 支持锁屏来电显示
  • 支持自定义位置显示(上、中、下)
  • 支持拖动(这版不支持,需要的话可以加)
  • 支持申请、判断悬浮窗权限

截图展示

在这里插入图片描述

使用方法

script 中引入组件

	const callerID = uni.requireNativePlugin('Ba-CallerID')

script 中调用(示例参考,可根据自己业务和调用方法自行修改)

        methods: {
			showFW(gravity) { //显示
				callerID.show({
						gravity: gravity, //显示位置:0中间 1上 2下
						name: "三杯五岳",
						content: "生活的梦,永远不止如此!",
						call: "接听电话",
						uncall: "拒绝电话",
						empty: "无记录",
						avatar: "https://test.jpg",
						totalHint: "详情记录(6)",
						tel: "010-0100-7530",
						list: [{
							iconText: "张",
							title1: "张三",
							title2: "河北某宝公司",
							date: "2023-4-19",
							time: "22:10:21",
							iconColor: "#A71F21",
							title1Color: "#6B646B",
							title2Color: "#333333",
						}, {
							iconText: "李",
							title1: "李四",
							title2: "深圳某东有限公司",
							date: "2023-4-19",
							time: "22:10:21",
							iconColor: "#00A71F",
							title1Color: "#00646B",
							title2Color: "#003333",
						}]
					},
					(res) => {
						console.log(res);
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3000
						})
					});
			},
			hideFW() { //隐藏
				callerID.hide(
					(res) => {
						console.log(res);
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3000
						})
					});
			},
			permissionFW() { //申请悬浮窗权限
				callerID.permission(
					(res) => {
						console.log(res);
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3000
						})
					});
			},
			goPermissionFW() { //跳转到悬浮窗权限页面
				callerID.goPermission(
					(res) => {
						console.log(res);
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 3000
						})
					});
			},
			isPermissionFW() { //是否申请悬浮窗权限
				callerID.isPermission(
					(res) => {
						console.log(res);
						let msg = res.msg;
						if (res.data) {
							msg = "isPermission:" + res.data.isPermission;
						}
						uni.showToast({
							title: msg,
							icon: "none",
							duration: 3000
						})
					});
			},
		}

点击事件监听

在应用生命周期app.vue的onLaunch事件中设置监听:

        onLaunch: function() {
			var globalEvent = uni.requireNativePlugin('globalEvent');
			globalEvent.addEventListener('baCallerIdEvent', function(e) {
				console.log('baCallerIdEvent:' + JSON.stringify(e));
				//处理点击事件
			});
		},
		onShow: function() {
		},
		onHide: function() {
		}

点击事件参数

属性名说明
action事件类型,如:onClick
tag事件名称:接听电话call,挂断电话uncall

示例:

{"tag":"uncall","action":"onClick"}

api 列表

方法名说明
show显示
hide隐藏
permission申请悬浮窗权限
goPermission跳转到悬浮窗权限页面
isPermission是否申请悬浮窗权限

系列插件

图片选择插件 Ba-MediaPicker文档

图片编辑插件 Ba-ImageEditor文档

文件选择插件 Ba-FilePicker文档

应用消息通知插件(多种样式,新增支持常驻通知模式) Ba-Notify文档

自定义通知(耳机电量)插件 Ba-NotifyEarphone文档

应用未读角标插件 Ba-Shortcut-Badge文档

应用开机自启插件 Ba-Autoboot文档

扫码原生插件(毫秒级、支持多码)Ba-Scanner-G文档

扫码原生插件 - 新(可任意自定义界面版本;支持连续扫码;支持设置扫码格式)Ba-Scanner文档

动态修改状态栏、导航栏背景色、字体颜色插件 Ba-AppBar文档

原生sqlite本地数据库管理 Ba-Sqlite文档

安卓保活插件(采用多种主流技术) Ba-KeepAlive文档

安卓保活套装(通用、常驻通知、电池优化、自启管理、后台运行等)文档

安卓快捷方式(桌面长按app图标) Ba-Shortcut文档

自定义图片水印(任意位置) Ba-Watermark文档

最接近微信的图片压缩插件 Ba-ImageCompressor文档

视频压缩、视频剪辑插件 Ba-VideoCompressor文档

动态切换应用图标、名称(如新年、国庆等) Ba-ChangeIcon文档

原生Toast弹窗提示(穿透所有界面、穿透原生;自定义颜色、图标 ) Ba-Toast文档

图片涂鸦、画笔 Ba-ImagePaint文档

pdf阅读(手势缩放、显示页数) Ba-Pdf文档

声音提示、震动提示、语音播报 Ba-Beep文档

websocket原生服务(自动重连、心跳检测) Ba-Websocket文档

短信监听(验证码) Ba-Sms文档

智能安装(自动升级) Ba-SmartUpgrade文档

监听系统广播、自定义广播 Ba-Broadcast文档

监听通知栏消息(支持白名单、黑名单、过滤) Ba-NotifyListener文档

全局置灰、哀悼置灰(可动态、同时支持nvue、vue) Ba-Gray文档

获取设备唯一标识(OAID、AAID、IMEI等) Ba-IdCode文档

实时定位(系统、后台运行、支持息屏)插件 Ba-Location文档

实时定位(高德、后台运行、支持息屏、坐标转换、距离计算) Ba-LocationAMap文档

窗口小工具、桌面小部件、微件 Ba-AppWidget文档

窗口小工具、桌面小部件、微件(日历、时间) Ba-AwCalendarS文档

画中画悬浮窗(视频) Ba-VideoPip文档

悬浮窗(在其他应用上层显示) Ba-FloatWindow文档

悬浮窗(应用内、无需授权) Ba-FloatWindow2文档

悬浮窗(悬浮球、动态菜单、在其他应用上层显示) Ba-FloatBall文档

添加到“用其他应用打开”中,用于文件传递、分享等 Ba-ShareReceive文档

获取地图数据(高德、地理编码、反地理编码) Ba-AMapData文档

风语者!平时喜欢研究各种技术,目前在从事后端开发工作,热爱生活、热爱工作。