第3章：Qt与LVGL的桥梁：QWidget与lv_disp_drv_t的绑定，Qt事件循环与LVGL心跳(tick)的同步机制

这一章，我们聊聊Qt和LVGL怎么“联姻”。

很多朋友问我：为什么非要把LVGL塞进Qt里？直接用Qt的QGraphicsScene画不香吗？

说实话，Qt的2D渲染能力确实强，但LVGL在嵌入式控件生态、内存占用和动画流畅度上，有它独特的优势。我做过一个项目，客户要求界面像手机一样顺滑，Qt的QWidget做复杂动画时CPU占用飙到80%，换成LVGL后直接降到30%。这就是我们绑定的价值。

3.1 核心思路：谁驱动谁？

先理清关系。Qt负责窗口管理、输入事件分发和定时器。LVGL负责控件渲染和动画计算。说白了，Qt是“房东”，LVGL是“租客”。

绑定过程分三步：

  1. 创建画布：在Qt中创建一个QWidget，作为LVGL的“画板”。
  2. 注册显示驱动：把QWidget的像素缓冲区地址告诉LVGL的lv_disp_drv_t。
  3. 同步心跳：让Qt的定时器驱动LVGL的lv_tick_inc()，保证动画和任务按时执行。

关键点：LVGL不直接操作硬件显存，它只操作一块内存缓冲区。这块缓冲区由Qt的QWidget提供。所以，绑定本质上是“内存共享”。

3.2 QWidget与lv_disp_drv_t的绑定实战

直接上代码。这是我项目中提炼出来的最小绑定方案。

// lvgl_widget.h
#include <QWidget>
#include <lvgl.h>

class LvglWidget : public QWidget
{
    Q_OBJECT
public:
    explicit LvglWidget(QWidget *parent = nullptr);
    ~LvglWidget();

protected:
    void paintEvent(QPaintEvent *event) override;
    void resizeEvent(QResizeEvent *event) override;

private:
    void initLvglDisplay();
    void flushDisplay(lv_disp_drv_t *drv, const lv_area_t *area, lv_color_t *color_p);

    lv_disp_drv_t m_disp_drv;
    lv_disp_t *m_disp = nullptr;
    lv_color_t *m_buffer = nullptr;
    int m_buffer_size = 0;
};

// lvgl_widget.cpp
LvglWidget::LvglWidget(QWidget *parent)
    : QWidget(parent)
{
    // 设置Qt属性：关闭背景自动填充，避免闪烁
    setAttribute(Qt::WA_OpaquePaintEvent);
    setAttribute(Qt::WA_NoSystemBackground);
    setAutoFillBackground(false);

    // 初始化LVGL显示驱动
    initLvglDisplay();
}

void LvglWidget::initLvglDisplay()
{
    // 计算缓冲区大小：按屏幕1/10大小分配
    m_buffer_size = width() * height() / 10;
    m_buffer = new lv_color_t[m_buffer_size];

    lv_disp_draw_buf_init(&m_draw_buf, m_buffer, nullptr, m_buffer_size);

    lv_disp_drv_init(&m_disp_drv);
    m_disp_drv.hor_res = width();
    m_disp_drv.ver_res = height();
    m_disp_drv.flush_cb = [](lv_disp_drv_t *drv, const lv_area_t *area, lv_color_t *color_p) {
        // 静态函数中通过用户数据回调用LvglWidget实例
        LvglWidget *self = static_cast<LvglWidget*>(drv->user_data);
        self->flushDisplay(drv, area, color_p);
    };
    m_disp_drv.draw_buf = &m_draw_buf;
    m_disp_drv.user_data = this;

    m_disp = lv_disp_drv_register(&m_disp_drv);
}

void LvglWidget::flushDisplay(lv_disp_drv_t *drv, const lv_area_t *area, lv_color_t *color_p)
{
    // 标记需要重绘的区域
    QRect rect(area->x1, area->y1, area->x2 - area->x1 + 1, area->y2 - area->y1 + 1);
    update(rect);

    // 通知LVGL刷新完成
    lv_disp_flush_ready(drv);
}

void LvglWidget::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    // 直接把LVGL缓冲区内容绘制到QWidget上
    QImage image((uchar*)m_buffer, width(), height(), QImage::Format_ARGB32);
    painter.drawImage(event->rect(), image, event->rect());
}

void LvglWidget::resizeEvent(QResizeEvent *event)
{
    // 重新分配缓冲区
    delete[] m_buffer;
    m_buffer_size = event->size().width() * event->size().height() / 10;
    m_buffer = new lv_color_t[m_buffer_size];
    lv_disp_draw_buf_init(&m_draw_buf, m_buffer, nullptr, m_buffer_size);

    // 更新显示驱动分辨率
    lv_disp_set_res(m_disp, event->size().width(), event->size().height());
}

