简介(下载地址

Ba-AppWidget 是一款窗口小工具(桌面小部件、微件)插件,默认为音乐播放器的样式,有其他界面需要,可联系作者定制。

  • 支持点击事件监听
  • 支持动态更改页面内容
  • 支持设置小工具的预览图片
  • 支持自定义样式

截图展示

uniapp ios 生成桌面的快捷方式 uniapp 桌面小部件_微件

使用方法

script 中引入组件

const appWidget = uni.requireNativePlugin('Ba-AppWidget')

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

const appWidget = uni.requireNativePlugin('Ba-AppWidget')
		export default {
			data() {
					return {
						msgList: [],
						textColor1: "#FF0000",
						contents: [{
							text1: "text11",
							text2: "text21",
							imgUrl1: "http://www.lihuisem.com/mwj/zb_users/upload/2021/28/1611837327969_1.jpeg"
						}, {
							text1: "text12",
							text2: "text22",
							imgUrl1: "http://www.lihuisem.com/mwj/zb_users/upload/2021/28/1611837327969_5.jpeg"
						}],
						index: 0
					}
				},
				methods: {
					init() { //初始化配置,使用默认配置可以不调用
						appWidget.init({
						        isTest: true,//仅用于测试效果
								textColor1: this.textColor1,
								text1: "text11",
								text2: "text21",
								imgUrl1: "http://www.lihuisem.com/mwj/zb_users/upload/2021/28/1611837327969_1.jpeg"
							},
							res => {
								console.log(res);
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 3000
								})
			
							});
					},
					requestPin() { //添加到桌面,也可以通过桌面的方式添加
						let that = this;
						appWidget.requestPin(
							res => {
								console.log(res);
								that.msgList.unshift(JSON.stringify(res))
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 3000
								})
					
							});
					},
					subClick() { //监听点击事件
						let that = this;
						appWidget.subClick(
							res => {
								console.log(res);
								if (res.data) {
									if(res.data.id){//根据id判断点击的事哪个按钮
										
									}
									that.updateAW();//更新页面内容
									that.msgList.unshift(JSON.stringify(res))
								}
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 3000
								})
			
							});
					},
					updateAW() {//更新内容
						let that = this;
			
						if (this.index == 0) {
							this.index = 1;
						} else {
							this.index = 0;
						}
			
						let content = this.contents[this.index];
						appWidget.updateAW(content,
							res => {
								console.log(res);
								if (res.data) {
									that.msgList.unshift(JSON.stringify(res))
								}
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 3000
								})
			
							});
					},
				}
			}

api 列表

方法名

说明

init

初始化配置,使用默认配置可以不调用

requestPin

添加小工具到桌面

subClick

监听小工具的点击事件

updateAW

更新小工具的内容

init 方法参数

初始化配置,使用默认配置可以不调用

属性名

类型

必填

默认值

说明

text1

String

false

‘’

文本1的内容

text2

String

false

‘’

文本2的内容

textColor1

String

false

‘#181818’

文本1颜色

textColor2

String

false

‘#666866’

文本2颜色

textSize1

Number

false

14

文本1的字体大小,单位dp

textSize2

Number

false

12

文本2的字体大小,单位dp

btnIcon1

String

false

‘’

按钮1的图标,原生配置地址,见原生图标配置说明

btnIcon2

String

false

‘’

按钮2的图标,同上

btnIcon3

String

false

‘’

按钮3的图标,同上

btnIcon4

String

false

‘’

按钮4的图标,同上

btnIcon5

String

false

‘’

按钮5的图标,同上

imgUrl1

String

false

‘’

图片1,网络地址

updateAW 方法参数

更新小工具的内容

属性名

类型

必填

默认值

说明

text1

String

false

‘’

文本1的内容

text2

String

false

‘’

文本2的内容

textColor1

String

false

‘#181818’

文本1颜色

textColor2

String

false

‘#666866’

文本2颜色

textSize1

Number

false

14

文本1的字体大小,单位dp

textSize2

Number

false

12

文本2的字体大小,单位dp

btnIcon1

String

false

‘’

按钮1的图标,原生配置地址,见原生图标配置说明

btnIcon2

String

false

‘’

按钮2的图标,同上

btnIcon3

String

false

‘’

按钮3的图标,同上

btnIcon4

String

false

‘’

按钮4的图标,同上

btnIcon5

String

false

‘’

按钮5的图标,同上

imgUrl1

String

false

‘’

图片1,网络地址

原生图标配置

注意:配置更改后,需要重新制作基座才生效,建议提前配置。

  • 按钮图标:建议必填,不填使用默认图标,在项目的 “nativeplugins\Ba-AppWidget\android\res\drawable” 目录下(没有就新建),添加图标,然后在init或updateAW方法设置,对应的参数传图标的名称即可(如,图标文件为“ba_aw_ic_pause.png”,那参数的值为“ba_aw_ic_pause”)
  • 小工具的预览图片:建议必填,不填使用默认图标,在项目的 “nativeplugins\Ba-AppWidget\android\res\drawable” 目录下(没有就新建),添加名称为“ba_appwidget_preview.png”的图标,文件名必须一致

uniapp ios 生成桌面的快捷方式 uniapp 桌面小部件_窗口小部件_02