1:安装SDL库和LVGL软件
linux:安装SDL库
sudo apt-get install libsdl2-dev
(判断自己的SDL库可不可以用直接找
一个main.c编译的时候 -lSDL2 ,没有报找不到SDL2就表明可以用)
windows:安装SquareLine studio
打开LVGL官网下载免费的版本安装即可
2:打开SquareLine新建工程
新建工程,记得把工程保存到自己记得的位置
如果要添加资源文件,例如图片字体等,就需要打开最下面的
ADD FILE INTO ASSETS 按钮,在弹出的文件筐里面放入自己的资源
接着设计自己界面,设计好了之后点击右上角的运行模拟看看
没问题之后导出
点击创建模板工程,把模板工程的位置放在linux文件夹下面
此模板工程包含了源码
注意:(只需要导出一次源码,第二次导出会覆盖之前的一切)
注意:如果又修改了图形界面,此时只需要导出UI文件就行了
3:编译LVGL
1:把这个Makefile文件放入刚刚导出源码工程的顶层目录
注意:如果是编译32位的程序,则主机需要安装32位的SDL库:
sudo apt-get install libsdl2-dev:i386
使用"-m32"参数告诉编译器使用32位的目标文件
使用"-L/path/to/32bit/sdl/lib"告诉链接器在32位的
库路径"/path/to/32bit/sdl/lib"中查找库文件
CC ?= gcc
LVGL_DIR_NAME ?= lvgl
LVGL_DIR ?= ${shell pwd}
CFLAGS ?= -O3 -g0 -I$( LVGL_DIR) / -Wall -Wshadow \
-Wundef -Wmissing-prototypes \
-Wno-discarded-qualifiers -Wall \
-Wextra -Wno-unused-function \
-Wno-error= strict-prototypes \
-Wpointer-arith -fno-strict-aliasing \
-Wno-error= cpp -Wuninitialized \
-Wmaybe-uninitialized -Wno-unused-parameter \
-Wno-missing-field-initializers -Wtype-limits \
-Wsizeof-pointer-memaccess -Wno-format-nonliteral \
-Wno-cast-qual -Wunreachable-code \
-Wno-switch-default -Wreturn-type \
-Wmultichar -Wformat-security \
-Wno-ignored-qualifiers -Wno-error= pedantic \
-Wno-sign-compare -Wno-error= missing-prototypes \
-Wdouble-promotion -Wclobbered \
-Wdeprecated -Wempty-body \
-Wtype-limits -Wshift-negative-value \
-Wstack-usage= 2048 \
-Wno-unused-value -Wno-unused-parameter \
-Wno-missing-field-initializers \
-Wuninitialized -Wmaybe-uninitialized \
-Wall -Wextra -Wno-unused-parameter \
-Wno-missing-field-initializers -Wtype-limits \
-Wsizeof-pointer-memaccess \
-Wno-format-nonliteral -Wpointer-arith \
-Wno-cast-qual -Wmissing-prototypes \
-Wunreachable-code -Wno-switch-default \
-Wreturn-type -Wmultichar -Wno-discarded-qualifiers \
-Wformat-security -Wno-ignored-qualifiers -Wno-sign-compare
LDFLAGS ?= -lm -lSDL2
BIN = kunkun_show
MAINSRC = ./main.c
include $( LVGL_DIR) /lvgl/lvgl.mk
include $( LVGL_DIR) /lv_drivers/lv_drivers.mk
include $( LVGL_DIR) /ui/ui.mk
OBJEXT ?= .o
AOBJS = $( ASRCS:.S= $( OBJEXT) )
COBJS = $( CSRCS:.c= $( OBJEXT) )
MAINOBJ = $( MAINSRC:.c= $( OBJEXT) )
SRCS = $( ASRCS) $( CSRCS) $( MAINSRC)
OBJS = $( AOBJS) $( COBJS)
all: default
%.o: %.c
$( CC) $( CFLAGS) -c $< -o $@
@echo "CC $<"
default: $( AOBJS) $( COBJS) $( MAINOBJ)
$( CC) -o $( BIN) $( MAINOBJ) $( AOBJS) $( COBJS) $( LDFLAGS)
mkdir -p $( LVGL_DIR) /obj $( LVGL_DIR) /bin
mv *.o $( LVGL_DIR) /obj/
mv $( BIN) $( LVGL_DIR) /bin/
clean:
rm -f $( BIN) $( AOBJS) $( COBJS) $( MAINOBJ) ./bin/* ./obj/*
2:把这个ui.mk放入ui目录下
UI_DIR_NAME ?= ui
CSRCS += $( wildcard $( LVGL_DIR) /$( UI_DIR_NAME) /*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( UI_DIR_NAME) /fonts/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( UI_DIR_NAME) /screens/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( UI_DIR_NAME) /images/*.c)
3:修改lvgl目录下的lvgl.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/core/lv_core.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/draw/lv_draw.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/extra/lv_extra.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/font/lv_font.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/hal/lv_hal.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/misc/lv_misc.mk
include $( LVGL_DIR) /$( LVGL_DIR_NAME) /src/widgets/lv_widgets.mk
4:修改lv_drivers目录下的lv_drivers.mk
LV_DRIVERS_DIR_NAME ?= lv_drivers
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /wayland/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /indev/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /gtkdrv/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /display/*.c)
CSRCS += $( wildcard $( LVGL_DIR) /$( LV_DRIVERS_DIR_NAME) /sdl/*.c)
5:执行
make clean
make -j8
在bin目录下就可以得到可执行文件
4:把linux的画面输出到ssh终端
linux下执行命令:
sudo cp /home/user/.Xauthority /boot/
其中user是自己的用户名
最后直接运行bin文件下的文件就可以看到LVGL画面了