合宙Air724UG LuatOS-Air LVGL API控件-滑动条 (Slider)

news2024/11/27 8:29:31

滑动条 (Slider)

slider.png


滑动条看起来和进度条是有些是有些像,但不同的是滑动条可以进行数值选择。

示例代码

-- 回调函数
slider_event_cb = function(obj, event)
    if event == lvgl.EVENT_VALUE_CHANGED then 
        local val = (lvgl.slider_get_value(obj) or "0").."%"
        lvgl.label_set_text(slider_label, val)
        lvgl.obj_align(slider_label, obj, lvgl.ALIGN_OUT_BOTTOM_MID, 0, 10)
    end
end

-- 创建滑动条
slider = lvgl.slider_create(lvgl.scr_act(), nil)
lvgl.obj_align(slider, nil, lvgl.ALIGN_CENTER, 0, 0)
lvgl.obj_set_event_cb(slider, slider_event_cb)

-- 创建标签
slider_label = lvgl.label_create(lvgl.scr_act(), nil)
lvgl.label_set_text(slider_label, "0%")
lvgl.obj_align(slider_label, slider, lvgl.ALIGN_OUT_BOTTOM_MID, 0, 10)

创建

滑动条是通过 lvgl.slider_create 函数创建的。

slider = lvgl.slider_create(lvgl.scr_act(), nil)

滑动条创建完之后设置显示位置就可以进行操作了。

jdfw3.gif

设置数值

滑动条的使用和 Bar 还是很像的。可以设置数值 lvgl.slider_set_value,也可以设置显示范围。 lvgl.slider_set_range

lvgl.slider_set_range(slider, 100, 200)
lvgl.slider_set_value(slider, 150, lvgl.ANIM_OFF)

设置数值.png

类型

滑动条可以设置类型,除了普通的单个旋钮外,也可以设置两个旋钮,起始位置和结束位置各一个,两个位置的旋钮都可以滑动。滑动条类型是通过函数 lvgl.slider_set_type 设置的,可以选择的类型有:

lvgl.SLIDER_TYPE_NORMAL -- 普通的默认类型
lvgl.SLIDER_TYPE_RANGE  -- 滑动条可以有两个旋钮

下面我们来看下两个旋钮的滑动条。

lvgl.slider_set_type(slider, lvgl.SLIDER_TYPE_RANGE)

jdfw.gif

事件

通过对滑动条设置回调函数,我们可以获取滑动条设置的数值,滑动条本身就是个输入控件。

-- 回调函数
slider_event_cb = function(obj, event)
    if event == lvgl.EVENT_VALUE_CHANGED then 
        local val = (lvgl.slider_get_value(obj) or "0").."%"
        lvgl.label_set_text(slider_label, val)
        lvgl.obj_align(slider_label, obj, lvgl.ALIGN_OUT_BOTTOM_MID, 0, 10)
    end
end

-- 创建滑动条
slider = lvgl.slider_create(lvgl.scr_act())
lvgl.obj_align(slider, nil, lvgl.ALIGN_CENTER, 0, 0)
lvgl.obj_set_event_cb(slider, slider_event_cb)

-- 创建标签
slider_label = lvgl.label_create(lvgl.scr_act(), nil)
lvgl.label_set_text(slider_label, "0%")
lvgl.obj_align(slider_label, slider, lvgl.ALIGN_OUT_BOTTOM_MID, 0, 10)

在这里,我们对滑动条设置了一个回调函数,监听数值改变事件。同时,我们添加了一个标签,用来显示滑动条的数值。显示效果如下:

jdfw4.gif

API

lvgl.slider_create

调用lvgl.slider_create(par, copy)
功能创建一个滑动条对象
返回指向滑动条对象的指针
参数
par指向对象的指针, 它将是新键对象的父对象
copy指向滑动条对象的指针, 如果不为 nil, 则将从其复制新对象

lvgl.slider_set_value

调用lvgl.slider_set_value(slider, val, anim)
功能设置滑动条的数值
参数
slider指向滑动条对象的指针
val滑动条的新数值
animlvgl.ANIM_ON 用动画设置值。lvgl.ANIM_OFF 立即更改值

lvgl.slider_set_type

调用lvgl.slider_set_type(slider, type)
功能设置滑动条的类型
参数
slider指向滑动条对象的指针
type滑动条的类型 lvgl.SLIDER_TYPE_RANGE 或 lvgl.SLIDER_TYPE_NORMAL

lvgl.slider_set_range

调用lvgl.slider_set_range(slider, min, max)
功能设置滑动条的最小值和最大值
参数
slider指向滑动条对象的指针
min最小值
max最大值

lvgl.slider_set_anim_time

