設(shè)計(jì)廣告圖用什么軟件好用有利于seo優(yōu)化的是
LVGL?(Light and Versatile Graphics Library) 是最流行的免費(fèi)開(kāi)源嵌入式圖形庫(kù),可為任何 MCU、MPU 和顯示類(lèi)型創(chuàng)建漂亮的 UI
嵌入式GUI框架對(duì)比
Features/框架 | LVGL | Flutter-elinux | ArkUI(鴻蒙OS) | AWTK | QT | MIniGUI | emWin | uC/GUI | 柿餅UI |
---|---|---|---|---|---|---|---|---|---|
跨平臺(tái) | 是 | 是 | 鴻蒙OS平臺(tái) | 是 | 是 | 是 | 是 | 是 | 是 |
設(shè)備驅(qū)動(dòng)兼容性 | 多種支持 | 強(qiáng)大 | 強(qiáng)大 | 良好 | 良好 | 容易擴(kuò)展 | 強(qiáng)大 | 強(qiáng)大 | 強(qiáng)大 |
體積大小 | 小 | 較大 | 適中 | 適中 | 較大 | 小 | 小 | 小 | 小 |
開(kāi)發(fā)環(huán)境 | C/C++ | Dart | C/C++ | C/C++ | C++ | C/C++ | C/C++ | C/C++ | C/C++ |
2D/3D圖形 | 2D | 3D渲染引擎 | 2D/3D | 2D和3D | 2D和3D | 2D | 2D | 2D | 2D |
社區(qū)支持與文檔 | 良好 | 非常強(qiáng)大 | 良好 | 良好 | 強(qiáng)大 | 一般 | 良好 | 一般 | 一般 |
多媒體支持 | 部分 | 部分,可能需額外實(shí)現(xiàn) | 部分 | 部分 | 部分 | 部分 | 部分 | 部分 | 部分 |
開(kāi)發(fā)工具鏈支持 | 支持 | Flutter提供的工具鏈 | 支持 | 支持 | 支持 | 支持 | 支持 | 支持 | 支持 |
應(yīng)用場(chǎng)景 | 嵌入式設(shè)備、小屏幕設(shè)備 | 設(shè)計(jì)獨(dú)立于硬件需求 | 鴻蒙OS平臺(tái)相關(guān)應(yīng)用 | 嵌入式設(shè)備、大屏幕設(shè)備 | 多平臺(tái)多設(shè)備應(yīng)用 | 嵌入式設(shè)備 | 嵌入式系統(tǒng)等 | 嵌入式設(shè)備 | 嵌入式設(shè)備 |
許可證/license | MIT | BSD-style license | Apache License 2.0 | 私有 | 商業(yè)(需要購(gòu)買(mǎi))、開(kāi)源(GPL/LGPL) | 私有,部分LGPL | 商業(yè)(需要購(gòu)買(mǎi)) | 商業(yè)(需要購(gòu)買(mǎi)) | 私有 |
費(fèi)用/cost | 免費(fèi) | 免費(fèi)(開(kāi)源) | 免費(fèi)(開(kāi)源) | 收費(fèi) | 社區(qū)版免費(fèi)、商業(yè)版收費(fèi) | 部分免費(fèi)/商業(yè) | 收費(fèi) | 收費(fèi) | 收費(fèi) |
在嵌入式設(shè)備場(chǎng)景,資源比較受限的情況,從渲染性能、許可費(fèi)用、社區(qū)活躍度等做綜合對(duì)比,LVGL是目前相對(duì)較好的選擇。
LVGL是如何渲染UI的?
LVGL最低配置要求
- 16、32 或 64 位微控制器或處理器
- 建議使用 >16 MHz 時(shí)鐘速度
- 閃存/ROM: > 64 kB 用于非常重要的組件 (> 建議使用 180 kB)
- RAM:
- 靜態(tài) RAM 使用量:~2 kB,取決于使用的功能和對(duì)象類(lèi)型
- 堆: > 2kB (> 建議使用 8 kB)
- 動(dòng)態(tài)數(shù)據(jù)(堆): > 2 KB (> 如果使用多個(gè)對(duì)象,建議使用 16 kB). 在 lv_conf.h 文件中配置 LV_MEM_SIZE 生效。
- 顯示緩沖區(qū):> “水平分辨率”像素(推薦 >10 × 10ד 水平分辨率”)
- MCU或外部顯示控制器中的一個(gè)幀緩沖區(qū)
- C99 或更新的編譯器
https://docs.lvgl.io/master/intro/index.html
LVGL 架構(gòu)
在這里插入圖片描述
應(yīng)用程序可以與庫(kù)通信以創(chuàng)建 GUI。它包含一個(gè) HAL(硬件抽象層)接口來(lái)注冊(cè)您的顯示和輸入設(shè)備驅(qū)動(dòng)程序。
LVGL初始化流程
在這里插入圖片描述
- 調(diào)用
lv_init()
, 初始化LVGL - 實(shí)現(xiàn)顯示設(shè)備驅(qū)動(dòng)的注冊(cè)
- 實(shí)現(xiàn)輸入設(shè)備驅(qū)動(dòng)的注冊(cè)
- 實(shí)現(xiàn)tick_thread 和 handler_thread
具體參考: https://docs.lvgl.io/master/get-started/quick-overview.html#add-lvgl-into-your-project
LVGL 渲染鏈路解析
在這里插入圖片描述
在嵌入式系統(tǒng)中,CPU 是控制整個(gè)系統(tǒng)的核心,FrameBuffer 是用于存儲(chǔ)屏幕上的圖像信息的緩沖區(qū),LCD 屏是用于顯示圖像的硬件設(shè)備。LVGL 庫(kù)的底層原理是通過(guò) CPU、FrameBuffer 和 LCD 屏之間的協(xié)作實(shí)現(xiàn)圖形界面的顯示和交互。
具體來(lái)說(shuō),當(dāng)應(yīng)用程序需要顯示圖形界面時(shí),LVGL 庫(kù)會(huì)調(diào)用底層驅(qū)動(dòng)程序來(lái)初始化 FrameBuffer 緩沖區(qū),并將緩沖區(qū)中的圖像信息傳遞給 LCD 屏進(jìn)行顯示。此時(shí),CPU 會(huì)持續(xù)不斷地將應(yīng)用程序中的圖形繪制指令傳遞給 LVGL 庫(kù),LVGL 庫(kù)則將這些指令轉(zhuǎn)換為對(duì) FrameBuffer 緩沖區(qū)的操作,并通過(guò)底層驅(qū)動(dòng)程序?qū)⒉僮鱾鬟f給 LCD 屏進(jìn)行顯示。
同時(shí),LVGL 庫(kù)還會(huì)通過(guò)底層驅(qū)動(dòng)程序來(lái)監(jiān)測(cè)設(shè)備上的事件,如按鍵事件、觸摸事件等,并將事件信息傳遞給 LVGL 庫(kù)中的事件處理函數(shù)進(jìn)行處理。在事件處理函數(shù)中,LVGL 庫(kù)會(huì)根據(jù)事件類(lèi)型和事件發(fā)生的位置等信息來(lái)進(jìn)行相應(yīng)的操作,如改變窗口的位置、更新按鈕的狀態(tài)等。這些操作也是通過(guò)對(duì) FrameBuffer 緩沖區(qū)的操作來(lái)實(shí)現(xiàn)的。
此外,LVGL 庫(kù)中的對(duì)象(如窗口、按鈕等)需要?jiǎng)討B(tài)分配內(nèi)存來(lái)存儲(chǔ)其屬性和狀態(tài)信息。LVGL 庫(kù)通過(guò)內(nèi)存池的方式來(lái)管理對(duì)象的內(nèi)存分配和釋放,提高了內(nèi)存的使用效率。
CPU、FrameBuffer 和 LCD 屏之間的協(xié)作是 LVGL 庫(kù)實(shí)現(xiàn)圖形界面的關(guān)鍵。CPU 通過(guò)調(diào)用 LVGL 庫(kù)中的函數(shù)來(lái)操作 FrameBuffer 緩沖區(qū),而 LVGL 庫(kù)則通過(guò)底層驅(qū)動(dòng)程序來(lái)將緩沖區(qū)中的圖像信息傳遞給 LCD 屏進(jìn)行顯示。
補(bǔ)充知識(shí):Linux FrameBuffer驅(qū)動(dòng)框架
LCD控制鏈路
在這里插入圖片描述
FrameBuffer驅(qū)動(dòng)框架
在這里插入圖片描述
幀緩沖實(shí)際上是內(nèi)存中的一塊物理內(nèi)存,驅(qū)動(dòng)程序控制顯示控制器將這塊內(nèi)存中的數(shù)據(jù)傳輸?shù)斤@示設(shè)備上,應(yīng)用程序只需要向這塊內(nèi)存寫(xiě)入圖像數(shù)據(jù),顯示控制器就會(huì)將圖像數(shù)據(jù)傳輸?shù)斤@示設(shè)備上,完成圖像的顯示。
總結(jié)
LVGL 是目前主流的嵌入式GUI框架,可以通過(guò)它很便捷的開(kāi)發(fā)應(yīng)用層的交互頁(yè)面,通過(guò)深入學(xué)習(xí)底層原理能夠更好的理解LCD屏幕和FrameBuffer和驅(qū)動(dòng)之間的關(guān)系,可以為我們后續(xù)優(yōu)化LVGL顯示性能打下基礎(chǔ)。
淺析嵌入式GUI框架-LVGL - 知乎 (zhihu.com)