一、新建一个工程模板

在这里插入图片描述

二、克隆lvgl所需要的库

找到刚才创建的工程blink,在里面创建一个 components 文件夹
在这里插入图片描述

克隆所需的最新的 LVGL依赖库，(2021.11.16) V8.1 为例：

git clone -b release/v8.1 https://github.com/lvgl/lvgl

克隆所需的最新的针对ESP32芯片系列的LVGL驱动库

git clone https://github.com/lvgl/lvgl_esp32_drivers

在这里插入图片描述

三、你可能会遇到下面这个问题（示例）：

在这里插入图片描述

四、开始移植

在这里插入图片描述
代码如下（示例）：

lvgl_init.h

#include "freertos/FreeRTOS.h"
#include "freertos/event_groups.h"
#include "lvgl.h"
#include "freertos/semphr.h"
#include "esp_system.h"

/* Littlevgl specific */
#ifdef LV_LVGL_H_INCLUDE_SIMPLE
#include "lvgl.h"
#else
#include "lvgl/lvgl.h"
#endif

#include "lvgl_helpers.h"
#include "lvgl/src/hal/lv_hal_disp.h"

#define LV_TICK_PERIOD_MS 1
#define BUF_W 20
#define BUF_H 10

void lv_tick_task(void *arg);
void guiTask1(void *pvParameter);
void Show_State();

lvgl_init.c

#include "lvgl_init.h"
// #include "lv_examples/src/lv_demo_music/lv_demo_music.h"
// #include "lv_examples/src/lv_demo_benchmark/lv_demo_benchmark.h"
// #include "lv_examples/src/lv_demo_widgets/lv_demo_widgets.h"
/**********************
 *  STATIC PROTOTYPES
 **********************/

void lv_tick_task(void *arg)
{
    lv_tick_inc(LV_TICK_PERIOD_MS);
}
/* Creates a semaphore to handle concurrent call to lvgl stuff
 * If you wish to call *any* lvgl function from other threads/tasks
 * you should lock on the very same semaphore! */
SemaphoreHandle_t xGuiSemaphore;

/*********************** GUI_SHOW_CODE_START***********************/
lv_obj_t *label_1;
lv_obj_t *label_2;

void Show_State()
{
    lv_obj_t *scr = lv_scr_act(); //创建scr
    lv_obj_set_pos(scr, 0, 0);
    lv_scr_load(scr);

    label_1 = lv_label_create(scr);                         //创建label
    lv_label_set_recolor(label_1, 1);                       //颜色可变换
    lv_label_set_long_mode(label_1, LV_LABEL_LONG_DOT);     //设置滚动模式
    lv_obj_set_pos(label_1, 10, 10);                        //设置位置
    lv_obj_set_size(label_1, 160, 30);                      //设定大小
    lv_label_set_text(label_1, "This is a GUI thread yes"); //设定文本内容

    label_2 = lv_label_create(scr);                            //创建label
    lv_label_set_recolor(label_2, 1);                          //颜色可变换
    lv_label_set_long_mode(label_2, LV_LABEL_LONG_SCROLL);     //设置滚动模式
    lv_obj_set_pos(label_2, 10, 40);                           //设置位置
    lv_obj_set_size(label_2, 160, 40);                         //设定大小
    lv_label_set_text(label_2, "This is the Intetnet thread"); //设定文本内容
}
/*********************** GUI_SHOW_CODE_END***********************/

