
progress-bar-cj API速查手册MaterialModel、ComWheel全部接口一图看懂【免费下载链接】progress-bar-cj自定义进度条归一化UI组件项目地址: https://gitcode.com/Cangjie-TPC/progress-bar-cjprogress-bar-cj是一个用仓颉语言编写的鸿蒙系统进度条 UI 组件三方库提供 Material / Smooth 双风格、圆形 水平两种形态的自定义进度条。本文作为progress-bar-cj API 速查手册带你一图看懂MaterialModel、ComMaterialModel、ComWheel三大核心类与MaterialProgressStyle枚举的全部接口鸿蒙仓颉开发者收藏这一篇就够了。 组件全景4 种进度条形态一个组件全搞定MaterialProgressBar是库的总入口组件构造时传入风格和配置模型两个参数即可切换以下 4 种形态风格枚举形态适用场景MaterialCircularMaterial 圆形进度轮加载状态、环形仪表MaterialHorizontalMaterial 水平进度柱下载进度、任务进度SmoothCircularSmooth 圆形进度轮平滑过渡动画效果SmoothHorizontalSmooth 水平进度柱平滑过渡动画效果枚举完整定义见 material_progress_style.cj。 MaterialModel水平柱与 Material 圆形的总控开关MaterialModel是MaterialProgressBar的配置模型类带Observed状态监听源码见 material_progress_bar.cj。全部 setter 接口按功能分组如下颜色与背景接口参数类型作用setColorUInt32设置进度条主色setColorsArrayUInt32设置多色数组彩色进度条setSecondColorUInt32设置第二进度条颜色setBgColorUInt32设置背景轨道颜色setShowProgressBackgroundBool一键显示/隐藏背景轨道setIsGradientsBool开启渐变效果进度与几何接口参数类型作用setProgressFloat64设置主进度值默认 30.0setSecondProgressFloat64设置第二进度值setAngleFloat64设置角度setRadiusFloat64设置圆形进度轮半径默认 50.0setStrokeWidthFloat64设置描边宽度默认 8.0动画与特效接口参数类型作用setIndeterminateBool开启不确定模式无限滚动动画setIndeterminateAngleBool开启不确定角度摆动效果setSpeedFloat64设置动画速度默认 1.5setCurveCurve设置动画曲线默认Curve.LinearsetIsStopBool停止动画setIsReversedBool反转方向setIsMirrorBool镜像效果setIsPocketBool凹陷样式开关分割与风格接口参数类型作用setStyleMaterialProgressStyle切换 4 种进度条形态setSeparatorLengthFloat64设置分割段长度setSectionsCountInt64设置分割次数默认 4setHorizontalLengthFloat64设置水平柱长度setProgressInitFloat64设置初始进度值 ComMaterialModel ComWheel进度轮专属 API想要轮圈 旋转动画 百分比文字的精致进度轮用独立组件ComWheel源码见 com_wheel.cj。它内部持有配置模型ComMaterialModel接口分为三组外观设置接口参数类型作用setCircleRadiusFloat64进度轮半径默认 30.0setBarColorUInt32画笔进度弧颜色setRimColorUInt32外轮圈颜色setBarWidthFloat64进度弧宽度默认 5.0setRimWidthFloat64轮圈宽度默认 5.0setSpinSpeedFloat64旋转速度默认 230.0进度控制接口参数类型作用setProgressFloat64设置目标进度0.0 ~ 1.0带缓动动画setInstantProgressFloat64立即跳到指定进度无动画setLinearProgressBool切换线性/缓动插值模式getProgress-获取当前进度文本resetCount-进度清零旋转控制接口参数类型作用setSpinningBool开启/关闭旋转动画spin-启动旋转stopSpinning-停止旋转并清零spinning-查询是否正在旋转init_data-初始化轮圈路径与动画定时器closeTimer-取消动画定时器组件销毁时自动调用 其他通用类一眼扫完类位置说明MaterialProgressBarmaterial_progress_bar.cj总入口组件按 style 自动分发 4 个子组件MaterialProgressStylematerial_progress_style.cj4 种风格枚举支持/!比较ProgressBar接口progress_bar.cj定义setProgress/getProgress/setMaxProgress/getMaxProgress四个契约方法CircularComponentcircular_component.cj圆形进度属性载体bgColor、color、strokeWidth、progress、progressMax、angle等字段HorizontalComponenthorizontal_component.cj水平进度属性载体字段与圆形一致并增加偏移量mOffset 快速上手三步接入进度条组件引入依赖将progressbar模块拷贝到工程在oh-package.json5的 dependencies 中添加progressbar: file:../progressbar并在cjpm.toml中配置路径依赖详细步骤见 README.md。导入包在页面文件中import progressbar.*。配置并声明组件在aboutToAppear中配置MaterialModel在build中声明组件。最小示例var frameworkModel: MaterialModel MaterialModel() this.frameworkModel.setStyle(MaterialProgressStyle.MaterialHorizontal) this.frameworkModel.setProgress(30.0) this.frameworkModel.setColor(0x009688) // build 中声明 MaterialProgressBar(style: MaterialProgressStyle.MaterialHorizontal, modelBuild: this.frameworkModel)完整可运行示例见 material_progress_bar_sample.cj其中演示了彩色进度、Tinted 染色、不确定模式、工具栏进度条等多种玩法。 常用文档路径速查API 特性文档doc/feature_api.md组件库源码目录progressbar/src/main/cangjie/src/示例入口页entry/src/main/cangjie/src/index.cj演示图片资源doc/assets/小结记住总控用MaterialModel、进度轮用ComWheelComMaterialModel、风格切换用MaterialProgressStyle这一条主线progress-bar-cj 的全部接口就尽在掌握动手试试吧【免费下载链接】progress-bar-cj自定义进度条归一化UI组件项目地址: https://gitcode.com/Cangjie-TPC/progress-bar-cj创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考