【鸿蒙HarmonyOS开发笔记】常用组件介绍篇 —— Progress进度条组件

概述

Progress为进度条组件,用于显示各种进度。

参数

Progress组件的参数定义如下

Progress(options: {value: number, total?: number, type?: ProgressType})

value

value属性用于设置当前进度值。

total

total属性用于设置总值。

type

type属性用于设置进度条类型,可通过ProgressType枚举类型进行设置,可选的枚举值如下

ProgressType.Linear : 线性样式
在这里插入图片描述

ProgressType.Ring : 环形无刻度样式
在这里插入图片描述

ProgressType.Eclipse : 月食样式
在这里插入图片描述

ProgressType.ScaleRing : 环形有刻度样式
在这里插入图片描述

ProgressType.Capsule : 胶囊样式
在这里插入图片描述
胶囊样式如果高比宽大的话进度条会立起来,如果不设宽高会和月食样式相近


常用属性

进度条样式

可通过style()调整进度条的样式,例如进度条的宽度,该方法的参数类型定义如下

style({strokeWidth?: string|number|Resource,scaleCount?: number,scaleWidth?: string|number|Resource})

strokeWidth
strokeWidth属性用于设置进度条的宽度,默认值为4vp。该属性可用于Linear、Ring、ScaleRing三种类型,效果如下
在这里插入图片描述
scaleCount
scaleCount属性用于设置ScaleRing的刻度数,默认值为120。效果如下
在这里插入图片描述
scaleWidth
scaleCount属性用于设置ScaleRing的刻度线的宽度,默认值为2vp。效果如下
在这里插入图片描述

进度条颜色

进度条的颜色可通过color()backgroundColor()方法进行设置,其中color()用于设置前景色,backgroundColor()用于设置背景色,例如
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/466406.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

加拿大光量子计算公司Xanadu入局英国多企业量子合作计划

内容来源:量子前哨(ID:Qforepost) 编辑丨慕一 编译/排版丨沛贤 深度好文:1200字丨8分钟阅读 英国航空发动机制造商罗尔斯罗伊斯(Rolls-Royce)、英国量子计算公司Riverlane和加拿大量子计算公…

【赠书】从深度学习到图神经网络:模型与实践

文章目录 赠书:《从深度学习到图神经网络:模型与实践》一、编辑推荐二、内容简介三、作者简介张玉宏杨铁军 四、精彩书评五、目录第1章 图上的深度学习 11.1 人工智能与深度学习 21.2 图神经网络时代的来临 61.3 图数据处理面临的挑战 91.4 图神经网络的…

AS-V1000视频监控平台如何加强系统安全,满足等保2.0规范要求

目 录 一、概述 (一)信息安全技术网络安全等级保护标准 (二)解读 1、等级保护工作的内容 2、等级保护的等级划分 3、不同等级的安全保护能力 第一级安全保护能力 第二级安全保护能力 第三级安全保护能力 第…

电子科技大学链时代工作室招新题C语言部分---题号D

1. 题目 这道题大概的意思就是对一个整形数组的元素进行排序,然后按新的顺序打印原本的下标; 例如,在题目给出的Note部分,{a1, a2, a3, a4, a5}进行排序之后变为了{a2, a1, a4, a3, a5},于是输出2 1 4 3 5。 排序的规则…

MyBatisPlus中MetaObjectHandler的使用

系列文章目录 文章目录 系列文章目录前言前言 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站,这篇文章男女通用,看懂了就去分享给你的码吧。 起因是公司一个同事接到需求,让把一条数据录入时createTime字段,设置为…

DM数据库(docker)

docker安装 安装必要的系统工具 yum install -y yum-utils device-mapper-persistent-data lvm2 配置阿里云Docker Yum源: yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo 更新yum缓存 yum makecache fast 安装docker-CE: y…

抛弃Superhuman?这些替代方案让你眼前一亮!

Superhuman是一个极好的人工智能工具在电子邮件助理领域。根据SimilarWeb的最新统计,它在全球网站排名中排名第21980位,月访问量为1751798。然而市场上还有许多其他优秀的选择。为了帮助您找到最适合您需求的解决方案,我们为您精心挑选了10种…

海淘注意事项,海淘虚拟卡

2024年海淘visa信用卡,点击获取卡片 海淘注意事项 海淘(跨境购物)可以让人们在国外购买到更多种类的商品,但是也需要注意一些事项,以确保购物的顺利进行和商品的质量。以下是一些建议: 海淘网站的选择&…