调用lvgl.slider_set_anim_time(slider, anim_time)
功能设置滑动条的动画时间
参数
slider指向滑动条对象的指针
anim_time动画时间(以毫秒为单位)。

lvgl.slider_get_value

调用lvgl.slider_get_value(slider)
功能获取滑动条的设置值
返回滑动条的设置值
参数
slider指向滑动条对象的指针

lvgl.slider_get_left_value

调用lvgl.slider_get_left_value(slider)
功能获取滑动条的左值
返回滑动条的左值
参数
slider指向滑动条对象的指针

lvgl.slider_get_min_value

调用lvgl.slider_get_min_value(slider)
功能获取滑动条的最小值
返回滑动条的最小值
参数
slider指向滑动条对象的指针

lvgl.slider_get_max_value

调用lvgl.slider_get_max_value(slider)
功能获取滑动条的最大值
返回滑动条的最大值
参数
slider指向滑动条对象的指针

lvgl.slider_is_dragged

调用lvgl.slider_is_dragged(slider)
功能判断忽快是否被拖动
返回true 在被拖动, false 没有被拖动
参数
slider指向滑动条对象的指针

lvgl.slider_get_anim_time

调用lvgl.slider_get_anim_time(slider, time)
功能获取滑块设置的动画时间
返回滑块的动画时间
参数
slider指向滑动条对象的指针

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

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

相关文章

手写bind方法

