设置App桌面图标上显示的角标数字

布满荆棘的人生 2023-01-21 13:29 54阅读 0赞

# 原文 #

[手机微信搜索公众号 酒酒酒酒,公共号内搜索标题 设置App桌面图标上显示的角标数字][_ _App]

扫描公共号查看原文:

### 设置App桌面图标上显示的角标数字 ###

*  原文
 *  前言：
 *  新的前置条件:
 *  正文：
 *  代码：
 *  文档地址：
 *  API
 *  参数：
 *  平台支持：

![在这里插入图片描述][20210516174033504.jpg_pic_center]

# 前言： #

使用uni-app开发苹果应用App和安卓应用App，已经有一年半的时间了，期间一直在记录自己遇到的坑，和对知识的整理，最近有童鞋问到数字角标，那么今天就补发一下吧

# 新的前置条件: #

开发环境：windows  
开发框架：uni-app , H5+，nativeJS  
编辑器：HbuilderX  
兼容版本：安卓已作测试，IOS已测试

# 正文： #

1.  首先需要使用到 nativeJS 提供的API:

plus.runtime.setBadgeNumber(number, options);

# 代码： #

Tips: 此代码可以直接复制到使用，无需更改

// #ifdef APP-PLUS
    plus.runtime.setBadgeNumber(99);
    // #endif

为了防止运行到浏览器会报错，增加了条件渲染// \#ifdef APP-PLUS ，此条件渲染可以让代码只在APP内运行

# 文档地址： #

[https://www.html5plus.org/doc/zh\_cn/runtime.html\#plus.runtime.setBadgeNumber][https_www.html5plus.org_doc_zh_cn_runtime.html_plus.runtime.setBadgeNumber]

# API #

plus.runtime.setBadgeNumber(number, options);

# 参数： #

number: ( Number ) 必选  
要显示的角标数字值，参数为0则表示清除角标数字。  
options: ( BadgeOptions ) 可选  
小米手机显示角标需要在系统消息中心显示一条通知，此参数用于设置通知的标题（title）和内容（content）。

# 平台支持： #

Android - 2.2+ (支持) :  
目前仅支持小米(MIUI6及以上)和华为设备，其它设备调用后无任何效果；  
HBuilderX2.9.9+版本支持VIVO设备。  
iOS - 4.3+ (支持) :

应用需开启“Push Notifications”服务才生效，也就是应用通知权限。

IOS 需要开启“Push Notifications”服务才生效，也就是应用通知权限;

通知权限是否开启，请看另一篇文章：[h5+ 检测 APP 是否开启应用通知权限][h5_ _ APP]

[_ _App]: https://mp.weixin.qq.com/s/4-lve18nc7L07bQiDLjZ3g
[20210516174033504.jpg_pic_center]: /images/20221020/7b5f1fbf07094dd8ba04f9113a6d1251.png
[https_www.html5plus.org_doc_zh_cn_runtime.html_plus.runtime.setBadgeNumber]: https://www.html5plus.org/doc/zh_cn/runtime.html#plus.runtime.setBadgeNumber
[h5_ _ APP]: https://mp.weixin.qq.com/s?__biz=Mzg3NTAzMzAxNA==&mid=2247483831&idx=1&sn=b32ad4fb6630c475fcc8c253d8871e4c&chksm=cec6f96ef9b1707839fe22ae6e9ea3d9b768d74896d950f8c657b150e5ef1e03afbea535c8cc&scene=21#wechat_redirect