关注+星标公众,不错过精彩内容

847de53ca711f0634ebc16a5c33d0289.gif

转自 | Mculover666

这些年,很多消费类、家电类电子产品都配上了显示屏,所以,GUI也越来越盛行了。

在嵌入式中,LVGL是一款不错的开源GUI,也是众多嵌入式软件工程师都在使用GUI。

一、LVGL介绍 

LVGL官网:https://lvgl.io/。

LVGL全称Light and Versatile Graphics Library,轻量化和多功能的图形库,遵循MIT开源许可协议,具有以下特性(what LVGL can do for you)。

6d7d425d46e9a7e12cc7430c1c87f531.png

1. 对硬件的要求

  • CPU:16、32、64位

  • 主频:推荐16 MHz

  • Flash/ROM空间: > 64 kB (推荐180 kB)

  • RAM空间: 8 kB (推荐24 kB)

  • 1 Frame buffer(显存):在内部SRAM和外部RAM均可

    • 显存大小至少要大于水平像素点(推荐1/10屏幕大小)

  • C99语法

2. 功能特性

  • 控件:支持30多种控件

  • 显示设备:支持任意分辨率屏幕

  • 输入设备:在同一个屏幕上支持多个输入设备

3. 在线demo

官方提供了丰富的demo在线演示,https://lvgl.io/demos,如下是一个打印机界面的demo:41b44b7a9dcc163aa7d98b100a7e1661.png

4. 入门教程和文档

官方提供了基于多种开发板的入门教程:https://lvgl.io/developers,NXP、STM32、ESP32等等。

LVGL的教程和文档:https://docs.lvgl.io/。

韦东山老师提供了LVGL中文文档,非常丰富:http://lvgl.100ask.net

二、PC模拟器

LVGL支持多种模拟器,如下:

  • Eclipse with SDL driver: Recommended on Linux and Mac

  • CodeBlocks: Recommended on Windows

  • VisualStudio with SDL driver: For Windows

  • VSCode with SDL driver: Recommended on Linux and Mac

  • PlatformIO with SDL driver: Recommended on Linux and Mac

那必然选在Linux上用VSCode,照着仓库readme文档直接开搞。

仓库地址:Simulator project for LVGL embedded GUI Library。

(1)需求

  • gcc

  • gdm

  • make

  • vscode

(2)安装 SDL

可以从官网下载(https://www.libsdl.org/),也可以直接安装(我使用的阿里源):

sudo apt-get update
sudo apt-get install -y build-essential libsdl2-dev

(3)拉取源码

git clone --recursive https://github.com/lvgl/lv_sim_vscode_sdl

(4)编译源码 下载完成之后进入源码目录,使用VScode打开(自带工作区):

code .

然后直接编译:

make

编译完成后,可执行文件在build/bin目录下:5cf900a70a19754508367954955b6128.png执行即可看到效果:

./demo

af3d8125911e27a9f3816cd8b5b84416.png078533802edbaad0464a8740667dd31a.png3249931a8acdcdde66c0f53a94560f5f.png(5)更换示例

在main.c中可以选择不同的demo:846e21f39fcdffc291c25ae5e5049e15.png比如这里我选择lv_demo_music的示例,重新编译运行:

c62a5aa47aaaa3ee8d7e45ceda1ac514.png这个界面也太好看了吧~

三、一个简单的示例

在 main.c 中选择 lv_example_switch_1 这个最简单的示例,运行看看效果:954e45500ecd4c2f6d68a8a0e09edff0.png再来看看其示例代码:fee3a67d33886ac58285eab234f7432e.png

可以看到基于lvgl实现界面的代码还算简洁,本文就分享到这里,争取后续给大家分享更多相关的教程。

------------ END ------------

1db66d9b0e5fb954b54a66776f05c815.gif

●专栏《嵌入式工具

●专栏《嵌入式开发》

●专栏《Keil教程》

●嵌入式专栏精选教程

关注公众号回复“加群”按规则加入技术交流群,回复“1024”查看更多内容。

54cfbb8162860925a446f1ede508eecb.png

e94199a6c7e23852c681e17c2cd9ff2a.png

点击“阅读原文”查看更多分享。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