HarmonyOS ArkUI容器类组件-角标组件（Badge）

ArkUI 开发框架提供了 Badge 容器组件，它用来标记提示信息的容器组件，最常用的场景比如 Launcher 桌面上的消息提示等，本节笔者简单介绍一下 Badge 的使用。

Badge 定义介绍

interface BadgeInterface {
  (value: BadgeParamWithNumber): BadgeAttribute;
  (value: BadgeParamWithString): BadgeAttribute;
}

declare interface BadgeParam {
  position?: BadgePosition;
  style: BadgeStyle;
}

declare interface BadgeParamWithNumber extends BadgeParam {
  count: number;
  maxCount?: number;
}

declare interface BadgeParamWithString extends BadgeParam {
  value: string;
}

declare interface BadgeParam {
  position?: BadgePosition;
  style: BadgeStyle;
}

Badge 的构造方法允许接收 BadgeParamWithNumber 和 BadgeParamWithString 两种类型的参数，它们都继承自 BadgeParam ，BadgeParam 参数说明如下：

• position：设置 badge 的显示位置，BadgePosition 提供了以下 3 种位置：
  • Right： badge 显示在右侧纵向居中。
  • RightTop（默认值）： badge 显示在右上角。
  • Left： badge 显示在左侧纵向居中。
• style：设置 badge 的显示样式，BadgeStyle 样式参数说明如下：
  • color：设置 badge 的文本颜色，默认为白色。
  • fontSize：设置 badge 的文本字体大小，默认为 10 vp。
  • badgeSize：设置 badge 的显示大小。
  • badgeColor：设置 badge 的背景颜色，默认为红色。

简单样例如下所示：

    Badge({
      value: ' ',
      position: BadgePosition.Left,