组件：徽标

徽标数组件，包裹子元素并在右上角显示计数、文本或圆点，支持溢出阈值。

典型使用场景：

• 消息通知（未读消息数量、新消息提醒、通知计数）
• 购物车（商品数量、购物车标识、促销标记）
• 用户状态（在线状态、未读消息、新评论）
• 功能标识（新功能标记、更新提示、热门推荐）
• 系统提醒（系统通知、待处理事项、任务提醒）

📌 继承自视图的成员速查

本组件继承自 视图 类，可直接使用以下属性和方法：

属性： ID、左边、顶边、右边、底边、宽度、高度、背景、背景颜色、背景图像、文本、文本颜色、字体、字体大小、字体粗细、行高、边框、边框圆角、边框宽度、光标样式、显示模式、透明度、外边距、外边距底、外边距左、外边距右、外边距顶、最大高度、最大宽度、最小高度、最小宽度、内边距、内边距底、内边距左、内边距右、内边距顶、定位、CLASS、InnerHTML、OuterHTML、内容水平对齐方式、首行缩进、可视、显示层级、内联样式、禁用

方法： 追加内联样式(样式文本)、置内联样式(名称,值)、取内联样式值(名称)、取Style对象()、添加事件(事件名称, 回调函数)、删除事件(事件名称, 回调函数)、获取焦点()、清除焦点()、添加样式类(类名称)、移除样式类(类名称)、取样式类列表()、取样式类()、执行单击()、取属性值(属性名)、取属性节点(属性名)、取布局参数()、取渲染宽度()、取渲染高度()、取渲染顶边()、取渲染左边()、左侧对齐到(目标组件,偏移量)、右侧对齐到(目标组件,偏移量)、顶边对齐到(目标组件,偏移量)、底边对齐到(目标组件,偏移量)、右侧对齐到左(目标组件, 偏移量)、左侧对齐到右(目标组件, 偏移量)、底边对齐到顶(目标组件, 偏移量)、顶边对齐到底(目标组件, 偏移量)、有指定属性(属性名)、有属性()、内容可编辑()、包含CSS类(类名)、取命名空间()、取下个节点()、取下个元素()、取节点名称()、取节点类型()、取父节点()、取父元素()、取上个节点()、取上个元素()、销毁()、删除属性(属性名)、删除属性节点(属性名)、置属性值(属性名, 属性值)、置属性节点(属性节点)、取标签名()、移动(左边 顶边, 宽度, 高度)、取原生对象()、置被单击回调(回调函数)、置被双击回调(回调函数)、置鼠标被进入回调(回调函数)、置鼠标被移出回调(回调函数)、置鼠标被移动回调(回调函数)、置鼠标被按下回调(回调函数)、置鼠标被抬起回调(回调函数)、置鼠标滚轮被滚动回调(回调函数)、置键盘被按下回调(回调函数)、置按键被抬起回调(回调函数)、置按键被压下回调(回调函数)、置被失去焦点回调(回调函数)、置被获得焦点回调(回调函数)

事件： 被单击(源对象,事件源)、被双击(源对象,事件源)、鼠标被进入(源对象,事件源)、鼠标被移出(源对象,事件源)、鼠标被移动(源对象,事件源)、鼠标被按下(源对象,事件源)、鼠标被抬起(源对象,事件源)、鼠标滚轮被滚动(源对象,事件源)、键盘被按下(源对象,事件源)、按键被抬起(源对象,事件源)、按键被压下(源对象,事件源)、被失去焦点(源对象,事件源)、被获得焦点(源对象,事件源)

💡 完整成员列表及详细说明请参考：视图 类

常用操作速查

样式美化参考

徽标样式变体：

