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

news2025/1/13 17:33:04

简介(下载地址)

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

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

截图展示

在这里插入图片描述

使用方法

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 方法参数

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

属性名类型必填默认值说明
text1Stringfalse‘’文本1的内容
text2Stringfalse‘’文本2的内容
textColor1Stringfalse‘#181818’文本1颜色
textColor2Stringfalse‘#666866’文本2颜色
textSize1Numberfalse14文本1的字体大小,单位dp
textSize2Numberfalse12文本2的字体大小,单位dp
btnIcon1Stringfalse‘’按钮1的图标,原生配置地址,见原生图标配置说明
btnIcon2Stringfalse‘’按钮2的图标,同上
btnIcon3Stringfalse‘’按钮3的图标,同上
btnIcon4Stringfalse‘’按钮4的图标,同上
btnIcon5Stringfalse‘’按钮5的图标,同上
imgUrl1Stringfalse‘’图片1,网络地址

updateAW 方法参数

更新小工具的内容

属性名类型必填默认值说明
text1Stringfalse‘’文本1的内容
text2Stringfalse‘’文本2的内容
textColor1Stringfalse‘#181818’文本1颜色
textColor2Stringfalse‘#666866’文本2颜色
textSize1Numberfalse14文本1的字体大小,单位dp
textSize2Numberfalse12文本2的字体大小,单位dp
btnIcon1Stringfalse‘’按钮1的图标,原生配置地址,见原生图标配置说明
btnIcon2Stringfalse‘’按钮2的图标,同上
btnIcon3Stringfalse‘’按钮3的图标,同上
btnIcon4Stringfalse‘’按钮4的图标,同上
btnIcon5Stringfalse‘’按钮5的图标,同上
imgUrl1Stringfalse‘’图片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”的图标,文件名必须一致

在这里插入图片描述

系列插件

图片选择插件 Ba-MediaPicker (文档)

图片编辑插件 Ba-ImageEditor (文档)

文件选择插件 Ba-FilePicker (文档)

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

应用未读角标插件 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(文档)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/117702.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

区块链(一): 以太坊基础知识

目录什么是区块链?什么是以太坊?什么是加密货币?以太坊与比特币有什么不同?以太坊能做什么?什么是智能合约?以太坊社区以太坊白皮书什么是区块链? 区块链是一个交易数据库,在网络中…

容器,容器技术,云容器相关入门知识

前言 最近面试了一家国企,交谈愉快,对方的工程师问到容器时,突然愣了一下。脑子里有学习前端时候学习的docker,但印象里docker可不能代表容器技术,于是学习容器相关知识后整理相关知识以作巩固。 什么是容器 有点开…

SuperMap iDesktop/iDesktopX 端性能优化

作者:yd&hyy 一、背景 在使用iDesktop/iDesktopX的三维场景加载GIS数据的过程中,随着数据的种类、大小、数量的增多,往往会有很多的性能问题,加载速率缓慢,数据显示清晰度不足,多数据交叠显示错误&am…

『分分钟玩转VueRouter●上』VueRouter的一些基础配置

文章目录前言一、vue中如何使用VueRouter?二、路由使用的基本配置1.多级路由配置2.路由中的query参数3.命名路由4.路由的params参数5.路由的props配置6.router-link的replace属性7.通配符路由前言 计算机网络中有一个路由的概念:路由是指网络数据包发送到目的地址的…

php宝塔搭建部署实战SDCMS蓝色通用宽屏企业网站源码

大家好啊,我是测评君,欢迎来到web测评。 本期给大家带来一套php开发的SDCMS蓝色通用宽屏企业网站源码,感兴趣的朋友可以自行下载学习。 技术架构 PHP7.2 nginx mysql5.7 JS CSS HTMLcnetos7以上 宝塔面板 文字搭建教程 下载源码&…

maven 继承和聚合的区别

maven 继承和聚合的区别 参考 https://cloud.tencent.com/developer/article/1397748 继承 目的:统一管理version版本,少写冗余代码。使用: 父类pom不写业务,只写 pom的jar包版本等信息,子类中使用 parent 标签&…

STM32G473CBT6关于ADC采集的总结

STM32G473CBT6单片机在浮点运算,信号采集、数据处理方面有很大的用途。因相关的资料较少,特此做一下笔记,方便后期使用。STM32CubeMX软件比较强大,兼容IAR和keil方便直接生成代码文件,但相关的库不熟悉,好东…

【Web安全】应用层拒绝服务攻击

目录 1、DDOS简介 2、应用层DDOS 2.1 CC攻击 2.2 限制请求频率 2.3 道高一尺,魔高一丈 3、验证码 CAPTCHA 4、防御应用层DDOS 5、资源…

