Ubuntu下运行LVGL模拟器

一、前言

​ LVGL是一个可高度可裁剪、低资源占用、界面美观且易用的C语言嵌入式系统图形库,是当下最流行的嵌入式图形库之一。你可以通过调用该库提供的函数,创建出自己想要的图形界面,然后移植到你自己的嵌入式开发板上。使用LVGL的嵌入式开发者很多,在网上也比较容易找资源,遇到问题大部分也可以在网上找到答案。

​ 图1-LVGL官方演示例程:

LVGL 官方Demo

​ LVGL支持模拟器,模拟器支持Windows、Linux或macOS系统,你也可以先在电脑上先运行你的LVGL项目,当你觉得界面设计的差不多的时候,再把源码移植到嵌入式开发板上。

​ 官方列出了支持LVGL模拟器的IDE如下表:

IDE可以支持的PC系统Github
Eclipse + SDL驱动Linux 或 Machttps://github.com/lvgl/lv_sim_eclipse_sdl
CodeBlocksWindowshttps://github.com/lvgl/lv_sim_codeblocks_win
VisualStudioWindowshttps://github.com/lvgl/lv_sim_visual_studio_sdl
VSCode + SDL/X11 驱动Linux (SDL/X11)或Mac (SDL)https://github.com/lvgl/lv_sim_vscode_sdl
PlatformIO + SDL驱动Linux 或 Machttps://github.com/lvgl/lv_platformio
MDK + FastModelWindowshttps://github.com/lvgl/lv_port_an547_cm55_sim

大多数开发者都使用Windows平台下的VisualStudio运行LVGL模拟器,网上的环境搭建教程也很多。但是在Linux上使用LVGL模拟器的教程相对较少,难免有些小伙伴就喜欢折腾Linux,所以本文选择上表中的第四个IDE——“VSCode + SDL/X11 驱动”的方式,在Ubuntu系统上运行LVGL模拟器。

二、在Ubuntu内安装VS Code(方法很多,不限于本篇文章的方法)

  • 方法一:也可以通过Ubuntu内置的Firfox浏览器下载VS Code的.deb安装包(https://code.visualstudio.com/Download):

    在这里插入图片描述

  • 执行dpkg指令安装VS Code:

    sudo dpkg -i code_1.85.1-1702462158_amd64.deb
    

    在这里插入图片描述

  • 方法二:在较新版本的Ubuntu内,你甚至可以直接在应用商店搜索安装VS Code:

    在这里插入图片描述

    在这里插入图片描述

  • 方法三:使用wget指令下载VS Code安装包(版本可能会变化,下载链接可能会变化):

    wget https://vscode.download.prss.microsoft.com/dbazure/download/stable/0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2/code_1.85.1-1702462158_amd64.deb
    

    在这里插入图片描述

  • 执行dpkg指令安装VS Code:

    sudo dpkg -i code_1.85.1-1702462158_amd64.deb
    

在这里插入图片描述

三、获取源码

3.2 方法一:从Github拉取源码

  • 步骤1:通过git clone指令拉取LVGL模拟器源码,GitHub网址:https://github.com/lvgl/lv_port_pc_vscode。

    git clone --recursive https://github.com/lvgl/lv_port_pc_vscode
    
  • 但是由于国内访问github很不稳定,如果你没有梯子的话,上面这条指令大概率会拉取失败,这时你可以直接去看第3.3小节

    从Github拉取源码

  • 步骤2:切换分支

    由于上一条指令我们递归拉取的lv_port_pc_vscode源码包含lv_drivers和lvgl两个子分支,这两个子分支默认是最新版本的lvgl库,我们不要最新的,要切换成最稳定的。

    切换分支

    通过如下指令切换分支:

    cd lv_port_pc_vscode/lvgl/
    git checkout origin/release/v8.3
    
    cd ../lv_drivers/
    git checkout origin/release/v8.3
    

3.3 方法二:从Gitee码云拉取源码

  • 步骤1:我在国内的码云上传了这份源码(v8.3稳定版),可以通过如下指令拉取到自己的本地:

    git clone https://gitee.com/bi_an_gitee/lv_port_pc_vscode_8.3.git
    

    从码云拉取源码

四、安装Linux SDL2驱动

  • 步骤1:执行下方指令安装Linux SDL2驱动

    sudo apt-get update && sudo apt-get install -y build-essential libsdl2-dev
    
  • 检查SDL2版本:

    sdl2-config --version
    

    SDL2版本查看

五、编译源码

  • 步骤1:使用VS Code打开源码

    cd ~/01_lvgl/lv_port_pc_vscode #注意替换成自己的lv_port_pc_vscode源码根目录路径
    code ./
    

    用VS Code打开lv_port_pc_vscode源码

  • 步骤2:在VS Code内新建一个终端,方便修改源码和编译。

    新建VS Code下的终端

  • 步骤3:修改源码Makefile,把模拟器的显示驱动切换成SDL2,使用默认的X11驱动会提示找不到头文件,如下图。

    修改Makefile

    *注意:编译时如果提示“找不到不到make命令”,通过如下指令安装make和gcc:

    sudo apt install make
    sudo apt install gcc
    
  • 步骤4:编译成功如下图所示。

    编译成功,Demo成功运行

六、关于main( )函数和示例

  • main( )函数位置如下图所示:

    在这里插入图片描述

  • 例程和demo在lvgl目录下,它们都可以直接在main( )函数中调用查看效果,当我们自己设计LVGL界面时,这些例程可以提供参考。

    在这里插入图片描述

七、修改模拟器分辨率

  • 模拟器分辨率的修改位置如下图所示。修改完SDL_HOR_RESSDL_VER_RES两个宏后,需要先执行make clean指令、然后在执行make && ./build/bin/demo。

    make clean
    make && ./build/bin/demo
    

    在这里插入图片描述

欢迎大家点赞、留言、讨论,关注我,后面会出更多和LVGL、嵌入式相关文章。

  • 29
    点赞
  • 32
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

___彼岸丶

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值