我的经验：缓冲区大小不要贪大。我一开始分配了全屏缓冲区，结果内存直接爆了。1/10屏幕大小足够，LVGL内部有脏矩形机制，只刷新变化区域。

3.3 Qt事件循环与LVGL心跳同步

LVGL需要定期调用lv_tick_inc()来推进时间，还需要调用lv_task_handler()来处理动画和任务。Qt的事件循环正好提供定时器机制。

我见过有人用QTimer每隔5ms调用一次lv_tick_inc(5)，但这样精度不够。正确的做法是：

  1. 用高精度定时器记录真实时间差。
  2. 在Qt空闲时调用lv_task_handler()。
// 在LvglWidget构造函数中添加
// 使用QElapsedTimer获取精确时间
m_tick_timer.start();

// 创建定时器，每2ms检查一次
QTimer *tick_timer = new QTimer(this);
connect(tick_timer, &QTimer::timeout, this, [this]() {
    uint32_t elapsed = m_tick_timer.elapsed();
    m_tick_timer.restart();
    lv_tick_inc(elapsed);
});
tick_timer->start(2);

// 使用QTimer驱动LVGL任务处理
QTimer *task_timer = new QTimer(this);
connect(task_timer, &QTimer::timeout, this, [this]() {
    lv_task_handler();
});
task_timer->start(5);

注意：lv_task_handler()不能在中断或高优先级线程中调用。它内部会执行控件回调，可能触发Qt的paintEvent。我踩过这个坑——在非GUI线程调用，程序直接崩溃。

3.4 事件传递：从Qt到LVGL

鼠标、触摸、键盘事件怎么传给LVGL？

重写QWidget的mousePressEvent、mouseMoveEvent、mouseReleaseEvent，然后调用LVGL的lv_indev_t接口。

void LvglWidget::mousePressEvent(QMouseEvent *event)
{
    lv_point_t point = { event->x(), event->y() };
    lv_indev_set_param(m_indev, LV_INDEV_TYPE_POINTER, &point);
    lv_indev_read(m_indev);
}

void LvglWidget::mouseReleaseEvent(QMouseEvent *event)
{
    lv_indev_set_param(m_indev, LV_INDEV_TYPE_POINTER, nullptr);
    lv_indev_read(m_indev);
}

这里有个细节：LVGL的输入设备需要注册一个read_cb回调。回调里把坐标和状态存到lv_indev_data_t中。

避坑指南：Qt的mouseMoveEvent默认只在按下时触发。如果你需要悬停效果，记得调用setMouseTracking(true)。我曾经因为这个浪费了半天排查。

3.5 整体架构图

下面这张图展示了Qt与LVGL的完整绑定关系：

Qt与LVGL绑定架构图 Qt与LVGL绑定架构 Qt事件循环 QApplication::exec() QTimer (2ms/5ms) 驱动心跳与任务 LvglWidget paintEvent / resizeEvent LVGL核心 lv_task_handler() lv_disp_drv_t flush_cb / draw_buf lv_color_t 缓冲区 共享内存区域 lv_tick_inc() lv_task_handler() flush_cb 回调 update() 触发重绘 说明： 1. Qt事件循环驱动QTimer，QTimer调用lv_tick_inc()和lv_task_handler()。 2. LVGL渲染完成后通过flush_cb回调通知QWidget更新显示。 3. QWidget的paintEvent直接从共享缓冲区读取像素数据，无需拷贝。

3.6 性能调优要点

优化项 推荐做法 不推荐做法
缓冲区大小 屏幕像素的1/10 ~ 1/5 全屏缓冲区（内存浪费）
心跳定时器间隔 2ms ~ 5ms 大于10ms（动画卡顿）
任务处理频率 5ms ~ 10ms 小于1ms（CPU空转）
刷新回调 只更新脏矩形区域 全屏刷新（性能下降）
Qt绘制方式 QImage直接映射缓冲区 QPixmap转换（额外拷贝）

我的习惯：在调试阶段，我会在flushDisplay里加一个计数器，统计每秒刷新次数。如果低于30fps，说明缓冲区太小或者脏矩形优化没生效。

3.7 常见问题与解决方案

  • 屏幕闪烁：检查是否设置了Qt::WA_OpaquePaintEvent。没设置的话，Qt会在绘制前用背景色填充，造成闪烁。
  • 动画卡顿：大概率是lv_tick_inc()调用间隔不均匀。用QElapsedTimer替代固定值。
  • 触摸无响应：确认lv_indev_t的read_cb是否被正确注册。我犯过低级错误——忘记调用lv_indev_read()。
  • 内存泄漏：lv_color_t缓冲区在resize时重新分配，记得delete[]旧缓冲区。

嗯，这一章的内容就这些。Qt和LVGL的绑定，说白了就是“内存共享 + 事件同步”。只要把这两个核心点吃透，剩下的都是细节。

← 上一章 📖 返回目录 下一章 →