零代码编程:用kimichat合并一个文件夹下的多个文件

一个文件夹里面有很多个srt字幕文件,如何借助kimichat来自动批量合并呢? 在kimichat对话框中输入提示词: 你是一个Python编程专家,完成如下的编程任务: 这个文件夹:D:\downloads\life.on.our.planet.(202…

C++中的using关键字

1. 类型别名 using关键字可以用来为类型创建一个新的名字,这在代码的可读性和维护性方面非常有帮助。 // 定义类型别名 using IntPtr int*;// 使用 int value 5; IntPtr ptr &value;2. 命名空间别名 如果你正在使用一个非常长的命名空间,可以使…

如何在MT4平台查询自己的账户杠杆?

如何在MT4平台查询自己的账户杠杆?MT4中直接没有这个选项,犟嘴的投资者千万不要犟嘴,说可以根据保证金水平计算。其实在交易账户中有3中方法可以查询自己的账户,投资者可以在这里开立一个MT4帐户,并将其附加到具有登录名和密码的…

Jenkins-pipeline流水线构建完钉钉通知

添加钉钉机器人 在钉钉群设置里添加机器人拿出Webhook地址,设置关键词 Jenkins安装钉钉插件 Dashboard > 系统管理 > 插件管理,搜索构建通知,直接搜索Ding Talk也行 安装DingTalk插件,重启Jenkins 来到Dashboard > 系…

想要了解更多商品信息?淘宝天猫详情接口API助你一键搞定!

想要了解更多商品信息?淘宝天猫详情接口API是你的理想选择!作为唯一提供官方商品数据的接口,它能够帮助你快速获取商品的多种详细信息,联讯数据让你在购物过程中做出更明智的决策。 简介:淘宝天猫详情接口API的功能及…

普通人搞副业,空闲时间做,月入5w+

我是电商珠珠 大家会发现,朱砂越来越火,不仅是因为它好看,而且商家对外扬言可以招财。现在的人对爱情不屑一顾,财神殿里可以长跪不起,人人都想求财,想要在空余时间搞副业赚大钱,但做什么还没有…

客服知识库到底好用在哪?企业真的需要吗?

在企业运营的众多环节中,客户服务无疑是至关重要的一环。然而,面对如洪水般涌入的客户问题和查询,你的客服团队是否能够做到快速应对,准确解答?这时,一个客服知识库就显得尤为重要。那么,客服知…

Java项目实战记录:雷达数据渲染

目录 Java项目实战记录:雷达数据渲染业务背景代码逻辑数据结构颜色渲染MapContent加载数据并输出截图 完整代码GenerateMapImage地图渲染工具测试代码 渲染效果 Java项目实战记录:雷达数据渲染 业务背景 我之前已经成功使用Java语言解析了C处理的雷达数…

Linux编程4.8 网络编程-建立连接

1、服务器端 #include <sys/types.h> #include <sys/socket.h>int listen(int sockfd, int backlog);返回&#xff1a;成功返回0&#xff0c;出错返回-1。参数&#xff1a;sockfd:套接字的文件描述符backlog:定义了sockfd的挂起连接队列可能增长的最大长度。…

鸿蒙4.0ArkUI快速入门(一)应用模型

ArkUI篇 应用模型Stage模型FA模型模型对比 应用模型 应用模型是HarmonyOS为开发者提供的应用程序所需能力的抽象提炼&#xff0c;它提供了应用程序必备的组件和运行机制。 HarmonyOS先后提供了两种应用模型&#xff1a; FA&#xff08;Feature Ability&#xff09;模型&…

Vue多文件学习项目综合案例——小兔鲜,黑马vue教程

文章目录 一、项目截图二、主要知识点三、Main.js四、App.vue五、componentsXtxBanner.vueXtxFooter.vueXtxHeaderNav.vueXtxHotBrand.vueXtxNewGoods.vueXtxShortCut.vueXtxTopic.vue 六、stylesbase.csscommon.css 一、项目截图 二、主要知识点 把静态页面拆分成一个个vue组…

Axure软件安装汉化教程

Axure软件安装汉化教程 一、准备教程 下载Axure的软件&#xff0c;并解压打开 二、安装过程 双击Axure软件的运行程序&#xff0c;修改安装程序的路径&#xff0c;默认下一步即可。 三、软件汉化 打开Axure的软件安装路径&#xff0c;将汉化包复制粘贴进入到Axure RP 9安装…