章节五:RASA NLU组件介绍--语言模型和分词器

​ 这里写目录标题一、前言二、语言模型组件1、MitieNLP2、SpacyNLP三、分词器1、WhitespaceTokenizer2、JiebaTokenizer3、MitieTokenizer4、SpacyTokenizer5、自定义分词器一、前言 RASA在处理对话时,整体流程是pipeline结构,自然语言理解&#xff08…

【漏洞分析】Apache ShardingSphere-Proxy <5.3.0 身份认证绕过

漏洞简介 2022年12月22日,Apache 官方公告发布 ShardingSphere-Proxy 5.3.0 之前版本存在身份绕过漏洞(CVE-2022-45347)。当 ShardingSphere-Proxy 使用 MySQL 作为后端数据库时,由于 ShardingSphere-Proxy 在客户端认证失败后没…

Linux-脚本安装jdk(使用jdk压缩包方式)

1、下载Linux版jdk oracle官网:Java Downloads | Oracle 2、上传jdk到linux 在linux中软件一般安装到/usr/local目录中 3、将jdk解压 解压命令: tar -zxvf jdk-8u301-linux-x64.tar.gz 将解压后的jdk改名为jdk8 mv jdk1.8.0_301 jdk8 4、配置jdk环境变量 使用vi打开/etc/p…

Java 面试题 (六) --------- 框架相关

1、什么是 Spring 框架?Spring 框架有哪些主要模块? Spring是一个控制反转和面向切面的容器框架。 Spring有七大功能模块: 1、Core Core模块是Spring的核心类库,Core实现了IOC功能。 2、AOP Apring AOP模块是Spring的AOP库&…

FLTK的UI设计工具FLUID使用方法总结

tags: FLTK C GUI 写在前面 终于又捡起来FLTK了, 先来看看怎么通过FLUID创建一个图形界面并完成回调函数的创建, 参考的是官方教程中关于创建一个CubeView程序的例子, 教程里面很多都与最新版本的FLTK界面不太一致, 但是通过我的摸索还是找出了方法. 下面来分享一下. 创建类…

centos7搭建mysql5.6

检查是否安装mysql rpm -qa | grep mysql 检查已安装的Mariadb rpm -qa | grep -i mariadb 卸载已安装的Mariadb数据库 rpm -qa | grep mariadb | xargs rpm -e --nodeps 下载mysql5.6安装包文件 wget http://repo.mysql.com/mysql-community-release-el7-5.noarch.rpm安…

详解什么是Polygon跨链桥| Tokenview

Polygon是一个Layer2网络,用于解决以太坊的吞吐量和主权挑战。尽管以太坊是最受欢迎的区块链开发平台,但它的吞吐量很低,不适合某些应用程序。Polygon提供特定于应用程序的、与以太坊兼容的侧链,将独立链的可扩展性和独立性与以太…

自学开发技术,从入门到入行

今天我们不谈技术,也不聊业务,说说学习技术的心得。 说到学习这种事情,无论是学什么,都需要持之以恒,拥有坚持的决心才有可能会学到一些东西。如果只是三天打鱼,两天晒网的态度,不出差错的话&a…

ORB-SLAM2 --- Tracking::TrackLocalMap函数

目录 1.函数作用 2.函数步骤 3.code 4.函数解释 ORB-SLAM2 --- Tracking::UpdateLocalKeyFrames函数https://blog.csdn.net/qq_41694024/article/details/128307627 1.函数作用 在跟踪得到当前帧初始姿态后,现在对local map进行跟踪得到更多的匹配&#xff0…

《迷你世界》亿级玩家都在用的游戏场景推荐系统长啥样?

导读:中国TOP1沙盒游戏,如何解决数据存储难题? 提到推荐系统,很多人都在电商购物、资讯或娱乐平台中体验过。比如,你刚在某电商APP买了一部手机,过两天再登录时,首页推荐中必定有耳机、手机壳等…

【信息安全】seed-labs实验-Secret-Key Encryption Lab

目录Task 1: Frequency AnalysisTask 2: Encryption using Different Ciphers and ModesTask 4: PaddingTask 5: Error Propagation – Corrupted Cipher TextTask 6: Initial Vector (IV) and Common MistakesTask 6.1. IV ExperimentTask 6.2. Common Mistake: Use the Same …

python源代码打包成为exe文件

目录标题前言下载安装模块(pyinstaller)执行打包命令1、在cmd中进入项目文件2、执行pyinstaller命令成exe文件3、找到exe文件报错以及解决报错X1解决方法:报错X2解决方法:写在最后前言 大家都知道我们在pycharm中编写的源代码&am…