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

原文

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

扫描公共号查看原文:

前言：

使用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

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 是否开启应用通知权限