LVGLStudio 教程

LVGLStudio 教程

开发者必读

LVGLStudio 内置完整的 C 编译工具链,点「运行」即可一键编译并启动工程:工程目录下所有源文件会被编译为单一可执行文件,LVGL 的所有源码都已编译进运行时,调用任何 LVGL API 只需 #include <lvgl.h>。

整个工程就是一个标准的 C 语言项目。LVGL、模拟器、编译器、输入/输出设备、显存 buffer 等所有必备环境都已就绪:新建一个 .c 文件、写 int main() 就能运行,LVGL 初始化会自动完成,开发者调用 LVGL 绘图 API 即可在模拟器中看到画面。

工程配置

创建工程时可指定 LVGL 版本(如 9.5.0 或 8.4.1)和屏幕分辨率(默认 240×240),后续在工程设置页可随时修改,修改后需要重新编译。运行时分辨率可通过 lvs_width 和 lvs_height 全局变量读取:

#include <lvgl.h>
#include <LVGLStudio.h>

int main() {
  printf("Screen size: %u x %u\n", lvs_width, lvs_height);
}

Hello LVGL

下面是一个最简单的 LVGL 程序:居中创建一个按钮,按钮上显示文字:

#include <lvgl.h>
#include <LVGLStudio.h>

int main() {
  // 居中创建一个按钮
  lv_obj_t *btn = lv_btn_create(lv_scr_act());
  lv_obj_set_size(btn, 120, 50);
  lv_obj_align(btn, LV_ALIGN_CENTER, 0, 0);

  // 按钮上添加文字
  lv_obj_t *label = lv_label_create(btn);
  lv_label_set_text(label, "Hello");
  lv_obj_center(label);
}

这段代码用的是 LVGL 8.x 的 API。 LVGL 9 有 breaking 的重命名:当前屏幕是 lv_screen_active()(不是 lv_scr_act()),按钮是 lv_button_create()(不是 lv_btn_create())。工程设置里选的是哪个版本,就用对应的那套写法。 lv_label_create / lv_label_set_text / lv_obj_center / lv_obj_align 两版通用。

代码一致性

运行时使用的是官方 LVGL,从源码原样编译而来,没有修改任何一行代码。模拟器中看到的效果就是真机上的效果,写好的代码可直接迁移到真机运行。

外部输入设备

运行时已加载触摸屏、键盘、编码器、按钮四种输入设备。在模拟器屏幕上方滑动鼠标即可触发事件,左键按下 + 弹起模拟点按事件,右侧实时显示输入设备的状态信息。

使用 LVGL 标准的事件监听 API 即可接收这些事件。

键盘和按钮目前尚未实现,将在后续版本中提供。

编码器使用鼠标滚轮触发,滚轮按下模拟编码器点击事件,也可在右侧的编码器 tab 手动触发。

调试日志

调试代码时,可以使用 printf 输出日志信息。printf 在软件内置的 LVGLStudio.h 头文件中已被重定向到运行时底部的控制台。

注意:LVGLStudio.h 不会自动引入,需要在源码里手动写 #include <LVGLStudio.h>。请放在 lvgl.h 之后(也就是放在所有会引入 stdio.h 的头文件之后):

#include <lvgl.h>
#include <LVGLStudio.h>   // 放在 lvgl.h 之后

原因:LVGLStudio.h 内部用 #define printf lvs_printf 做重定向,且这个宏在文件结束时不会还原。如果它排在 lvgl.h 前面,lvgl.h 引入的 stdio.h 里那句 int printf(...) 就会被宏替换成 int lvs_printf(...),和头文件里的声明撞出 conflicting types for 'lvs_printf' 编译错误。

重定向与包含顺序无关地生效于调用点——只要 #include <LVGLStudio.h> 出现在你写 printf(...) 的那一行之前即可。printf 仍走标准 stdio,输出到 stdout,不会出现在下面的控制台。

#include <lvgl.h>
#include <LVGLStudio.h>

int main() {
  printf("Hello LVGLStudio!\n");
  // ...你的 LVGL 代码
}

printf 输出的内容会显示在运行时窗口的下半部分(控制台区域):

LVGL 官方 API 文档:https://docs.lvgl.io/

AI 编程接口

需要 v0.2.0 及以上版本。

LVGLStudio 内置了一个只监听本机(127.0.0.1)的 HTTP 服务,供 AI 编程工具(Claude Code、Cursor、Cline 等)直接操作你的工程:列出工程、读写 .c 源码、开关预览窗口。

这个接口和图形界面操作的是同一份数据 —— AI 通过接口改的代码,你在编辑器里立刻就能看到;你在编辑器里改的,AI 下次读到的也是最新的。

更进一步:AI 还能读取编译日志、获取运行画面的截图、模拟触摸与旋钮,自己完成「改代码 → 重跑 → 看日志 → 看画面 → 验证交互 → 再改」的闭环,全程不用你截图确认。

这些能力篇幅较长,另开了一页专门讲:

→ AI 编程:让 AI 自己验证改得对不对

本软件为免费开放使用的项目。

有想说的评论一句吧!