当前位置：首页 > news >正文

使用SquareLine Studio创建LVGL项目到IMX6uLL平台

news 2025/8/10 15:46:22

文章目录

前言
一、SquareLine Studio是什么？
二、下载安装
三、工程配置
四、交叉编译

前言

遇到的问题：#error LV_COLOR_DEPTH should be 16bit to match SquareLine Studio's settings，解决方法见# 四、交叉编译

一、SquareLine Studio是什么？

SquareLine Studio 是 LVGL 官方推出的一款跨平台 UI 开发工具，支持 Windows、Linux 和 macOS 平台。SquareLine Studio 采用所见即所得的开发方式，可大大减少用户开发 UI 的时间。
官网https://squareline.io/downloads
在这里插入图片描述

二、下载安装

1.注册
在这里插入图片描述
2.打开软件
下载为软件压缩包，解压缩后双击运行安装程序直接安装【点击option可以自己指定安装路径】即可，安装完成后打开软件，输入注册邮箱、密码，点击 LOG IN：

勾选获取的许可证，点击 SELECT LICENSE：
在这里插入图片描述
许可证获取成功，点击 START SQUARELINE 即可开始使用：

https://blog.csdn.net/abcabc123123123123/article/details/124852542

三、工程配置

1.创建工程
在这里插入图片描述

2.设计界面
自行设计，这里只是做一个测试
在这里插入图片描述

3.设置路径

在这里插入图片描述

4.导出源码
在这里插入图片描述
设置的路径下面就有如下文件：

四、交叉编译

1.LVGL环境
参考：https://blog.csdn.net/weixin_44236302/article/details/137449365
在这里插入图片描述
将上面生成的代码放在ui文件目录下：

2.更改Makefile文件
将以下代码添加到Makefile中
在这里插入图片描述

# 添加源文件目录  根据自己ui目录下面的文件夹添加
VPATH += :$(LVGL_DIR)/ui
VPATH += :$(LVGL_DIR)/ui/components
VPATH += :$(LVGL_DIR)/ui/fonts
VPATH += :$(LVGL_DIR)/ui/screens# 添加头文件目录 根据自己ui目录下面的文件夹添加
CFLAGS += -I$(CURDIR)/ui
CFLAGS += -I$(CURDIR)/ui/components
CFLAGS += -I$(CURDIR)/ui/fonts
CFLAGS += -I$(CURDIR)/ui/screens# CSRCS 			+=$(LVGL_DIR)/mouse_cursor_icon.c 
#根据自己ui目录下面的文件夹添加
UI_CSRCS += $(wildcard ui/*.c)
UI_CSRCS += $(wildcard ui/components/*.c)
UI_CSRCS += $(wildcard ui/screens/*.c)

3.更改Main.c文件
在这里插入图片描述

#include "lvgl/lvgl.h"
#include "lvgl/demos/lv_demos.h"
#include "lv_drivers/display/fbdev.h"
#include "lv_drivers/indev/evdev.h"
#include <unistd.h>
#include <time.h>
#include <sys/time.h>
#include <stdio.h>
#include "ui/ui.h"#define DISP_BUF_SIZE (800 * 480)int main(void)
{lv_init();/*Linux frame buffer device init*/fbdev_init();/*A small buffer for LittlevGL to draw the screen's content*/static lv_color_t buf[DISP_BUF_SIZE];/*Initialize a descriptor for the buffer*/static lv_disp_draw_buf_t disp_buf;lv_disp_draw_buf_init(&disp_buf, buf, NULL, DISP_BUF_SIZE);/*Initialize and register a display driver*/static lv_disp_drv_t disp_drv;lv_disp_drv_init(&disp_drv);disp_drv.draw_buf   = &disp_buf;disp_drv.flush_cb   = fbdev_flush;disp_drv.hor_res    = 800;//根据自己的LCD分辨率更改disp_drv.ver_res    = 480;//根据自己的LCD分辨率更改lv_disp_drv_register(&disp_drv);/* Linux input device init */evdev_init();/* Initialize and register a display input driver */lv_indev_drv_t indev_drv;lv_indev_drv_init(&indev_drv);      /*Basic initialization*/indev_drv.type = LV_INDEV_TYPE_POINTER;indev_drv.read_cb = evdev_read;lv_indev_t * my_indev = lv_indev_drv_register(&indev_drv); /*Create a Demo*///lv_demo_widgets();ui_init();/*Handle LVGL tasks*/while(1) {lv_timer_handler();usleep(5000);}return 0;
}/*Set in lv_conf.h as `LV_TICK_CUSTOM_SYS_TIME_EXPR`*/
uint32_t custom_tick_get(void)
{static uint64_t start_ms = 0;if(start_ms == 0) {struct timeval tv_start;gettimeofday(&tv_start, NULL);start_ms = (tv_start.tv_sec * 1000000 + tv_start.tv_usec) / 1000;}struct timeval tv_now;gettimeofday(&tv_now, NULL);uint64_t now_ms;now_ms = (tv_now.tv_sec * 1000000 + tv_now.tv_usec) / 1000;uint32_t time_ms = now_ms - start_ms;return time_ms;
}