void guiTask1(void *pvParameter)
{

    (void)pvParameter;
    xGuiSemaphore = xSemaphoreCreateMutex();

    lv_init();
    /* Initialize SPI or I2C bus used by the drivers */
    lvgl_driver_init();

    lv_color_t *buf1 = heap_caps_malloc(DISP_BUF_SIZE * sizeof(lv_color_t), MALLOC_CAP_DMA);
    // memset(buf1,0x00ff,DISP_BUF_SIZE * sizeof(lv_color_t));
    assert(buf1 != NULL);

    /* Use double buffered when not working with monochrome displays */
#ifndef CONFIG_LV_TFT_DISPLAY_MONOCHROME
    lv_color_t *buf2 = heap_caps_malloc(DISP_BUF_SIZE * sizeof(lv_color_t), MALLOC_CAP_DMA);
    //memset(buf2,0x00ff,DISP_BUF_SIZE * sizeof(lv_color_t));
    assert(buf2 != NULL);
#else
    static lv_color_t *buf2 = NULL;
#endif

    static lv_disp_draw_buf_t disp_buf;

    uint32_t size_in_px = DISP_BUF_SIZE;

#if defined CONFIG_LV_TFT_DISPLAY_CONTROLLER_IL3820 || defined CONFIG_LV_TFT_DISPLAY_CONTROLLER_JD79653A || defined CONFIG_LV_TFT_DISPLAY_CONTROLLER_UC8151D || defined CONFIG_LV_TFT_DISPLAY_CONTROLLER_SSD1306

    /* Actual size in pixels, not bytes. */
    size_in_px *= 8;
#endif

    /* Initialize the working buffer depending on the selected display.
     * NOTE: buf2 == NULL when using monochrome displays. */
    lv_disp_draw_buf_init(&disp_buf, buf1, buf2, size_in_px);

    lv_disp_drv_t disp_drv;
    lv_disp_drv_init(&disp_drv);
    disp_drv.hor_res = LV_HOR_RES_MAX;
    disp_drv.ver_res = LV_VER_RES_MAX;
    disp_drv.flush_cb = disp_driver_flush;
    disp_drv.draw_buf = &disp_buf;
    lv_disp_drv_register(&disp_drv);
    /* Register an input device when enabled on the menuconfig */
#if CONFIG_LV_TOUCH_CONTROLLER != TOUCH_CONTROLLER_NONE
    lv_indev_drv_t indev_drv;
    lv_indev_drv_init(&indev_drv);
    indev_drv.read_cb = touch_driver_read;
    indev_drv.type = LV_INDEV_TYPE_POINTER;
    lv_indev_drv_register(&indev_drv);
#endif

    /* Create and start a periodic timer interrupt to call lv_tick_inc */
    const esp_timer_create_args_t periodic_timer_args = {
        .callback = &lv_tick_task,
        .name = "periodic_gui"};
    esp_timer_handle_t periodic_timer;
    ESP_ERROR_CHECK(esp_timer_create(&periodic_timer_args, &periodic_timer));
    ESP_ERROR_CHECK(esp_timer_start_periodic(periodic_timer, LV_TICK_PERIOD_MS * 1000));

    Show_State();
    // lv_demo_music();
    // lv_demo_benchmark();
    // lv_demo_widgets();
    while (1)
    {
        /* Delay 1 tick (assumes FreeRTOS tick is 10ms */
        vTaskDelay(pdMS_TO_TICKS(10));

        /* Try to take the semaphore, call lvgl related function on success */
        if (pdTRUE == xSemaphoreTake(xGuiSemaphore, portMAX_DELAY))
        {
            lv_task_handler();
            xSemaphoreGive(xGuiSemaphore);
        }
    }
    /* A task should NEVER return */
    free(buf1);
#ifndef CONFIG_LV_TFT_DISPLAY_MONOCHROME
    free(buf2);
#endif
    vTaskDelete(NULL);
}

blink.c

/* Blink Example

   This example code is in the Public Domain (or CC0 licensed, at your option.)

   Unless required by applicable law or agreed to in writing, this
   software is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
   CONDITIONS OF ANY KIND, either express or implied.
*/
#include <stdio.h>
#include "freertos/FreeRTOS.h"
#include "freertos/task.h"
#include "driver/gpio.h"
#include "sdkconfig.h"

#include "lvgl_init.h"

/* Can use project configuration menu (idf.py menuconfig) to choose the GPIO to blink,
   or you can edit the following line and set a number here.
*/
#define BLINK_GPIO CONFIG_BLINK_GPIO
extern void guiTask1(void *pvParameter);

void app_main(void)
{
    /* Configure the IOMUX register for pad BLINK_GPIO (some pads are
       muxed to GPIO on reset already, but some default to other
       functions and need to be switched to GPIO. Consult the
       Technical Reference for a list of pads and their default
       functions.)
    */
    xTaskCreatePinnedToCore(guiTask1, "gui", 4096 * 2, NULL, 1, NULL, 1);
    gpio_reset_pin(BLINK_GPIO);
    /* Set the GPIO as a push/pull output */
    gpio_set_direction(BLINK_GPIO, GPIO_MODE_OUTPUT);
    while (1)
    {
        /* Blink off (output low) */
        printf("Turning off the LED\n");
        gpio_set_level(BLINK_GPIO, 0);
        vTaskDelay(1000 / portTICK_PERIOD_MS);
        /* Blink on (output high) */
        printf("Turning on the LED\n");
        gpio_set_level(BLINK_GPIO, 1);
        vTaskDelay(1000 / portTICK_PERIOD_MS);
    }
}