LVGL基础之模拟开发与移植：从PC原型到嵌入式硬件的完整实践

# Ubuntu/Debian
sudo apt-get update && sudo apt-get install -y build-essential libsdl2-dev cmake

# Arch Linux
sudo pacman -Syu && sudo pacman -S sdl2 base-devel cmake

# macOS (Homebrew)
brew install sdl2 cmake make

# Fedora
sudo dnf install @development-tools cmake SDL2-devel

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

lv_port_pc_vscode/
├── lvgl/              # LVGL核心源码（子模块）
├── lv_conf.h          # LVGL配置文件
├── main.c             # 主程序入口
├── simulator.code-workspace  # VSCode工作区文件
└── CMakeLists.txt     # CMake构建配置

/* 颜色深度：根据目标显示屏设置 */
#define LV_COLOR_DEPTH 16  /* 可选: 1, 8, 16, 24, 32 */

/* 内存分配方式：0使用LVGL内置分配器，1使用标准C库 */
#define LV_MEM_CUSTOM 0

/* 动态内存大小（仅当LV_MEM_CUSTOM=0时生效） */
#define LV_MEM_SIZE (48U * 1024U)  /* 至少2KB */

/* 启用SDL后端 */
#define LV_USE_SDL 1

#define LV_USE_OS LV_OS_FREERTOS

#define configTOTAL_HEAP_SIZE ( ( size_t ) ( 512 * 1024 * 1024 ) )

/* 使用Linux Framebuffer替代SDL */
#define LV_USE_LINUX_FBDEV 1

lv_display_t *display = lv_linux_fbdev_create();
lv_linux_fbdev_set_file(display, "/dev/fb0");

git clone -b v8.3.10 --depth=1 https://github.com/lvgl/lvgl.git

#include "lvgl.h"

/* 定义显示屏分辨率 */
#define DISPLAY_WIDTH  320
#define DISPLAY_HEIGHT 240

/* 帧缓冲区（根据颜色深度计算大小） */
#define BYTES_PER_PIXEL (LV_COLOR_FORMAT_GET_SIZE(LV_COLOR_FORMAT_RGB565))
#define BUFFER_SIZE (DISPLAY_WIDTH * DISPLAY_HEIGHT * BYTES_PER_PIXEL)

static uint8_t buf_1[BUFFER_SIZE];
static uint8_t buf_2[BUFFER_SIZE];  /* 双缓冲，可选 */

void lvgl_init(void)
{
    /* 1. 初始化LVGL核心 */
    lv_init();
    
    /* 2. 创建Display */
    lv_display_t *disp = lv_display_create(DISPLAY_WIDTH, DISPLAY_HEIGHT);
    
    /* 3. 注册flush回调 */
    lv_display_set_flush_cb(disp, my_flush_cb);
    
    /* 4. 设置帧缓冲区（双缓冲） */
    lv_display_set_buffers(disp, buf_1, buf_2, BUFFER_SIZE, LV_DISPLAY_RENDER_MODE_PARTIAL);
}

void my_flush_cb(lv_display_t *disp, const lv_area_t *area, uint8_t *px_map)
{
    /* area->x1, area->y1: 左上角坐标 */
    /* area->x2, area->y2: 右下角坐标 */
    /* px_map: 渲染好的像素数据指针 */
    
    int32_t width = area->x2 - area->x1 + 1;
    int32_t height = area->y2 - area->y1 + 1;
    
    /* 将px_map中的数据通过LCD驱动发送到显示屏 */
    lcd_draw_area(area->x1, area->y1, width, height, px_map);
    
    /* 重要：通知LVGL刷新完成 */
    lv_display_flush_ready(disp);
}

void lvgl_touch_init(void)
{
    lv_indev_t *indev = lv_indev_create();
    lv_indev_set_type(indev, LV_INDEV_TYPE_POINTER);  /* 触摸屏类型 */
    lv_indev_set_read_cb(indev, touch_read_cb);
}

void touch_read_cb(lv_indev_t *indev, lv_indev_data_t *data)
{
    int16_t x, y;
    uint8_t pressed;
    
    /* 从触摸驱动读取坐标和按压状态 */
    touch_driver_read(&x, &y, &pressed);
    
    if (pressed) {
        data->state = LV_INDEV_STATE_PRESSED;
        data->point.x = x;
        data->point.y = y;
    } else {
        data->state = LV_INDEV_STATE_RELEASED;
    }
}

/* 在定时器中断或RTOS任务中调用 */
void timer_interrupt_handler(void)
{
    lv_tick_inc(1);  /* 假设定时器周期为1ms */
}

int main(void)
{
    /* 初始化硬件外设（LCD、触摸、时钟等） */
    hardware_init();
    
    /* 初始化LVGL */
    lvgl_init();
    
    /* 创建UI */
    create_ui();
    
    while (1) {
        lv_timer_handler();  /* 处理LVGL任务 */
        delay_ms(5);         /* 建议5ms间隔 */
    }
}

idf.py add-dependency "espressif/esp_lvgl_port^2.3.0"