HarmonyOS应用开发实战:猫猫大作战-DotIndicator 的完整配置选项

发布时间:2026/7/28 1:17:34
HarmonyOS应用开发实战:猫猫大作战-DotIndicator 的完整配置选项 前言在 Swiper 轮播组件中指示器是告知用户当前位置的视觉要素。HarmonyOS 提供内置的DotIndicator组件支持自定义圆点大小、颜色、选中态样式。本文以「猫猫大作战」新手引导页的指示器为锚点讲解 DotIndicator 的完整配置选项。提示本系列不讲 ArkTS 基础语法与环境搭建假设你已跟完第 1–91 篇。本篇是阶段三第 92 篇。一、DotIndicator 配置1.1 基础样式.indicator(new DotIndicator() .itemWidth(8) // 圆点宽度 .itemHeight(8) // 圆点高度 .selectedItemWidth(24) // 选中态宽度 .selectedItemHeight(8) // 选中态高度 .color(Color.Gray) // 未选中颜色 .selectedColor(Color.Green) // 选中颜色 )1.2 属性一览属性类型默认值itemWidthLength8itemHeightLength8selectedItemWidthLength8selectedItemHeightLength8colorResourceColorColor.GrayselectedColorResourceColorColor.Blue二、总结DotIndicator 是 Swiper 内置的圆点指示器支持宽度、高度、颜色等样式的自定义。核心要点DotIndicator 作为 Swiper 的.indicator()属性使用支持选中/未选中态的宽度、高度、颜色分别设置选中态支持长条样式selectedItemWidth itemWidth下一篇预告第 93 篇将深入 Stack 全屏覆盖——暂停遮罩层的实现。如果这篇文章对你有帮助欢迎点赞、收藏⭐、关注你的支持是我持续创作的动力相关资源Swiper 组件参考DotIndicator 参考开源鸿蒙跨平台社区第 91 篇Swiper 轮播第 93 篇Stack 暂停遮罩