<script>/** 手写bind方法* */Function.prototype.myBind function (thisArg, ...args) {return (...newArgs) > {return this.call(thisArg, ...args, ...newArgs)}}const obj {name: zs,age: 18,}function fn (a, b, c) {console.log(this)console.log(a b c)re…

《数据出境安全评估办法》解读

一、数据出境的统一评估体系正式确立 自我国《网络安全法》规定了关键信息基础设施运营者的重要数据与个人信息出境评估制度后&#xff0c;至今历时五年&#xff0c;关于数据出境及个人信息出境安全评估的立法体例、评估机制一直在探索过程中。 其后&#xff0c;国家互联网信…

PYTHON知识点学习-字典

&#x1f308;write in front&#x1f308; &#x1f9f8;大家好&#xff0c;我是Aileen&#x1f9f8;.希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流. &#x1f194;本文由 Aileen_0v0&#x1f9f8; 原创 CSDN首发&#x1f412; 如…

java IO流(三) 转换流 打印流

转换流 前面我们学习过FileReader读取文件中的字符&#xff0c;但是FileReader默认只能读取UTF-8编码格式的文件。如果使用FileReader读取GBK格式的文件&#xff0c;可能存在乱码&#xff0c;因为FileReader遇到汉字默认是按照3个字节来读取的&#xff0c;而GBK格式的文件一个…

如何写一个sh脚本将一个本地文件通过 scp命令上传到远程的 centos服务器?

如何写一个sh脚本将一个本地文件通过 scp命令上传到远程的 centos服务器&#xff1f; 1.1 背景需求1.2 解决方案1.3 附录1.3.1 scp命令用法与示例1.3.1.1 scp命令用法与解释1.3.1.2 scp 命令用法示例1.3.1.2.1 示例一&#xff1a;从本地复制文件到远程计算机1.3.1.2.2 示例二&a…

Sqlserver 在 SELECT 语句中显示来自 GROUP BY 子句中未涉及的列

在SQL Server中&#xff0c;如果您在GROUP BY子句中对某些列进行了分组&#xff0c;但想在SELECT语句中同时显示未涉及到的其他列&#xff0c;您可以使用聚合函数和子查询的方法来实现。这可以通过在GROUP BY子查询中获取需要的聚合值&#xff0c;并在外部查询中选择其他列来完…

Java复习-20-接口(3)- 代理设计模式

代理设计模式(Proxy) 功能&#xff1a;可以帮助用户将所有的开发注意力只集中在核心业务功能的处理上。 代理模式(Proxy Pattern)是一种结构性模式。代理模式为一个对象提供了一个替身&#xff0c;以控制对这个对象的访问。即通过代理对象访问目标目标对象&#xff0c;可以在目…

复旦-华盛顿EMBA:走近亿咖通科技,探寻汽车智能化的科创“密码”

6月20日&#xff0c;应复旦大学-华盛顿大学EMBA项目18班校友周靖的邀请&#xff0c;项目校友参访了科创企业ECARX亿咖通科技。作为该公司资深副总裁、中国首席财务官&#xff0c;周靖带领大家通过产品演示、实车驾驶和交流对话探寻汽车智能化的科创“密码”&#xff0c;近距离感…

1.初识爬虫

爬虫是批量模拟网络请求的程序&#xff0c;想百度谷歌这种搜索类网站本质上就是爬虫 使用爬虫的时候不应该对别人的网站有严重的影响&#xff0c;比如你爬的频率太高了&#xff0c;让人家的网站崩溃了。不应该爬取网页上显示不到的内容&#xff0c;比如有一个直播的网站&#…

【SLAM】G2O优化库超详细解析

G2O&#xff0c;与ceres并列为目前视觉SLAM中应用最广泛的优化算法库。它最大的特点就是基于图优化设计&#xff0c;这对于视觉SLAM来说是异常适配的。在很多的SLAM库的中都使用到它来进行优化操作&#xff0c;比如ORB-SLAM。 代码仓库&#xff1a;https://github.com/RainerK…

渗透测试漏洞原理之---【不安全的反序列化】

文章目录 1、序列化与反序列化1.1、引入1.2、序列化实例1.2.1、定义一个类1.2.2、创建 对象1.2.3、反序列化1.2.4、对象注入 2、漏洞何在2.1、漏洞触发2.1.2、定义一个类2.1.3、定义一个对象2.1.3、反序列化执行代码 2.2 为什么会这样 3、反序列化漏洞攻防3.1、PHP反序列化实例…

[杂谈]-快速了解LoRaWAN网络以及工作原理

快速了解LoRaWAN网络以及工作原理 文章目录 快速了解LoRaWAN网络以及工作原理1、LoRaWAN网络元素1.1 终端设备&#xff08;End Devices&#xff09;1.2 网关&#xff08;Gateways&#xff09;1.3 网络服务器&#xff08;Net Server&#xff09;1.4 应用服务器&#xff08;Appli…

计算机网络的故事——确认访问用户身份的认证

确认访问用户身份的认证 HTTP使用的认证方式&#xff1a;BASIC认证&#xff08;基本认证&#xff09;、DIGEST&#xff08;摘要认证&#xff09;、SSL客户端认证、FormBase认证&#xff08;基于表单认证&#xff09;。 基于表单的认证&#xff1a;涉及到session管理以及cookie…

Mock 基本使用

mock解决的问题 开发时&#xff0c;后端还没完成数据输出&#xff0c;前端只好写静态模拟数据。数据太长了&#xff0c;将数据写在js文件里&#xff0c;完成后挨个改url。某些逻辑复杂的代码&#xff0c;加入或去除模拟数据时得小心翼翼。想要尽可能还原真实的数据&#xff0c…

【Springcloud】Sentinel熔断和降级

【Springcloud】Sentinel熔断和降级 【一】基本介绍【1】什么是熔断和降级【2】为什么使用熔断和降级【3】Sentinel熔断和降级【4】核心概念 【二】下载方式【1】Windows平台安装包下载【2】打开控制台 【三】使用案例【1】添加依赖【2】添加Sentinel配置【3】添加TestUserCont…

网络类型+二层封装技术

一、网络类型分类 1、点到点网络 在一个网段中&#xff0c;只能部署两个节点&#xff08;两个IP&#xff09;&#xff0c;如GRE环境就属于虚拟的点到点网络类型&#xff0c;通常是串线连接。 如下图当前只存在两个节点&#xff0c;但并不是点到点&#xff0c;因为它中间网段…

简易版人脸识别qt opencv

1、配置文件.pro #------------------------------------------------- # # Project created by QtCreator 2023-09-05T19:00:36 # #-------------------------------------------------QT core guigreaterThan(QT_MAJOR_VERSION, 4): QT widgetsTARGET 01_face TEMP…

【trie树】CF Edu12 E

Problem - E - Codeforces 题意&#xff1a; 思路&#xff1a; 这其实是一个套路题 区间异或转化成前缀异或&#xff0c;然后枚举 i 对于每一个 i&#xff0c;ai ^ x k&#xff0c;对 x 计数 先建一棵字典树&#xff0c;然后在字典树上计数 先去对 > k 的部分计数&a…

m8130kt GPS模块测试

m8130kt GPS模块测试 ✨在某宝捡电子垃圾&#xff0c;10块钱的价格&#xff0c;就是没有资料可以提供的。上面携带有u-blox UBX-M8130-KT芯片&#xff0c;是肯定的&#xff0c;至于HMC5883芯片不确定&#xff0c;拆了屏蔽罩&#xff0c;芯片实在是太小&#xff0c;使用40倍放大…

SpringCloud实战项目(1)---创建空项目 jdk17

创建空项目 New ProjectAdd Jdk17创建空白标准Maven项目不要选择Create from archetype选项填写相关项目信息创建项目得到一个标准的maven项目&#xff0c;作为一个Parent project存在的&#xff0c;需删除src文件夹。 New Project 使用Idea, File -> New ->Project Add …