当前位置: 首页 > article >正文

HarmonyOS:Counter计数器组件

一、概述

计数器组件,提供相应的增加或者减少的计数操作。

说明
该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。

二、属性

除支持通用属性外,还支持以下属性。

enableInc
enableInc(value: boolean)

设置增加按钮禁用或使能。

元服务API: 从API version 11开始,该接口支持在元服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
valueboolean增加按钮禁用或使能。
默认值:true,true表示可以增加按钮,false表示禁止增加按钮。

enableDec
enableDec(value: boolean)

设置减少按钮禁用或使能。

元服务API: 从API version 11开始,该接口支持在元服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名类型必填说明
valueboolean减少按钮禁用或使能。
默认值:true,true表示可以减少按钮,false表示禁止减少按钮。

三、事件

除支持通用事件外,还支持以下事件:

onInc
onInc(event: () => void)

监听数值增加事件。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

元服务API: 从API version 11开始,该接口支持在元服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

onDec
onDec(event: () => void)

监听数值减少事件。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

元服务API: 从API version 11开始,该接口支持在元服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

四、示例

示例效果图

在这里插入图片描述

示例代码
TestCounter.ets

@Entry
@Component
struct TestCounter {@State message: string = '计数器组件';@State value: number = 0;build() {Column({ space: 10 }) {Text('禁用计数器组件的增加和减少按钮').id('TestCounterHelloWorld').fontSize(20).fontWeight(FontWeight.Bold).margin({ top: 20 })Counter() {Text(this.value.toString())}.enableDec(false).enableInc(false)Text(this.message).id('TestCounterHelloWorld').fontSize(20).fontWeight(FontWeight.Bold).margin({ top: 20 })Counter() {Text(this.value.toString())}.onInc(() => {this.value++console.log(`点击了 增加按钮 this.value = ${this.value}`);}).onDec(() => {this.value--console.log(`点击了 减少按钮 this.value = ${this.value}`);})}.height('100%').width('100%')}
}
http://www.lryc.cn/news/2403903.html

相关文章:

  • 数据类型 -- 字符
  • WordZero:让Markdown与Word文档自由转换的Golang利器
  • sqlsugar WhereIF条件的大于等于和等于查出来的坑
  • Pandas 技术解析:从数据结构到应用场景的深度探索
  • 数据库系统概论(十七)超详细讲解数据库规范化与五大范式(从函数依赖到多值依赖,再到五大范式,附带例题,表格,知识图谱对比带你一步步掌握)
  • [c#]判定当前软件是否用管理员权限打开
  • 并发编程实战(生产者消费者模型)
  • 分布式微服务系统架构第144集:FastAPI全栈开发教育系统
  • el-tabs 切换时数据不更新的问题
  • git小乌龟不显示图标状态解决方案
  • 获取 OpenAI API Key
  • 【Android基础回顾】五:AMS(Activity Manager Service)
  • pycharm中提示C++ compiler not found -- please install a compiler
  • 类型别名与类型自动推导
  • 一站式直播工具:助力内容创作者高效开启直播新时代
  • 【学习笔记】Lamba表达式[匿名函数]
  • 学习笔记(26):线性代数-张量的降维求和,简单示例
  • 以智能管理为基础,楼宇自控打造建筑碳中和新路径
  • 81 实战一:给root目录扩容
  • 1130 - Host ‘xxx.x.xx.xxx‘is not allowed to connect to this MySQL server
  • HttpURLConnection实现
  • day029-Shell自动化编程-计算与while循环
  • Linux命令基础(2)
  • vue3 + vite实现动态路由,并进行vuex持久化设计
  • ThingsCloud事物云平台搭建-微信小程序
  • 为什么 uni-app 开发的 App 没有明显出现屏幕适配问题Flutter 开发的 App 出现了屏幕适配问题
  • 学习路之php--性能优化
  • GC1808:高性能24位立体声音频ADC芯片解析
  • echarts使用graph、lines实现拓扑,可以拖动增加effect效果
  • 产品经理课程(九)