【HarmonyOS】鸿蒙开发之Slider组件——第3.5章

组件应用场景: 设备音量大小,调节屏幕亮度等需求

slider组件内options属性简介

value:滑动条当前进度值。
min:设置滑动条设置最小值。
max:设置滑动条设置最大值,默认为 100 。
step:设置滑动条滑动跳动值,当设置相应的 step 时,Slider为间歇滑动。
style:设置滑动条的滑块样式。
direction:设置滑动条滑动方向为水平或竖直方向。
reverse:设置滑动条取值范围是否反向。

代码实例:

Slider({value: 10,min: 0,max: 100,step: 1,style: SliderStyle.InSet,direction: Axis.Horizontal,//水平方向reverse: false}).width(260).height(60).backgroundColor(Color.Yellow)

slider组件属性简介

blockColor:设置滑块的颜色。
trackColor:设置滑轨的背景颜色。
selectedColor:设置滑轨的已滑动颜色。
showSteps:设置当前是否显示步长刻度值。
showTips:设置滑动时是否显示气泡提示百分比。
trackThickness:设置滑动条粗细。

代码实例:

Slider({value: 10,min: 0,max: 100,step: 1,style: SliderStyle.InSet,direction: Axis.Horizontal,//水平方向reverse: false}).width(260).height(60).backgroundColor(Color.Orange).blockColor(Color.Red)    // 设置滑块颜色.trackColor(Color.Pink)   // 设置滑轨颜色.selectedColor(Color.Red) // 设置滑轨的已滑动颜色.showSteps(true)          // 设置显示步长.showTips(true)           // 设置显示进度.trackThickness(5)        // 设置滚动条宽度

slider组件事件介绍

onChange:滑动条滑动时触发事件回调,value 表示当前进度值;mode 表示滑动条的拖动状态(但是实例中无效果),SliderChangeMode 定义了以下 3 种类型:

Begin:用户开始拖动滑块。
Moving:用户拖动滑块中。
End:用户结束拖动滑块。

代码实例:

Slider({value: 10,min: 0,max: 100,step: 1,style: SliderStyle.InSet,direction: Axis.Horizontal,//水平方向reverse: false}).width(260).height(60).backgroundColor(Color.Brown).blockColor(Color.Red)    // 设置滑块颜色.trackColor(Color.Pink)   // 设置滑轨颜色.selectedColor(Color.Red) // 设置滑轨的已滑动颜色.showSteps(true)          // 设置显示步长.showTips(true)           // 设置显示进度.trackThickness(5)        // 设置滚动条宽度.onChange((value: number, mode: SliderChangeMode) => {console.log("当前值:"+value)})

运行结果:

在这里插入图片描述

注意:Slider 组件支持的通用事件只有 onAppear() 和 onDisAppear() 这俩方法。

踩坑不易,还希望各位大佬支持一下 \textcolor{gray}{踩坑不易,还希望各位大佬支持一下} 踩坑不易,还希望各位大佬支持一下

📃 个人主页: \textcolor{green}{个人主页:} 个人主页: 沉默小管

📃 个人网站: \textcolor{green}{个人网站:} 个人网站: 沉默小管

📃 个人导航网站: \textcolor{green}{个人导航网站:} 个人导航网站: 沉默小管导航网

📃 我的开源项目: \textcolor{green}{我的开源项目:} 我的开源项目: vueCms.cn

🔥 技术交流 Q Q 群: 837051545 \textcolor{green}{技术交流QQ群:837051545} 技术交流QQ群:837051545

👍 点赞,你的认可是我创作的动力! \textcolor{green}{点赞,你的认可是我创作的动力!} 点赞,你的认可是我创作的动力!

⭐️ 收藏,你的青睐是我努力的方向! \textcolor{green}{收藏,你的青睐是我努力的方向!} 收藏,你的青睐是我努力的方向!

✏️ 评论,你的意见是我进步的财富! \textcolor{green}{评论,你的意见是我进步的财富!} 评论,你的意见是我进步的财富!

如果有不懂可以留言,我看到了应该会回复
如有错误,请多多指教

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python从进阶到高级—通俗易懂版

Python从进阶到高级—通俗易懂版 # # Author : Mikigo # Time : 2021/12/23 # 一、简介 Python 进阶是我一直很想写的,作为自己学习的记录,过去自己在看一些代码的时候经常会困惑,看不懂,然后自己去查资料、看书籍&#xff0…

JAVA之HashMap详解

HashMap 1. 设计原理 HashMap 基于哈希表的 Map 接口实现,是以 key-value 存储形式存在,即主要用来存放键值对。HashMap 的实现不是同步的,这意味着它不是线程安全的。它的 key、value 都可以为 null,此外,HashMap 中…

appium实现自动化测试原理

目录 1、Appium原理 1.1、Android Appium原理图文解析 1.1.2、原理详解 1.1.2.1、脚本端 1.1.2.2、appium-server 1.1.2.3、中间件bootstrap.jar 1.1.2.4、驱动引擎uiautomator 1.2、 IOS Appium原理 1、Appium原理 1.1、Android Appium原理图文解析 执行测试脚本全过…

C#,二进制数的按位交换(Bits swap)的算法与源代码

数字在指定位置指定位数的交换是常见算法。 1 源程序 using System; using System.Text; using System.Collections; using System.Collections.Generic; namespace Legalsoft.Truffer.Algorithm { public static partial class Algorithm_Gallery { /// <…

专业140+总分420+南京信息工程大学811信号与系统考研经验南信大电子信息与通信工程,真题,大纲,参考书

今年顺利被南信大电子信息录取&#xff0c;初试420&#xff0c;专业811信号与系统140&#xff08;Jenny老师辅导班上140很多&#xff0c;真是大佬云集&#xff09;&#xff0c;今年应该是南信大电子信息最卷的一年&#xff0c;复试线比往年提高了很多&#xff0c;录取平均分380…

扭蛋机小程序开发:发展优势

商场中精美的扭蛋机一直都是年轻人的心头好&#xff0c;目前&#xff0c;扭蛋机商品也不在局限于各种小型玩具&#xff0c;也逐渐与各类热门IP合作&#xff0c;打造出了各类手办、周边等&#xff0c;深受各个年龄层的喜爱。 如今&#xff0c;扭蛋机在互联网的推动下&#xff0…

算法的基本概念

设么是算法&#xff1f; 什么是好的算法/ 什么是算法&#xff1a; 量水的问题&#xff1a; 方案如下&#xff1a;&#xff08;核心思路就是两个桶差值为2&#xff0c;两次差值为4&#xff0c;7-(5-4) 6&#xff09; 算法&#xff1a;准确描述的 “操作步骤 (问题求解步骤)”&…

数据结构中图的概念以及遍历算法的实现

在数据结构中&#xff0c;图&#xff08;Graph&#xff09;是由节点&#xff08;Vertex&#xff09;和连接节点的边&#xff08;Edge&#xff09;组成的一种非线性数据结构。图可以用来表示各种实际问题中的关系和连接&#xff0c;如社交网络、道路网络、电路等。 图由两个主要…

2023年全球架构师峰会(ArchSummit北京站2023):核心内容与学习收获(附大会核心PPT下载)

本次峰会是一场集结了全球顶级技术专家和行业领袖的盛会。作为一年一度的重要技术交流活动&#xff0c;本次峰会聚焦当前及未来软件架构的发展趋势、技术挑战与创新实践&#xff0c;旨在为参会者提供一个深度交流、学习与合作的平台。在为期两天的会议中&#xff0c;与会者不仅…

SQL Developer 小贴士:Unshared Worksheet

在Oracle SQL Developer中&#xff0c;最常用的功能应该是SQL Worksheet&#xff0c;或Worksheet。 可以创建两类Worksheet&#xff0c;即Worksheet和Unshared Worksheets。前者是共享数据库连接的&#xff0c;后者会单独创建自己的连接。前者的快捷键是AltF10&#xff1b;后者…

ACK One:构建混合云同城容灾系统

作者&#xff1a;蔡靖 对于当前业务运行在 IDC 内的 Kubernetes 集群中&#xff0c;希望通过云计算为云下业务提供同城灾备的高可用冗余能力&#xff0c;可利用阿里云分布式云容器平台 ACK One [ 1] 来提供统一得流量、应用和集群管理&#xff0c;实现业务流量的多集群路由和灾…

学习Android的第十六天

目录 Android 自定义 Adapter Adapter 接口 SpinnerAdapter ListAdapter BaseAdapter 自定义 BaseAdapter 参考文档 Android ListView 列表控件 ListView 的属性和方法 表头表尾分割线的设置 列表从底部开始显示 android:stackFromBottom 设置点击颜色 cacheColorH…

【Linux】28、命令行参数 语法格式

文章目录 一、没有括号二、[]三、{}四、<>五、...六、|七、() 命令行参数很复杂&#xff0c;通过 --help 会看到很多符号&#xff0c;比如 [] {} () <> | …&#xff0c;他们都是什么意思呢&#xff1f;一般格式如下&#xff1a; 命令<必选参数1|必选参数2>…

【自然语言处理】:实验4布置,预训练语言模型实现与应用

清华大学驭风计划 因为篇幅原因实验答案分开上传&#xff0c;自然语言处理专栏持续更新中&#xff0c;期待的小伙伴敬请关注 有任何疑问或者问题&#xff0c;也欢迎私信博主&#xff0c;大家可以相互讨论交流哟~~ 案例简介 2018年&#xff0c;Google提出了预训练语言模型BE…

基于PSO优化的GRU多输入时序回归预测(Matlab)粒子群优化门控循环单元神经网络时序回归预测

目录 一、程序及算法内容介绍&#xff1a; 基本内容&#xff1a; 亮点与优势&#xff1a; 二、实际运行效果&#xff1a; 三、部分程序&#xff1a; 四、完整代码数据分享下载&#xff1a; 一、程序及算法内容介绍&#xff1a; 基本内容&#xff1a; 本代码基于Matlab平台…

扩展语音识别系统:增强功能与多语言支持

一、引言 在之前的博客中&#xff0c;我们成功构建了一个基于LibriSpeech数据集的英文语音识别系统。现在&#xff0c;我们将对系统进行扩展&#xff0c;增加一些增强功能&#xff0c;并尝试支持多语言识别。 二、增加增强功能 语音合成 --除了语音识别&#xff0c;我们还可以…

文物保护系统守护历史岁月,成都青铜展科技闪耀

一、“吉金万里-中国西南青铜文明展”隆重开幕 1月27日&#xff0c;“吉金万里-中国西南青铜文明展”在成都金沙遗址博物馆向公众开放&#xff0c;奉上一场精彩的青铜文明“盛宴”。本次展览汇集了中国西南地区32家文博单位&#xff0c;以青铜器为代表的294件经典文物&#xf…

OBD部署OceanBase集群-配置文件方式

前一篇文章介绍了OBD白屏可视化方式部署OceanBase集群 &#xff0c;其原理是把可视化设置生成为一个配置文件&#xff0c;然后使用OBD命令部署集群 本篇想使用命令行加配置文件方式&#xff0c;只部署OceanBase和ODProxy两个组件 服务器参数配置和 oceanbase-all-in-one-*.ta…

LeetCode 0589.N 叉树的前序遍历:深度优先搜索(DFS)

【LetMeFly】589.N 叉树的前序遍历&#xff1a;深度优先搜索(DFS) 力扣题目链接&#xff1a;https://leetcode.cn/problems/n-ary-tree-preorder-traversal/ 给定一个 n 叉树的根节点 root &#xff0c;返回 其节点值的 前序遍历 。 n 叉树 在输入中按层序遍历进行序列化表…

及其详细的Markdown基础-学习笔记(附有使用案例)

Markdown 基础语法 查看更多学习笔记&#xff1a;GitHub&#xff1a;LoveEmiliaForever 标题创建 标题语法格式 在文字前添加一至六个#即可创建标题 标题是有等级的&#xff0c;具体等级根据#个数决定 由于标题等级参与构建整篇文章的架构&#xff0c;编写时应该遵循如下规…