移植littleVGL庫(kù)到OpenHarmony過(guò)程分享（一）
作者：一口氣吃不成胖子
本篇帶給大家移植輕量級(jí)通用型圖形庫(kù)到OpenHarmony的相關(guān)內(nèi)容，希望能夠幫助到你！
??想了解更多關(guān)于開(kāi)源的內(nèi)容，請(qǐng)?jiān)L問(wèn)：??
??51CTO 開(kāi)源基礎(chǔ)軟件社區(qū)??
一、項(xiàng)目簡(jiǎn)介
1、littleVGL 主要特性如下
- 具有非常豐富的內(nèi)置控件,像 buttons, charts, lists, sliders, images 等。
- 高級(jí)圖形效果：動(dòng)畫，反鋸齒，透明度，平滑滾動(dòng)。
- 支持多種輸入設(shè)備,像 touchpad, mouse, keyboard, encoder 等。
- 支持多語(yǔ)言的 UTF-8 編碼 ? 支持多個(gè)和多種顯示設(shè)備，例如同步顯示在多個(gè)彩色屏或單色屏上。
- 完全自定制的圖形元素。
- 硬件獨(dú)立于任何微控制器或顯示器。
- 可以縮小到最小內(nèi)存 (64 kB Flash, 16 kB RAM)。
- 支持操作系統(tǒng)、外部?jī)?chǔ)存和 GPU（非必須）。
- 僅僅單個(gè)幀緩沖設(shè)備就可以呈現(xiàn)高級(jí)視覺(jué)特效。
- 使用 C 編寫以獲得最大兼容性(兼容 C++)。
- 支持 PC 模擬器。
- 為加速 GUI 設(shè)計(jì),提供教程,案例和主題,支持響應(yīng)式布局。
- 提供了在線和離線文檔。
- 基于自由和開(kāi)源的 MIT 協(xié)議。
2、littleVGL 的要求如下:
- 16、32 或 64 位的單片機(jī)（微控制器）或處理器。
- 微處理器的主頻最好高于 16MHZ。
- Flash/ROM:如果只用 littleVGL 核心組件的話,則至少需要 64kB 的容量,如果想完整使用的 話,最好保證 180kB 以上的容量。
- RAM:
- 靜態(tài) RAM: 大約 8 到 16 kB,這取決于你所用的組件功能和 objects 控件對(duì)象類型。
- 棧: 至少為 2Kb,一般推薦值為 4kBo 動(dòng)態(tài)數(shù)據(jù)(堆): 至少 4kB,如果你用到了多個(gè)或多種控件的話,那么最好設(shè)置為 16kB 以 上,這個(gè)是可以通過(guò) lv_conf.h 配置文件中的 LV_MEM_SIZE 宏來(lái)定義的。
- 顯示緩沖區(qū): 至少要比”水平分辨率像素”要大,一般推介值為 10 倍的”水平分辨率像 素”,取個(gè)例子,假如我們屏幕的水平分辨率為480個(gè)像素,采用16位的顏色深度進(jìn)行顯 示,即一個(gè)像素占 2 個(gè)字節(jié),那么推介的顯示緩沖區(qū)大小為 104802=9600 個(gè)字節(jié)。
- C99 或更新的編譯器,如果是用 keil 開(kāi)發(fā)的話,一定得勾選”c99”模式,否則編譯會(huì)報(bào)錯(cuò)的。
- 基本的 c(或者 c++)語(yǔ)言知識(shí),如:指針,結(jié)構(gòu)體,回調(diào)函數(shù)。
3、開(kāi)源項(xiàng)目鏈接
- littleVGL 的官方網(wǎng)址為:??https://littlevgl.com??
- littleVGL 的 github 網(wǎng)址為:??https://github.com/littlevgl/lvgl??
- littleVGL 的在線文檔網(wǎng)址為:??https://docs.littlevgl.com/zh-CN/html/index.html??
二、 littleVGL 移植
1、開(kāi)發(fā)前準(zhǔn)備
- 本次分享硬件采用的是HI3861開(kāi)發(fā)板和SPI驅(qū)動(dòng)的TFT顯示屏。
- 搭建環(huán)境請(qǐng)參考上一篇文章。
- 軟件包已上傳附件，感興趣可下載體驗(yàn)移植的樂(lè)趣。
2、項(xiàng)目創(chuàng)建
（1）在applications/sample/wifi-iot/app目錄下創(chuàng)建一個(gè)GUI文件夾
GUI 目錄是用來(lái)存放跟 littleVGL 庫(kù)相關(guān)的所有文件的。
（2）解壓lv_pc_simulator.zip包
接著把 lv_pc_simulator.zip 壓縮包里面的 lv_examples.zip 和 lvgl.zip 倆個(gè)子壓縮包直接拷 貝到GUI 目錄下,拷貝完成之后,接著分別對(duì)lv_examples.zip 和 lvgl.zip 倆個(gè)子壓縮包 在當(dāng)前目錄下進(jìn)行解壓縮操作,解壓縮完成后,可以把 lv_examples.zip 和 lvgl.zip 都刪除了。
（3）拷貝配置模板文件
接 著把 GUI/lvgl/lv_conf_template.h 和 GUI/lv_examples/lv_ex_conf_templ.h 倆 個(gè)配置模板文件統(tǒng)統(tǒng)拷貝到 GUI 目錄下,然后對(duì)這個(gè) 2 文件分別重命名為 lv_conf.h和 lv_ex_conf.h。
（4）新建lvgl_driver子目錄
接著還要在 GUI 目錄下新建一個(gè) lvgl_driver子目錄,這個(gè)目錄是用來(lái) 放底層顯示驅(qū)動(dòng)和觸摸驅(qū)動(dòng)文件的,最后 GUI 的目錄結(jié)構(gòu)如下圖所示：
注:在實(shí)際項(xiàng)目中,可以刪除掉 lv_examples 目錄來(lái)減少項(xiàng)目所占的磁盤空間,因?yàn)榇四夸浘褪?專門用來(lái)存放官方的演示 demo,對(duì)我們的實(shí)際項(xiàng)目沒(méi)有任何作用。
3、編寫B(tài)UILD.gn文件
在GUI目錄下添加BUILD.gn文件
group("GUI") {
deps = [
"lvgl:lvgl",
"lvgl_driver:lvgl_port",
]
}
在GUI/lvgl_driver目錄下添加BUILD.gn文件：
static_library("lvgl_port") {
sources = [
"lv_port_disp.c",
]
include_dirs = [
"http://base/iot_hardware/peripheral/interfaces/kits",
"../../",
"../lvgl_driver",
]
}
在GUI/lv_examples目錄下添加BUILD.gn文件：
static_library("lv_examples") {
sources = [
"src/lv_demo_widgets/lv_demo_widgets.c",
]
cflags = [ "-Wno-unused-variable" ]
cflags += [ "-Wno-unused-but-set-variable" ]
cflags += [ "-Wno-unused-parameter" ]
include_dirs = [
"src/lv_demo_widgets",
]
}
在GUI/lvgl/BUILD.gn目錄下添加BUILD.gn文件：
static_library("lvgl") {
sources = [
"src/lv_core/lv_disp.c",
"src/lv_core/lv_group.c",
"src/lv_core/lv_indev.c",
"src/lv_core/lv_obj.c",
"src/lv_core/lv_refr.c",
"src/lv_core/lv_style.c",
"src/lv_draw/lv_draw_basic.c",
"src/lv_draw/lv_draw.c",
"src/lv_draw/lv_draw_rect.c",
"src/lv_draw/lv_draw_label.c",
"src/lv_draw/lv_draw_line.c",
"src/lv_draw/lv_draw_img.c",
"src/lv_draw/lv_draw_arc.c",
"src/lv_draw/lv_draw_triangle.c",
"src/lv_draw/lv_img_decoder.c",
"src/lv_draw/lv_img_cache.c",
"src/lv_font/lv_font.c",
"src/lv_font/lv_font_fmt_txt.c",
"src/lv_font/lv_font_roboto_12.c",
"src/lv_font/lv_font_roboto_16.c",
"src/lv_font/lv_font_roboto_22.c",
"src/lv_font/lv_font_roboto_28.c",
"src/lv_font/lv_font_unscii_8.c",
"src/lv_hal/lv_hal_disp.c",
"src/lv_hal/lv_hal_indev.c",
"src/lv_hal/lv_hal_tick.c",
"src/lv_misc/lv_circ.c",
"src/lv_misc/lv_area.c",
"src/lv_misc/lv_task.c",
"src/lv_misc/lv_fs.c",
"src/lv_misc/lv_anim.c",
"src/lv_misc/lv_mem.c",
"src/lv_misc/lv_ll.c",
"src/lv_misc/lv_color.c",
"src/lv_misc/lv_txt.c",
"src/lv_misc/lv_math.c",
"src/lv_misc/lv_log.c",
"src/lv_misc/lv_gc.c",
"src/lv_misc/lv_utils.c",
"src/lv_misc/lv_async.c",
"src/lv_themes/lv_theme_alien.c",
"src/lv_themes/lv_theme.c",
"src/lv_themes/lv_theme_default.c",
"src/lv_themes/lv_theme_night.c",
"src/lv_themes/lv_theme_templ.c",
"src/lv_themes/lv_theme_zen.c",
"src/lv_themes/lv_theme_material.c",
"src/lv_themes/lv_theme_nemo.c",
"src/lv_themes/lv_theme_mono.c",
"src/lv_objx/lv_arc.c",
"src/lv_objx/lv_bar.c",
"src/lv_objx/lv_cb.c",
"src/lv_objx/lv_ddlist.c",
"src/lv_objx/lv_kb.c",
"src/lv_objx/lv_line.c",
"src/lv_objx/lv_mbox.c",
"src/lv_objx/lv_preload.c",
"src/lv_objx/lv_roller.c",
"src/lv_objx/lv_table.c",
"src/lv_objx/lv_tabview.c",
"src/lv_objx/lv_tileview.c",
"src/lv_objx/lv_btn.c",
"src/lv_objx/lv_calendar.c",
"src/lv_objx/lv_chart.c",
"src/lv_objx/lv_canvas.c",
"src/lv_objx/lv_gauge.c",
"src/lv_objx/lv_label.c",
"src/lv_objx/lv_list.c",
"src/lv_objx/lv_slider.c",
"src/lv_objx/lv_ta.c",
"src/lv_objx/lv_spinbox.c",
"src/lv_objx/lv_btnm.c",
"src/lv_objx/lv_cont.c",
"src/lv_objx/lv_img.c",
"src/lv_objx/lv_imgbtn.c",
"src/lv_objx/lv_led.c",
"src/lv_objx/lv_lmeter.c",
"src/lv_objx/lv_page.c",
"src/lv_objx/lv_sw.c",
"src/lv_objx/lv_win.c",
]
cflags = [ "-Wno-unused-variable" ]
cflags += [ "-Wno-unused-but-set-variable" ]
cflags += [ "-Wno-unused-parameter" ]
include_dirs = [
"lvgl",
]
}
先分享到這里，接下來(lái)將會(huì)帶大家一起深入了解它的一些細(xì)節(jié)要修改的地方！
??想了解更多關(guān)于開(kāi)源的內(nèi)容，請(qǐng)?jiān)L問(wèn)：??
責(zé)任編輯：jianghua
來(lái)源：
鴻蒙社區(qū)
