想要移植LVGL嗎？想用GUIguider來(lái)設(shè)計(jì)GUI界面嗎？

下面開(kāi)始一步步教你怎么移植LVGL，用GUIguider來(lái)設(shè)計(jì)GUI界面。

以下是通用的移植設(shè)計(jì)步驟。

首先安裝GUI guider，本次使用的是1.5.1版本GUI guider。打開(kāi)軟件，選擇創(chuàng)建新工程。

選擇V8.3.2版本的LVGL。

選擇模擬的。

選擇一個(gè)模板，這里選了空模板。

設(shè)置工程路徑，名稱(chēng)。設(shè)置lcd屏幕大小和顏色位數(shù)，要和你實(shí)際需要移植的lcd屏對(duì)應(yīng)。

下面就是新建的工程了，后面就餓可以設(shè)置面板控制的。

記得點(diǎn)右上角先生成更新代碼。

GUIguider工程先這樣了，下面開(kāi)始基本移植工程。

移植之前你需要已經(jīng)移植好LCD驅(qū)動(dòng)，LCD能正常顯示圖片。工程的堆棧要大一些，RAM容量要大。否則會(huì)資源不足。

首先將你LCD顯示的模板工程復(fù)制到GUIguider工程目錄中。

這里使用的LPC55S69。

打開(kāi)keil工程先添加所有LVGL文件內(nèi)源碼。

然后添加lvgl的頭文件路徑。

然后從GUIguider工程目錄lvgl-simulator文件夾下復(fù)制lv_conf.h文件到我們要移植的lpc55s69工程內(nèi)。并添加到keil工程中，到時(shí)需要修改配置LVGL功能。

下面就移植對(duì)接LCD顯示。這時(shí)就需要lcd繪圖API驅(qū)動(dòng)了。

下面就是參考lvgl-simulator內(nèi)驅(qū)動(dòng)寫(xiě)法。

void ili9341_flush(lv_disp_drv_t * drv, const lv_area_t * area, lv_color_t * color_p)
{
if(area->x2 < 0 || area->y2 < 0 || area->x1 > (GLCD_WIDTH - 1) || area->y1 > (GLCD_HEIGHT - 1)) {
lv_disp_flush_ready(drv);
return;
}

/* Truncate the area to the screen */
int32_t act_x1 = area->x1 < 0 ? 0 : area->x1;
int32_t act_y1 = area->y1 < 0 ? 0 : area->y1;
int32_t act_x2 = area->x2 > GLCD_WIDTH - 1 ? GLCD_WIDTH - 1 : area->x2;
int32_t act_y2 = area->y2 > GLCD_HEIGHT - 1 ? GLCD_HEIGHT - 1 : area->y2;

lcd_draw_bitmap(act_x1,act_y1,1+act_x2-act_x1,1+act_y2-act_y1,(uint8_t *)color_p);

lv_disp_flush_ready(drv);
}

/**
* Initialize the Hardware Abstraction Layer (HAL) for the Littlev graphics library
*/
static void lv_hal_init(void)
{
/*Create a display buffer*/
static lv_disp_draw_buf_t disp_buf1;
static lv_color_t buf1_1[LV_HOR_RES_MAX * 10];
lv_disp_draw_buf_init(&disp_buf1, buf1_1, NULL, LV_HOR_RES_MAX * 10);

/*Create a display*/
lv_disp_drv_t disp_drv;
lv_disp_drv_init(&disp_drv); /*Basic initialization*/
disp_drv.draw_buf = &disp_buf1;
disp_drv.flush_cb = ili9341_flush;
disp_drv.hor_res = LV_HOR_RES_MAX;
disp_drv.ver_res = LV_VER_RES_MAX;
lv_disp_drv_register(&disp_drv);

/* Add the mouse as input device
* Use the 'mouse' driver which reads the PC's mouse*/
// mouse_init();
// lv_indev_drv_t indev_drv;
// lv_indev_drv_init(&indev_drv); /*Basic initialization*/
// indev_drv.type = LV_INDEV_TYPE_POINTER;
// indev_drv.read_cb = mouse_read; /*This function will be called periodically (by the library) to get the mouse position and state*/
// lv_indev_t * mouse_indev = lv_indev_drv_register(&indev_drv);
//
}

下面就是main初始化lvgl了。

main.c添加頭文件：

#include "lvgl.h"

先初始化lcd，再初始化lvgl-》lv_init()。再就是lcd對(duì)接到lvgl初始化lv_hal_init();

lcd_init();
lcd_fill(0,0,GLCD_WIDTH-1,GLCD_HEIGHT-1,GLCD_COLOR_RED);
Delay_ms(500);
lcd_fill(0,0,GLCD_WIDTH-1,GLCD_HEIGHT-1,GLCD_COLOR_GREEN);
Delay_ms(500);
lcd_fill(0,0,GLCD_WIDTH-1,GLCD_HEIGHT-1,GLCD_COLOR_BLUE);
Delay_ms(500);

printf("hello world.rn");

lv_init();
lv_hal_init();

main主循環(huán)調(diào)用

while (1)
{
lv_task_handler();
}

下面定時(shí)1ms調(diào)用lv_tick_inc(1);

volatile uint32_t time_tick_cnt;
void SysTick_Handler(void)
{
extern void lv_tick_inc(uint32_t tick_period);
lv_tick_inc(1);
time_tick_cnt++;
}

好了，到這里lvgl基本移植好了。

下面就是移植GUI guider設(shè)計(jì)的界面了。

我們先用GUI guider添加幾個(gè)控件到LCD畫(huà)面上。類(lèi)是如下，然后點(diǎn)擊右上角GenerateCode，更新代碼。

更新代碼主要在下面2個(gè)文件夾內(nèi)。

把下面2個(gè)文件夾內(nèi)容代碼加到keil工程中，并添加頭文件包含路徑。

添加頭文件：

#include "gui_guider.h"
#include "events_init.h"
#include "custom.h"

在就是在main內(nèi)定義變量：

lv_ui guider_ui;

初始化：

setup_ui(&guider_ui);
events_init(&guider_ui);
custom_init(&guider_ui);

最后編譯keil工程，正常就可以編譯通過(guò)了。

需要配置lvgl功能，請(qǐng)?jiān)趌v_conf.h內(nèi)配置以下。主要內(nèi)存占用。