• 数字徽标：徽标 = "99+"，徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，`徽标大小 = 12
• 文本徽标：徽标 = "新"，徽标背景 = "#52c41a"，徽标颜色 = "#ffffff"，`徽标大小 = 10
• 圆点徽标：徽标 = ""，徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，`徽标大小 = 8

位置样式：

• 右上角：徽标位置 = "右上角"，右偏移 = -8，上偏移 = -8
• 右下角：徽标位置 = "右下角"，右偏移 = -8，下偏移 = -8
• 左上角：徽标位置 = "左上角"，左偏移 = -8，上偏移 = -8
• 左下角：徽标位置 = "左下角"，左偏移 = -8，下偏移 = -8

颜色样式：

• 红色徽标：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"
• 绿色徽标：徽标背景 = "#52c41a"，徽标颜色 = "#ffffff"
• 蓝色徽标：徽标背景 = "#1890ff"，徽标颜色 = "#ffffff"
• 黄色徽标：徽标背景 = "#faad14"，徽标颜色 = "#ffffff"
• 紫色徽标：徽标背景 = "#722ed1"，徽标颜色 = "#ffffff"

状态样式：

• 普通状态：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，边框 = "none"
• 悬停状态：徽标背景 = "#ff7875"，徽标颜色 = "#ffffff"，边框 = "none"
• 选中状态：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，边框 = "2px solid #ffffff"
• 禁用状态：徽标背景 = "#d9d9d9"，徽标颜色 = "#ffffff"，透明度 = "0.6"

尺寸样式：

• 小尺寸：徽标大小 = 8，宽度 = 16，高度 = 16，字体大小 = "10px"
• 中尺寸：徽标大小 = 12，宽度 = 20，高度 = 20，字体大小 = "12px"
• 大尺寸：徽标大小 = 16，宽度 = 24，高度 = 24，字体大小 = "14px"
• 超大尺寸：徽标大小 = 20，宽度 = 28，高度 = 28，字体大小 = "16px"

特殊样式：

• 边框徽标：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，边框 = "2px solid #ffffff"，边框圆角 = "50%"
• 阴影徽标：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，阴影 = "0 2px 4px rgba(0,0,0,0.2)"，边框圆角 = "50%"
• 脉冲徽标：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，动画 = "脉冲"，边框圆角 = "50%"
• 闪烁徽标：徽标背景 = "#ff4d4f"，徽标颜色 = "#ffffff"，动画 = "闪烁"，边框圆角 = "50%"

响应式样式：

• 移动端适配：徽标大小 = 10，宽度 = 20，高度 = 20，字体大小 = "10px"
• 桌面端适配：徽标大小 = 12，宽度 = 24，高度 = 24，字体大小 = "12px"
• 大屏适配：徽标大小 = 14，宽度 = 28，高度 = 28，字体大小 = "14px"

示例代码

' 示例：完整的徽标使用演示
' 1. 创建徽标
变量 徽标1 = 创建 徽标()
' 2. 设置属性
徽标1.左边 = 100
徽标1.顶边 = 100
变量 按钮1 = 创建元素("button")
按钮1.文本 = "消息"
徽标1.置标记元素(按钮1)
徽标1.计数 = 5
徽标1.最大值 = 99
' 3. 添加到父容器
添加组件(徽标1)

属性：计数

• 类型： 数值型
• 说明： 设置或获取徽标显示的计数值。

属性：最大值

• 类型： 数值型
• 说明： 设置或获取计数溢出阈值，超过显示 X+，默认 99。

属性：显示点

• 类型： 逻辑型
• 说明： 设置或获取是否以圆点形式显示。

属性：显示零

• 类型： 逻辑型
• 说明： 设置或获取计数为 0 时是否显示。

属性：文本

• 类型： 文本型
• 说明： 设置自定义徽标文本，优先于计数。

属性：颜色

• 类型： 文本型
• 说明： 设置或获取徽标背景色。

函数：置标记元素(元素)

设置徽标所标记的目标元素。

函数：置偏移(X,Y)

设置徽标相对右上角的偏移像素，正数向右下。