嵌入式物联网智能硬件嵌入式GUI硬件开发【免费下载链接】HoloCubic带网络功能的伪全息透明显示桌面站项目地址https://gitcode.com/gh_mirrors/ho/HoloCubic点击查看免费下载本篇技术指南以 HoloCubic 开源仓库中 LVGL 模拟器VS2019 SDL2 工程的lv_ex_bar_1Simple Bar示例文档为核心系统讲解 LVGL v7 Bar 进度条控件的创建、取值、动画与样式原理。你将掌握lv_bar的完整 API 用法、动画状态机与绘制机制的源码级实现并学会如何在 LvglSimulator 模拟器工程 与 HoloCubic 固件 中直接运行和复用该示例为后续在伪全息桌面站界面上开发音量、电量、网络信号等进度类控件打下基础。lv_ex_bar_1 示例渲染结果320x240 模拟窗口屏幕中央一条填满的进度条一、示例文档与工程背景关联文档位于 3.Software/LvglSimulator/vs2019_proj/lv_examples/src/lv_ex_widgets/lv_ex_bar/index.rst属于 LVGL 官方示例体系lv_examples中lv_ex_widgets目录下的控件示例索引。文档本身极为精炼C 示例入口为lv_ex_widgets/lv_ex_bar/lv_ex_bar_1文档末尾的 MicroPython 小节标注 No examples yet。需要说明的是仓库中实际已经存在 MicroPython 版示例 lv_ex_bar_1.py可以推断该文档的 MicroPython 小节更新滞后于代码。下文将 C 与 MicroPython 两个版本一并展开。二、Simple Bar 示例C 语言版本逐行解析示例核心源码为 lv_ex_bar_1.c全文如下#include ../../../lv_examples.h #if LV_USE_BAR void lv_ex_bar_1(void) { lv_obj_t * bar1 lv_bar_create(lv_scr_act(), NULL); lv_obj_set_size(bar1, 200, 20); lv_obj_align(bar1, NULL, LV_ALIGN_CENTER, 0, 0); lv_bar_set_anim_time(bar1, 2000); lv_bar_set_value(bar1, 100, LV_ANIM_ON); } #endif逐行拆解条件编译#if LV_USE_BAR保证只有当 lv_conf.h 中LV_USE_BAR置 1 时才编译此示例模拟器工程中该宏位于lv_conf.h第 579 行值为 1。创建控件lv_bar_create(lv_scr_act(), NULL)以当前屏幕对象为父对象创建一个 Bar。第二个参数copy为NULL表示不复制已有 Bar而是新建默认实例。设置尺寸lv_obj_set_size(bar1, 200, 20)将 Bar 设为 200×20 像素宽大于高因此按 LVGL 规则渲染为水平方向进度条。居中对齐lv_obj_align(bar1, NULL, LV_ALIGN_CENTER, 0, 0)让 Bar 在屏幕上水平垂直居中偏移量为 0。动画时长lv_bar_set_anim_time(bar1, 2000)设定值变化动画时长为 2000 毫秒。动画式赋值lv_bar_set_value(bar1, 100, LV_ANIM_ON)将当前值设为 100并开启LV_ANIM_ON动画——Bar 会从初始值 0 平滑填充至 100%。该示例的函数声明注册在 lv_ex_widgets.h第 30 行源码文件lv_ex_bar_1.c已同时被加入 lvgl_similator.vcxproj第 355 行的编译列表因此直接可在 VS2019 工程中编译运行。三、MicroPython 版本对照仓库中实际存在的 lv_ex_bar_1.py 提供了 MicroPython 实现bar1 lv.bar(lv.scr_act()) bar1.set_size(200, 30) bar1.align(None, lv.ALIGN.CENTER, 0, 0) bar1.set_anim_time(1000) bar1.set_value(100, lv.ANIM.ON)与 C 版本逐一对齐lv.bar()对应lv_bar_createset_size/align/set_anim_time/set_value对应同名 C APIlv.ANIM.ON对应LV_ANIM_ON。仅尺寸高度30px与动画时长1000ms与 C 版本略有差异。该脚本适合在支持 LVGL MicroPython 绑定的环境如基于 ESP32 的 HoloCubic 派生固件中直接使用。四、lv_bar 核心 API 与参数语义从控件头文件 lv_bar.h 可以提取完整的公开 API这是实战中必须掌握的接口清单4.1 Setter 系列API参数说明关键点lv_bar_create(par, copy)par父对象copy复制源NULL为新建返回新建的 Bar 对象lv_bar_set_value(bar, value, anim)value新值anim取LV_ANIM_ON/LV_ANIM_OFF带动画时从当前值平滑过渡lv_bar_set_start_value(bar, start_value, anim)设置起始值配合 CUSTOM 类型绘制分段条非 CUSTOM 类型下内部强制为min_valuelv_bar_set_range(bar, min, max)设置数值范围默认范围 0100lv_bar_set_type(bar, type)LV_BAR_TYPE_NORMAL/LV_BAR_TYPE_SYMMETRICAL/LV_BAR_TYPE_CUSTOM决定绘制形态lv_bar_set_anim_time(bar, anim_time)动画时长单位毫秒默认 200ms4.2 Getter 系列lv_bar_get_value、lv_bar_get_start_value、lv_bar_get_min_value、lv_bar_get_max_value、lv_bar_get_type、lv_bar_get_anim_time分别读取对应属性。值得注意的实现细节lv_bar_get_value在动画进行中返回的是动画目标端值见lv_bar.c中LV_BAR_GET_ANIM_VALUE宏的定义而非实时中间值。4.3 三种类型type语义LV_BAR_TYPE_NORMAL从最小值方向填充示例lv_ex_bar_1即此形态LV_BAR_TYPE_SYMMETRICAL当min_value 0且max_value 0、start_value min_value时以零值点为对称轴向两侧填充适合正负双向数值展示LV_BAR_TYPE_CUSTOM同时尊重start_value与cur_value可绘制分段进度条。从 lv_api_map.h 还可以看到v7.0 中旧的lv_bar_set_sym()已标记为 deprecated并被lv_bar_set_type()取代说明 type 是当前版本的标准配置方式。五、源码级原理默认值、裁剪与动画状态机深入 lv_bar.c 可以印证示例行为背后的底层机制。5.1 创建时的默认属性lv_bar_create()第 76141 行初始化扩展数据lv_bar_ext_tmin_value 0、max_value 100、cur_value 0、start_value 0anim_time 200毫秒type LV_BAR_TYPE_NORMAL默认尺寸为LV_DPI * 2×LV_DPI / 10LV_DPI在lv_conf.h中为 130px故约 260×13 像素。这解释了为什么示例必须显式调用lv_obj_set_size与lv_bar_set_anim_time它们是针对默认值的定制。5.2 值域自动裁剪lv_bar_set_value()第 153172 行对传入值做硬性裁剪new_value value ext-max_value ? ext-max_value : value; new_value new_value ext-min_value ? ext-min_value : new_value;也就是说即使传入越界值也不会导致进度溢出控件始终把值钳制在[min_value, max_value]区间内。固件中的压力测试示例 lv_demo_stress.c第 181 行正是利用了这一特性故意向lv_bar_set_value传入 5000 这类越界值以验证鲁棒性。5.3 动画状态机lv_bar.h定义了三个动画状态常量LV_BAR_ANIM_STATE_START 0动画起点LV_BAR_ANIM_STATE_END 256动画终点用 256 便于位运算归一化LV_BAR_ANIM_STATE_NORM 8即 2^8LV_BAR_ANIM_STATE_INV -1无动画进行中的标记。动画执行路径集中在lv_bar_set_value_with_anim()第 721753 行当anim LV_ANIM_ON时先记录anim_start与anim_end删除旧动画再通过lv_anim_set_exec_cb(lv_bar_anim)与lv_anim_set_ready_cb(lv_bar_anim_ready)注册 LVGL 动画系统回调。每帧由lv_bar_anim更新anim_state并触发重绘动画结束后由lv_bar_anim_ready把anim_end写回真实值并置状态为LV_BAR_ANIM_STATE_INV。如果动画进行中再次调用set_value新动画会从上一动画的anim_end起算第 736739 行保证连续调值时的平滑衔接。5.4 绘制机制方向判定、对称模式与最小尺寸draw_indic()第 426635 行负责计算并绘制填充区方向判定bool hor objw objh宽高比决定水平/垂直方向对称模式type LV_BAR_TYPE_SYMMETRICAL min_value 0 max_value 0 start_value min_value时以零值点为锚点双向绘制最小尺寸约束LV_BAR_SIZE_MIN 4第 26 行内边距导致的指示区小于 4px 时会被强制拉回最小尺寸避免不可见RTL 支持当base_dir LV_BIDI_DIR_RTL时自动交换坐标轴第 518526 行适配从右到左的语言环境。Bar 的样式分为两个 part背景LV_BAR_PART_BG与填充指示区LV_BAR_PART_INDIClv_bar.h第 8287 行分别通过lv_style定制背景圆角、填充色、渐变等效果lv_bar_signal()在LV_SIGNAL_CLEANUP时负责清理指示区样式列表并删除进行中的动画第 669676 行。六、运行与验证在模拟器与固件中跑通示例6.1 VS2019 模拟器运行LvglSimulator 是基于 SDL2 的 PC 端模拟工程入口 lvgl_similator.cpp 中main()通过注释开关切换演示程序第 6294 行。将lv_ex_bar_1();取消注释即可运行本示例//lv_ex_arc_1(); //lv_ex_cpicker_1(); //lv_ex_gauge_1(); //lv_ex_img_1(); lv_ex_bar_1(); // 运行 Simple Bar 示例 //lv_ex_tileview_1();工程中hal_init()完成三件事通过monitor_init()创建 PC 窗口模拟显示屏lv_disp_buf_t全屏帧缓冲 monitor_flush回调、注册鼠标指针输入设备、创建 SDL 线程每 5ms 调用lv_tick_inc(5)驱动 LVGL 时钟。主循环持续调用lv_task_handler()刷新界面第 99105 行Bar 的 2000ms 填充动画即由该任务调度完成。6.2 固件中的对应实现同一份示例源码也存在于 HoloCubic 固件目录 2.Firmware/HoloCubic-fw/lib/lvgl/src/lv_examples/src/lv_ex_widgets/lv_ex_bar/lv_ex_bar_1.c且固件的 lv_conf.h 同样以LV_USE_BAR 1、LV_USE_ANIMATION 1开启该控件与动画子系统。因此开发者既可在 PC 模拟器上快速迭代 UI 逻辑再移植到 ESP32 真机配 TFT_eSPI 驱动的小屏运行也可参考固件中lv_demo_printer第 230256 行多处lv_bar_createlv_bar_set_value与lv_demo_widgets第 366、601606 行配合lv_bar_get_max_value实现复制进度 x/max的成熟用法将其迁移到自己的桌面站界面。七、Bar 的衍生价值Slider 与 Switch 的公共基座从源码结构看lv_bar不仅是独立控件还是另两个常用控件的实现基座lv_slider.h 第 22 行强制要求开启LV_USE_BAR其扩展数据lv_slider_ext_t内嵌lv_bar_ext_t bar第 45 行滑块值、范围、动画时长直接透传到lv_bar_set_value/lv_bar_set_range/lv_bar_set_anim_timelv_switch.h 第 26 行同样包含lv_bar.h开关通过lv_bar_set_range(sw, 0, 1)把 Bar 变成两态控件。因此吃透lv_ex_bar_1背后的lv_barAPI 与动画机制等于同时掌握了进度条、滑块与开关三类控件的底层能力这正是本篇以该 Simple Bar 示例为切入点的价值所在。八、小结lv_ex_bar_1虽然只有寥寥数行却完整覆盖了 LVGL Bar 控件的核心使用范式创建lv_bar_create→ 布局lv_obj_set_size/lv_obj_align→ 动画配置lv_bar_set_anim_time→ 动画赋值lv_bar_set_value(..., LV_ANIM_ON)。结合 lv_bar.h 的 API 清单与 lv_bar.c 的实现可以进一步掌握值域裁剪、动画状态机、对称绘制与最小尺寸约束等底层细节并将其直接复用到 HoloCubic 模拟器与 ESP32 固件的真实界面开发中。赞分享嵌入式物联网智能硬件嵌入式GUI硬件开发【免费下载链接】HoloCubic带网络功能的伪全息透明显示桌面站项目地址https://gitcode.com/gh_mirrors/ho/HoloCubic点击查看免费下载相关推荐HoloCubic 固件中的 LVGL Bar 进度条控件从示例代码到源码级原理解析HoloCubic 固件中的 LVGL Bar 进度条控件从示例代码到源码级原理解析 导读 本文以 HoloCubic 仓库 lvgl 示例库 https:/嵌入式物联网智能硬件嵌入式GUI硬件开发LVGL Bar 控件六例全解从基础进度条到自定义绘制X-TRACK 模拟器内置示例剖析LVGL Bar 控件六例全解从基础进度条到自定义绘制X TRACK 模拟器内置示例剖析 导读 本文基于 X TRACK 项目模拟器中内置的 LVGL 官智能硬件嵌入式硬件开发LVGL Bar 进度条控件lv_bar完整指南三种模式、样式体系与绘制事件机制——X-TRACK 内嵌 LVGL 源码深度解析LVGL Bar 进度条控件lv_bar完整指南三种模式、样式体系与绘制事件机制——X TRACK 内嵌 LVGL 源码深度解析 本文以 X TRACK智能硬件嵌入式硬件开发上一篇xberg 递归 URL 文档提取实战用 follow_document_urls 沿文档链接自动抓取关联资源下一篇TrendFinder入门指南如何在5分钟内搭建AI趋势监测系统创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考