lvgl v8 arc

使用lvgl创建弧形界面
最新推荐文章于 2025-09-04 20:37:03 发布
原创 最新推荐文章于 2025-09-04 20:37:03 发布 · 928 阅读 · 6 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#单片机

本文介绍如何在新项目手表界面中利用lvgl库创建弧形效果。通过设置旋转角度、背景弧度、对象大小、颜色和宽度，实现特定的弧形显示，并展示最终运行结果。

最近公司开了一个新项目手表，需要做这么一个界面，如图所示

网上查了很多关于arc的博客，要么是v7的，要么就是最基本的，很难满足想要达到的结果。

我直接上代码了：

lv_obj_t* arc1 = lv_arc_create(lv_scr_act());
    lv_arc_set_rotation(arc1, 180);
    lv_arc_set_bg_angles(arc1, 348, 193);//12+0+193 = 205°
    lv_obj_set_size(arc1, LV_HOR_RES * 0.916, LV_HOR_RES * 0.916);
    lv_obj_set_style_arc_color(arc1, lv_color_hex(0x333333), LV_PART_MAIN);
    lv_obj_set_style_arc_color(arc1, lv_color_hex(0x48CFBD), LV_PART_INDICATOR);
    lv_obj_set_style_arc_width(arc1, LV_HOR_RES * 0.012, LV_PART_MAIN);
    lv_obj_set_style_arc_width(arc1, LV_HOR_RES * 0.012, LV_PART_INDICATOR);
    lv_obj_remove_style(arc1, NULL, LV_PART_KNOB);   /*Be su

最低0.47元/天 解锁文章
LVGL v8应用之arc
knaht的博客
02-10 1440
API接口： 1. 设置角度(Angles) 零度位于对象的右中间（3 点钟） ，并且度数沿顺时针方向增加。角度应在[0:360]范围内。 设置背景就角度：lv_arc_set_bg_angles(arc_obj, 30, 330); 设置指示器角度：lv_arc_set_angles(arc_obj, 30, 250); 2.旋转(Rotation) lv_arc_set_angles(arc_obj, 30, 250); 3.设置范围和值(Range and values) lv_.
Wifi控制智能手表项目开源，带演示视频-电路方案
04-22
软件 这个固件主要是在ESP8266-SDK环境下进行的，当然你也可以自己改进，main.c文件里面主要是关于WiFi配置程序的，这个项目主要是硬件并非软件，所以固件主要是针对硬件演示。固件可以利用 esptool 进行烧录，就像 espterm一样可以利用串口来调试和修改程序。 声明 libesphttpd （minetest测试）并由 Spritetm编写，关于此项目的人员以及许可信息都位于“THE BEER-WARE LICENSE”。 httpclient.c / httpclient.h（包含所有的固件信息），都是由Caerbannog制作完成，具体信息位于“THE BEER-WARE LICENSE”。 i2c_master.h / i2c_master.c是借鉴了Espressif系统。 硬件设计（原理图、PCB电路板设计等）获得了 Creative Commons Attribution-NonCommercial-ShareAlike 4.0 (CC-BY-NC-SA)许可。固件代码(https://opensource.org/licenses/MIT)来自于MIT。 开源制作属于自己的智能手表，硬件如下: ESP8266（32Mbit闪存） MPU-9250（陀螺仪传感器）以及 AK8963（内置磁力计） RV-3029-C2 （实时时钟模块） OLED显示屏SSD1306（128×64） 3个按钮 250mAh 锂电池 尺寸:35 * 39 * 11mm WiFi天线 震动马达 演示视频: https://v.qq.com/x/page/z019064ny2b.html?start=257
FREERTOS+lvgl低功耗智能手表任务解析
2503_90357516的博客
09-04 1762
总的来说，这个项目比较全面，有很多细节地方没有讲到，建议对照源码理解。t=P7R7FreeRTOS系统---Delay死延迟函数（STM32标准库）_freertos osdelay卡死-优快云博客https://blog.youkuaiyun.com/2301_76762351/article/details/146006939?
LVGL——加载器部件
weixin_63780683的博客
12-13 687
【代码】LVGL——加载器部件。
LVGL：渐变方案
友善啊，朋友的博客
03-11 2722
仿照qt的QGradient::Preset渐变类型写的，因为lvgl只支持水平/垂直渐变，且只支持两种颜色的渐变，所以有些类型的渐变未能实现，有些则缺少中间颜色。
LVGL-圆弧
whIIe的博客
12-14 804
lvgl 圆弧部件
lvgl8 arc渐变色
08-30
根据用户查询，需要在LVGL v8中实现圆弧（arc）的渐变色效果。结合站内引用内容： 引用[1]提到环形渐变加载的实现方法，涉及图片处理：将环形渐变图片转换为C文件（RGB565A8格式），提取透明度数据。但用户明确要求...
LVGL8 arc最小值还能显示颜色
最新发布
11-01
- **LVGL v8 vs v9**：LVGL v9引入了 `lv_arc_set_range()` 简化范围设置，但v8需依赖角度计算[^4]。 - **仪表控件（lv_meter）的替代方案**：如果需求更复杂（如模拟表盘），可使用 `lv_meter` 控件（LVGL v8支持）...
lvgl8 arc用背景图片实现渐变色
09-20
我们首先需要理解用户的需求：在LVGL v8中，为arc（弧形）对象同时设置背景图片和渐变效果。 根据引用[1]：渐变背景色是通过设置对象的background color（作为color1）和gradient color（作为color2）来实现的。...
LVGL笔记14–lv_arc弧形
未来可期
02-14 3090
LVGL笔记14–lv_arc弧形 v_arc 是一个用来绘制弧形的控件,和 lv_led 控件一样,非常的简单,通过样式中的line 字段来修改弧形的外观。可以用来做进度条，显示一些事件的进度。 设置起始角度和终止角度两个参数，设置width和height值可以间接的设置出弧形的半径（r = width/2）， lv_arc样式 my_style.line.color : 用来设置弧形的颜色 my_style.line.width : 用来设置弧线的厚度 my_style.line.rounded
lvgl 7.7.2 arc样式
mygod2008ok的专栏
11-29 2426
ARC样式修改线条颜色定义背景样式定义线条样式绘制并加载黑色屏幕绘制ARC完整的绘制ARC样式函数如下在main函数中调用arc_test()函数，并运行，运行效果图如下 定义背景样式 static lv_style_t style_bg; lv_style_reset(&style_bg); lv_style_init(&style_bg); lv_style_set_bg_opa(&style_bg, LV_STATE_DEFAULT, L
在ESP8266上移植了lvgl库，并且有一个时钟界面显示，支持GPIO模拟的SPI屏幕
03-17
在ESP8266上移植了lvgl库，并且有一个时钟界面显示，支持GPIO模拟的SPI屏幕，用的是ili9341
基于 STM32、FreeRTOS、LVGL 的强大智能手表
07-19
基于 STM32、FreeRTOS、LVGL 的强大智能手表
LVGL lv_gauge仪表盘（20）
jiang_2018的博客
03-17 3610
lv_gauge lv_gauge仪表盘是lv_linemeter控件外加标签、指针、中心原点组成，标签个数、指针个数可设置，lv_linemeter中的非活跃刻度线变成了关键数值点。 样式 /*Styles*/ enum { LV_GAUGE_PART_MAIN = LV_LINEMETER_PART_MAIN, LV_GAUGE_PART_MAJOR = _LV_LINEMETER_PART_VIRTUAL_LAST, LV_GAUGE_PART_NEEDLE, _LV_
LVGL_基础空间圆弧arc
会选科技的博客
10-09 1496
【代码】LVGL_基础空间圆弧arc。
【亲测免费】 探索智能手表的未来：LVGL-Watch开源项目推荐
gitblog_00666的博客
09-14 1793
**LVGL-Watch** 是一个基于LVGL 8.0的开源智能手表固件项目，专为Open-Smartwatch设计。该项目不仅提供了丰富的功能，还通过开源的方式，让开发者能够自由定制和扩展手表的功能。LVGL-Watch的目标是为智能手表爱好者和开发者提供一个强大的平台，让他们能够轻松地创建个性化的智能手表体验。 ## 项目技术分析 LVGL-Watch项目采用了**PlatformIO*...
LVGL核心部件——弧（arc）控件的介绍
SYNWIT的博客
01-05 1910
本文介绍LVGL核心部件——弧（arc），它由背景和前景弧组成。前景（指示器）可以进行触摸调整。
LVGL 源码分析大全
热门推荐
Bigan(安)的博客
08-12 1万+
LVGL 是一款流行的免费和开源嵌入式图形库，为纯C的轻量级GUI框架，支持framebuffer直接渲染图层，因此LVGL能更容易为 MCU、MPU等显示设备开发漂亮的UI。可视化的 UI 编辑器官方上有推荐使用工具。当然，也可以选择 NXP(恩智浦半导体) 提供的工具。........................
编译lvgl（V8.4.0）源代码为.lib文件并验证
mftang的博客
07-05 1668
本文主要介绍如何将lvgl的源文件转化为.lib文件，以及大简化加载lvgl源代码的繁琐步骤。随着lvgl的版本升级越来越高，其源代码也越来越多，项目中加载这些文件也是一个繁琐的任务，本文写作的目的就是为了简化这一操作。使用.LIB文件的方式，极大的简化添加源代码的过程更便于平台的移植。
lvgl 弧形
03-08
### 创建和使用 LVGL 框架中的弧形控件 在 LVGL 中，`arc` 控件用于绘制圆环或扇区形状。这些图形常被用来表示进度条、仪表盘或其他圆形界面元素。 #### 初始化 Arc 控件 为了创建一个新的 `arc` 对象并将其添加到指定父容器中，可以调用函数 `lv_arc_create(lv_obj_t *parent)`[^4]。此方法返回指向新建对象的指针，在后续操作里需要用到它来设置属性等。 ```c // 假设已经存在一个有效的 lvgl 显示设备初始化过程... lv_obj_t * arc; arc = lv_arc_create(parent_container); // parent_container 是先前定义好的其他组件或者是屏幕根节点 (NULL 表示默认) ``` #### 设置基本参数 通过一系列 API 函数可配置该控件的具体样式： - **角度范围**：设定起始角与结束角决定显示的角度区间。 ```c lv_arc_set_range(arc, start_angle, end_angle); ``` - **旋转方向**：顺时针还是逆时针 ```c lv_arc_set_rotation_dir(arc, direction_flag); ``` - **背景颜色填充模式** ```c lv_arc_set_bg_color_mode(arc, mode_value); ``` 以上仅列举了一些常用接口；更多细节参阅官方文档获取完整的功能列表[^4]。 #### 动态更新数值 当希望随着某些条件变化而改变弧线所代表的比例关系时，则需定期调整当前值对应的度数位置： ```c lv_arc_set_value(arc, new_degree_position); ``` 这里假设有一个定时器或者其他事件触发机制能够周期性地提供最新的百分比数据转换成相应的角度偏移量传递给上述命令完成实时刷新效果[^4]。 #### 完整实例代码展示 下面给出一段简单的例子说明如何组合前面介绍过的知识点构建一个动态更新的小部件： ```c #include "lvgl/lvgl.h" static void update_progress(void* obj, int32_t value){ lv_arc_set_value(obj, value % 360); } void create_dynamic_arc_example(){ static lv_style_t style; lv_style_init(&style); /* Customize the appearance */ lv_style_set_radius(&style, LV_RADIUS_CIRCLE); lv_style_set_bg_opa(&style, LV_OPA_COVER); lv_style_set_bg_grad_dir(&style,LV_GRAD_DIR_HOR); lv_style_set_bg_main_stop(&style,0); lv_style_set_bg_end_stop(&style,100); lv_obj_add_style(style, NULL); lv_obj_t * screen = lv_scr_act(); lv_obj_t * myArc = lv_arc_create(screen); lv_obj_add_style(myArc,&style,0); lv_obj_align(myArc,NULL,LV_ALIGN_CENTER,0,-50); lv_arc_set_range(myArc, 0, 360); lv_timer_create(update_progress, 1000, myArc); } ``` 这段程序会在屏幕上居中放置一条不断自转着的彩色渐变带状物作为视觉反馈元件[^4]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值