【经验分享】T113 使用GUI-Guider生成代码设计lvgl

[vejoker]

1、设计页面

随便绘制些东西，版本选的是LVGLv8.3.5，版本GUI-Guider-1.6.1-GA


导出代码，选择 工程->工程导出 ,重要的是custom和generated文件夹

2、文件配置

下载对应的lvgl，https://github.com/lvgl/lvgl ，切换对应分支
下载对应的lvgl驱动，https://github.com/lvgl/lv_drivers ，切换对应分支

下载的lvgl-8.3.5重命名为lvgl
下载的lv_drivers-release-v8.3重命名为lv_drivers
创建ui文件夹，将custom和generated文件夹放进去

还有 从lvgl中复制lv_conf_template.h 到 当前目录，并重命名为 lv_conf.h 、 从lv_drivers 中复制 lv_drv_conf_template.h 到 当前目录，并重命名为 lv_drv_conf.h
剩下的main.c和Makefile从lv_port_linux_frame_buffer 来的，
lv_port_linux_frame_buffer 下载 https://github.com/lvgl/lv_port_linux_frame_buffer.git
从lv_port_linux_frame_buffer 中复制 main.c 和 Makefile 到 当前目录 下

3、代码配置

修改lv_conf.h 文件
使能lv_conf.h 头文件，将#if 0修改为#if 1
修改LV_COLOR_DEPTH为32
修改LV_MEM_SIZE 为（1024U * 1024U）
修改LV_USE_LOG、LV_LOG_PRINTF 为1
修改LV_FONT_MONTSERRAT_12、14、16、24 为1

修改lv_drv_conf.h 文件
使能修改lv_drv_conf.h 头文件，将#if 0修改为#if 1
使能LCD显示：使能USE_FBDEV，路径设置为/dev/fb0
设置触摸，设置USE_EVDEV为1，根据实际情况设置EVDEV_NAME

修改main.c文件
头文件添加 #include "ui/generated/gui_guider.h"
头文件添加 #include "ui/generated/events_init.h"
屏蔽cursor for the mouse
修改显示屏的宽高，否则花屏，显示不全
配置启用文件

修改makefile
修改CC = arm-openwrt-linux-gcc ，改为你自己的编译器
修改BIN = lvgl_demo ，名字随便起
增加.mk依赖，include $(LVGL_DIR)/lv_drivers/lv_drivers.mk等，看图
屏蔽CSRCS +=$(LVGL_DIR)/mouse_cursor_icon.c

4、编译

在当前目录 直接执行make
运行正常就会生成可执行文件
将lvgl_demo 可执行文件放入开发板
通过U盘方式或ADB
运行./lvgl_demo &

5、遇到的问题

提示找不到lvgl.h，

处理方法一

找到代码位置，改为../../lvgl.h同lvgl/lvgl.h

这里只是其中一个示例，ui文件夹下的其他引用了lvlg.h文件的都会报这个错，通过上面的方法处理

处理方法二

在Mainfile中写入

CFLAGS += -I$(LVGL_DIR_NAME)/
CFLAGS += -I$(LVGL_DIR)/ui/generated
CFLAGS += -I$(LVGL_DIR)/ui/custom

[likaienjoy]

建议使用squareline 1.5.0替代

[sjaleee]

@likaienjoy 为何，官方这个不是要收费的吗？