【Qt移植LVGL】QWidget手搓LVGL软件仿真模拟器（非直接运行图形库）

🕗 发布于 2024-12-08 04:11 qt LVGL 嵌入式界面物联网

更新以gitee为准

移植后的demo工程：
gitee
有些没实现的后续我会继续优化

别碰瓷看清楚：是移植，不是直接运行LVGL

LVGL是一种轻量级嵌入式图像界面库且不需要多线程就能跑通
这里的在Qt上面移植LVGL并不是用Qt的IDE去建立一个没有Qt应用的工程然后编译运行带SDL2等图形库的程序从而实现在PC上运行LVGL
而是将Qt的窗口作为一个完整的嵌入式设备进行移植使LVGL调用Qt窗口来进行显示和输入

说到FreeRTOS和LVGL这两种模拟多线程代表我的个人理解就是：
FreeRTOS是硬件上的系统移植其根据不同架构调用了硬件底层中断 systick等外设以实现任务调度属于用外设硬件模拟的多线程
LVGL的多线程是用两个定时器中断不断刷新页面进行操作其触摸延迟至少得5ms 属于软件层面的多线程运行实际上就相当于一个while 1里面不断刷新页面罢了
很早之前用51单片机+LCD1602写界面也是用一个while+状态判断来写的

Qt的C/C++混编

C++是兼容C的
在Qt的工程里面可以直接添加C文件
但是调用C文件时却不能直接拿来用
除了导入C文件对应的头文件函数声明外
还需要加上extern "C"来表示下面代码按C语言文件的方式编译
譬如

#ifdef __cplusplus
extern "C" {
#endif

...//C文件的函数声明

#ifdef __cplusplus
}
#endif

这样才能正常调用不报错

另外在C文件中当然就用不了C++的函数
不过又想实现交互有两种解决方式：
分别导入<csignal>和<signal.h>库
自己给自己的进程发送信号
或者直接将要调用C++函数的C文件改成cpp文件

显然后者更方便

但在混编时只需要写一个总的接口函数文件用于调用即可该接口文件可以调用C++的函数
另外也可以调用子类的C语言函数

譬如A.cpp操作B.c 直接调用即可
但是B.c如果想给A.cpp的槽函数信号再去判断做什么事（调用emit函数）则可以定义一个C.cpp 在C.cpp中发送emit来做判断然后再去操作B.c

Qt的模拟显示触摸屏

通过QWidget可以模拟出一个显示屏
【Qt开发】QWidget的虚拟触摸显示屏配置 QPainter、QPixmap以及resizeEvent、paintEvent、mouseEvent鼠标输入事件
同时采样信号队列的形式
去捕获按键输入等等

        connect(this, SIGNAL(goto_setStyle(int)),this, SLOT(setStyle(int)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_setWidth(int)),this, SLOT(setWidth(int)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_setColor(QColor)),this, SLOT(setColor(QColor)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_setBack(QColor)),this, SLOT(setBack(QColor)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_clear()),this, SLOT(clear()),Qt::QueuedConnection);

        connect(this, SIGNAL(goto_drawPoint(QPoint)),this, SLOT(drawPoint(QPoint)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_drawPoints(QPoint*,int)),this, SLOT(drawPoints(QPoint*,int)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_drawLine(QPoint,QPoint)),this, SLOT(drawLine(QPoint,QPoint)),Qt::QueuedConnection);

        connect(this, SIGNAL(goto_setTextStyle(int)),this, SLOT(setTextStyle(int)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_setTextFont(QString,int)),this, SLOT(setTextFont(QString,int)),Qt::QueuedConnection);
        connect(this, SIGNAL(goto_drawText(QRectF,QString)),this, SLOT(drawText(QRectF,QString)),Qt::QueuedConnection);

        connect(this, SIGNAL(goto_fillRect(QPoint,QPoint)),this, SLOT(fillRect(QPoint,QPoint)),Qt::QueuedConnection);
signals:
    void goto_setStyle(int s);
    void goto_setWidth(int w);
    void goto_setColor(QColor c);
    void goto_clear(void);
    void goto_setBack(QColor c);

    void goto_setTextStyle(int text_style);
    void goto_setTextFont(QString strfont,int size);

    void goto_drawText(QRectF rectangle,QString text);
    void goto_drawPoint(QPoint p);
    void goto_drawPoints(QPoint *p,int pointCount);
    void goto_drawLine(QPoint p1,QPoint p2);

    void mouse_signal(int mode,QPoint p);

    void goto_fillRect(QPoint p1,QPoint p2);

模拟的触摸屏只需要触摸功能即可

LVGL的API函数编写

在触摸显示屏上移植LVGL 涉及到的API只有画点、面，触摸按下、松开，触摸坐标函数
以上面的模拟显示屏为接口编写LVGL的API函数如下：

#include "LVGL_API.h"

LVGL_API_Class *LVGL_API;

void drawPoint(int x,int y,unsigned short color)
{
    emit LVGL_API->display->goto_setStyle(1);
    QPoint p(x,y);
    int r=0;
    int g=0;
    int b=0;

    r=(color>>11)*8;
    g=((color>>5)&0x003F)*4;
    b=(color&0x001F)*8;

    QColor c(r,g,b);
    emit LVGL_API->display->goto_setColor(c);
    emit LVGL_API->display->goto_drawPoint(p);
    emit LVGL_API->display->goto_setStyle(0);
}

void drawLine(int x1,int y1,int x2,int y2,unsigned short color)
{
    emit LVGL_API->display->goto_setStyle(1);
    QPoint p1(x1,y1);
    QPoint p2(x2,y2);
    int r=0;
    int g=0;
    int b=0;

    r=(color>>11)*8;
    g=((color>>5)&0x003F)*4;
    b=(color&0x001F)*8;

    QColor c(r,g,b);
    emit LVGL_API->display->goto_setColor(c);
    emit LVGL_API->display->goto_drawLine(p1,p2);
    emit LVGL_API->display->goto_setStyle(0);
}

void fillRect_drawLine(int x1,int y1,int x2,int y2)
{
    QPoint p1(x1,y1);
    QPoint p2(x2,y2);

    emit LVGL_API->display->goto_drawLine(p1,p2);
}

void fillRect(int x1,int y1,int x2,int y2,unsigned short color)
{
#if 0
    emit LVGL_API->display->goto_setStyle(1);
    QPoint p1(x1,y1);
    QPoint p2(x2,y2);

    QPoint p3(x1,y2);
    QPoint p4(x2,y1);

    int r=0;
    int g=0;
    int b=0;

    r=(color>>11)*8;
    g=((color>>5)&0x003F)*4;
    b=(color&0x001F)*8;

    QColor c(r,g,b);
    emit LVGL_API->display->goto_setColor(c);
    emit LVGL_API->display->goto_drawLine(p1,p3);
    emit LVGL_API->display->goto_drawLine(p1,p4);
    emit LVGL_API->display->goto_drawLine(p2,p3);
    emit LVGL_API->display->goto_drawLine(p2,p4);
    emit LVGL_API->display->goto_fillRect(p1,p2);
    emit LVGL_API->display->goto_setStyle(0);
#else
    int i=0;
    emit LVGL_API->display->goto_setStyle(1);
    int r=0;
    int g=0;
    int b=0;

    r=(color>>11)*8;
    g=((color>>5)&0x003F)*4;
    b=(color&0x001F)*8;

    QColor c(r,g,b);
    emit LVGL_API->display->goto_setColor(c);

    for(i=0;i<=y2-y1;i++)
    {
        fillRect_drawLine(x1,y1+i,x2,y1+i);
    }

    emit LVGL_API->display->goto_setStyle(0);
#endif
}

void Init_LVGL_API(MY_Display *dis)
{
    LVGL_API = new LVGL_API_Class(dis);
}

#ifndef LVGL_API_H
#define LVGL_API_H
#include "MY_QT_DEF.h"

void drawPoint(int x,int y,unsigned short color);
void fillRect(int x1,int y1,int x2,int y2,unsigned short color);
void drawLine(int x1,int y1,int x2,int y2,unsigned short color);

class LVGL_API_Class;
class LVGL_API_Class: public QObject
{
    Q_OBJECT

public:
    int Touch_x;
    int Touch_y;
    int Touch;

    MY_Display *display;
    LVGL_API_Class(MY_Display *dis=nullptr)
    {
        Touch=0;
        if(dis!=nullptr)
        {
            display=dis;
            connect(display, SIGNAL(mouse_signal(int,QPoint)),this, SLOT(TouchEvent(int,QPoint)),Qt::QueuedConnection);
            emit display->goto_setStyle(0);
        }
    }
    ~LVGL_API_Class(void)
    {

    }
public slots:
    void TouchEvent(int mode,QPoint p)
    {
        if(mode==2)
        {
            Touch=0;
        }
        else
        {
            Touch=1;
        }

        Touch_x=p.x();
        Touch_y=p.y();
    }
};

extern LVGL_API_Class *LVGL_API;

void Init_LVGL_API(MY_Display *dis);

#endif // LVGL_API_H

其中画面提供了两种方式一个是for循环画线遍历一个是直接填充然后再画边框
但这两个在Qt上实现对LVGL的兼容性不太好（Qt会将比较小的像素点给优化掉）
所以在LVGL显示方面还是选择画点函数吧
譬如画点是正常的：
在这里插入图片描述
画面就糊掉了

LVGL文件移植

移植与在嵌入式设备上移植相似
直接按照STM32的移植方式进行即可
这里用的LVGL库版本是8.3
下载后实际需要移植的就下面三个文件夹和两个文件
在这里插入图片描述
将这些文件复制到一个单独的文件夹比如LVGL

并且删除掉_template后缀
在examples中只保留porting 文件夹
同样删除_template后缀

然后这个LVGL文件夹里面的内容就是我们要移植的文件适用于所有工程
包括STM32、Qt、C工程等等

LVGL工程配置

将上面的文件拷贝到Qt工程中
不要将LVGL文件夹整个拷贝而是将里面的内容拷贝过来
用命令表示的区别就是一个是cp ./ 一个是 cp ./* 这里是后者
这是因为Qt的搜素头文件路径默认就是根目录
而LVGL里面的文件导入则是以相对路径来的譬如src下的文件：
在这里插入图片描述
这样一看就明白了吧
当然你直接拷个文件夹过来也不是不行那你就得弄好相对路径

在源文件和头文件中添加
在这里插入图片描述
直接点击Add Existing Directory 即可筛选

要添加的文件如下：

首先是两个主要头文件：
lv_conf.h
lvgl.h

porting目录下的四个文件
lv_port_disp.c 、lv_port_disp.h、 lv_port_indev.c、lv_port_indev.h

src 下的所有C文件

除此之外其他的一律不要添加
可以按如下进行添加：
在这里插入图片描述
另外如果你用的不是Qt Creator 那么就需要添加头文件搜素路径

LVGL显示配置

打开 lv_conf.h 修改文件
表示启用
在这里插入图片描述
打开 lv_port_disp.h
同样启用并且头文件路径改一下

打开 lv_port_disp.c
启用并且删除后缀

在 lv_port_disp.c中添加我们的LVGL_API.h
注意 LVGL_API.cpp是一个C++文件所以为了能使用需要将 lv_port_disp.c改成 lv_port_disp.cpp
同理触摸的文件也要改
在这里插入图片描述
然后定义屏幕可用的大小

LVGL提供了三种缓存方式选择一种其他的注释

第一种最简单而且不需要添加什么东西
先配置配好了以后有时间自己再研究就好了

然后关联画点函数即可
在这里插入图片描述
这里有一种更为优化刷新率更高的方式就是直接移植填充一块区域的函数
但是就如上面所说的 Qt这块给优化掉了导致细小边界看不清所以就只能用画点函数

LVGL触摸配置

LVGL可以设置触摸、按键、鼠标事件
这里我们只用触摸
虽然Qt的鼠标事件也可以捕获但是我们把所有的鼠标事件都定义为触摸就行了

配置如显示类似
在这里插入图片描述
一样导入文件定义区域

在93行以后只保留触摸注释掉鼠标和按键一直到170行（除非你要使用）

添加检测触摸函数接口和获取坐标接口

即可

如果想看看触摸能不能生效那么就添加一个画点的函数在触摸获取xy坐标的后面即可

帧率和触摸率还有待优化：
有些没实现的后续我都会继续优化
在这里插入图片描述

主线程初始化和定时器轮询

在main中导入库：

#include "lvgl.h"                // 它为整个LVGL提供了更完整的头文件引用
#include "examples/porting/lv_port_disp.h"        // LVGL的显示支持
#include "examples/porting/lv_port_indev.h"       // LVGL的触屏支持

在窗口的构造函数中初始化模拟触摸屏后进行LVGL初始化

    lv_init();                             // LVGL 初始化
    lv_port_disp_init();                   // 注册LVGL的显示任务
    lv_port_indev_init();                  // 注册LVGL的触屏检测任务

建立两个定时器线程一个1ms 一个5ms 分别调用lv_tick_inc(1);和lv_timer_handler();

void timer0_callback(void * pCBParam,uint32_t Event,void * pArg)
{
    lv_tick_inc(1);
}

void timer1_callback(void * pCBParam,uint32_t Event,void * pArg)
{
    lv_timer_handler();
}


    Timer0 = new MY_Timer(timer0_callback,1,true);
    Timer1 = new MY_Timer(timer1_callback,5,true);
    Timer0->Start_Timer();
    Timer1->Start_Timer();

这就是LVGL的心跳

测试

建立几个控件测试一下：


void button_evnet(lv_event_t * event)
{
    qDebug()<<event->code;

    lv_obj_t *btn = lv_event_get_target(event);                    // 获得调用这个回调函数的对象
    if (event->code == LV_EVENT_CLICKED)
    {
        static uint8_t cnt = 0;
        cnt++;
        lv_obj_t *label = lv_obj_get_child(btn, NULL);             // 获取第1个子对象(我们在设计时，已安排了它的第1个子对象是一个label对象)
        lv_label_set_text_fmt(label, "Button: %d", cnt);           // 设置标签的文本，写法类似printf
    }
}

//按钮
    lv_obj_t *myBtn = lv_btn_create(lv_scr_act());                               // 创建按钮; 父对象：当前活动屏幕
    lv_obj_set_pos(myBtn, 10, 10);                                               // 设置坐标
    lv_obj_set_size(myBtn, 120, 50);                                             // 设置大小

    lv_obj_add_event_cb(myBtn, button_evnet, LV_EVENT_CLICKED, NULL); //添加事件

    // 按钮上的文本
    lv_obj_t *label_btn = lv_label_create(myBtn);                                // 创建文本标签，父对象：上面的btn按钮
    lv_obj_align(label_btn, LV_ALIGN_CENTER, 0, 0);                              // 对齐于：父对象
    lv_label_set_text(label_btn, "Test");                                        // 设置标签的文本

    // 独立的标签
    lv_obj_t *myLabel = lv_label_create(lv_scr_act());                           // 创建文本标签; 父对象：当前活动屏幕
    lv_label_set_text(myLabel, "Hello world!");                                  // 设置标签的文本
    lv_obj_align(myLabel, LV_ALIGN_CENTER, 0, 0);                                // 对齐于：父对象
    lv_obj_align_to(myBtn, myLabel, LV_ALIGN_OUT_TOP_MID, 0, -20);               // 对齐于：某对象

运行后效果：
在这里插入图片描述
帧率信息显示在：
lv_conf.h中第282行，找到：LV_USE_PERF_MONITOR，原值：0，修改为：1

内存显示则在：
lv_conf.h中第289行，找到：LV_USE_MEM_MONITOR，原值：0，修改为：1

附录：C语言到C++的入门知识点（主要适用于C语言精通到Qt的C++开发入门）

C语言与C++的不同

C语言是一门主要是面向工程的语言
C++则是面向对象

C语言中某些功能实现起来较为繁琐
比如结构体定义：

一般写作：

typedef struct stu_A
{
}A;

也可以写作：

typedef struct 
{
}A;

但大括号后面的名称是不可省去的

不过 C++的写法就比较简单
除了支持上述写法外

也支持直接声明

typedef struct A
{
}

另外 C++是完全支持C语言库和语法的
不过C++里面的库也有些很方便的高级功能用法只不过实现起来可能不如C的速度快

再者 C语言与C++的编译流程不一样
C语言没有函数重载所以给编译器传参就是直接传函数名称
但是C++除了传函数名称外还会穿函数的参数、类型等等以实现函数重载

C++中写C语言代码

上文提到 C++可以完全兼容C的写法
但是编译流程也还是不一样
所以如果在编译层面进行C语言代码编译则通常用以下方法：

extern "C"
{
...
}

表面大括号内的内容用C的方法进行编译

另外如果还是用C++的编译器但要实现C语言函数则需要用到C语言的库

在C语言中我们一般用如下方法导入库

#include <stdio.h>

此方法同样适用于C++ 但是C++可以更方便的写成去掉.h的方式
比如：

#include <iostream>

在C++中为了调用C语言的库可以采用在原库名称前加一个"c"的方式导入
如：

#include <cstdio>

这样就可以使用printf等函数了甚至比C++的std方法更快

C语言到C++的知识点

在这里插入图片描述

Qt开发中需要了解的C++基础知识

namespace

C++面向对象的特性下诞生的一个名称
表示某个函数、变量在某个集合下用作namespace
比如 <iostream>库中的关键字cin在std下则写作std::cin
std就是namespace
::表示某空间下的某某
前面是空间名称后面是变量、函数名称

用using namespace可以告诉编译器以下都用xx名称空间
比如：

using namespace std;
cout<<"a";

如果没有告诉编译器所使用的空间名称则要写成：

std::cout<<"a";

同样可以自定义某一段代码属于哪个空间：

namespace xx
{
...
}

输入输出

在C++中用iostream作为输入输出流的库

#include <iostream>

用cin和cout关键字进行输入和输出
如：

using namespace std;
int a=0;
cin>>a; //输入到a

cout<<a;  //输出a

类比scanf和printf
同样还有一个关键字endl表示换行
cout和cin的传参是不固定的
由编译器自行裁定

字符串类型

在C语言中常用char *表示字符串
但是在C++中可以直接用string类型
比如：

char * s="456";
string str="123";

由于cout的特性这两种字符串都可以直接打印
但如果使用C语言中printf的打印方式时采用%s方式打印字符串则不能传入string类型

class类

C++的核心就是class
同Python等支持面向对象的语言一样
可以理解成一个支持函数、继承、自动初始化、销毁的结构体
在class类中有private私有、public公有变量
前者只能内部访问后者可以外部调用使用
如：

class A
{
public:
int a;
private:
int b;
}

a可以用A.a的方式方位 b则外部无法访问

构造函数和析构函数（解析函数）

构造函数可以理解成对类的初始化反之析构函数则是退出时进行销毁前的函数
两者需要与类的名称相同析构函数则在前面加一个~表示非
如：

class A
{
public:
int a;
A();
~A();
private:
int b;
}

A::A()
{
...
}

A::~A()
{
...
}

构造函数可以定义传参析构函数则不行

类的继承

如果有两个类A和B 想让A里面包含B 则可以写作继承的写法
继承后 A类的变量可以直接调用B下面的成员
如：

class B
{
int b;
}
class A: public B
{
int a;
}

在定义A后可以访问到B的成员b 当然继承也可以私有

原文地址：https://blog.csdn.net/weixin_53403301/article/details/144278246

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！

上一篇：电脑是否被远程控制如何判断
下一篇：三数之和 Leecode 2024/12/02

.NET(C#) 如何配置用户首选项及保存用户设置
.NET(C#) 如何配置用户首选项及保存用户设置
阅读更多2024-12-14
【最新】北大数字普惠金融指数数据集-省市县（2011-2023年）
郭峰,王靖一,王芳,孔涛,张勋,程志云.测度中国数字普惠金融发展:指数编制与空间特征[J].经济学(季刊),2020,19(04):1401-1418.时间跨度：省级和城市级指数时间跨度为2011-2
阅读更多2024-12-14
GESP202412 四级【Recamán】题解（AC）
a11ak−1−kkakak−1−kak−1k小杨想知道 Recamán 数列的前n项从小到大排序后的结果。手动计算非常困难，小杨希望你能帮他解决这个问题。
阅读更多2024-12-14
IDEA遇到EasyConnect中的网络资源无法访问的问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。原文链接：https://blog.csdn.net/wanshanyu_/article/de
阅读更多2024-12-14
双目摄像头标定方法
此时已经完成标定，左下角为反投影误差，右边为外参可视化。将双目左右目拍的图像上传（左右目最好不少于20张）此时回到主页面，即可看到成功导出。把这些误差大的删除即可。
阅读更多2024-12-14
Servlet、omcat服务器架构与工作原理
Servlet是运行在服务器端的Java程序，它的主要职责之一是接收并处理来自客户端（如浏览器）的HTTP请求。当客户端发送一个请求到服务器时，Servlet可以解析请求中的信息，例如请求的URL路径
阅读更多2024-12-14
Vue生命周期钩子函数：深入解析与实践
作为高级Vue前端开发人员，对Vue组件的生命周期钩子函数有着深刻的理解是至关重要的。生命周期钩子函数是指在Vue组件的创建、更新、销毁等过程中，Vue自动调用的一系列方法。通过这些钩子函数，我们可以
阅读更多2024-12-14
安卓开发--使用android studio发布APP
app发布
阅读更多2024-12-14
数据结构与算法学习笔记----拓扑排序
@ author: 明月清了个风。
阅读更多2024-12-14
python 将数据保存到现有的Excel文件的新工作表
out_file = ‘query.xlsx’df1 = pd.DataFrame(out_data)若直接写入：df1.to_excel(out_file, index=False, sheet_n
阅读更多2024-12-14

【Qt移植LVGL】QWidget手搓LVGL软件仿真模拟器（非直接运行图形库）

文章目录

别碰瓷看清楚：是移植，不是直接运行LVGL

Qt的C/C++混编

Qt的模拟显示触摸屏

LVGL的API函数编写

LVGL文件移植

LVGL工程配置

LVGL显示配置

LVGL触摸配置

主线程初始化和定时器轮询

测试

附录：C语言到C++的入门知识点（主要适用于C语言精通到Qt的C++开发入门）

C语言与C++的不同

C++中写C语言代码

C语言到C++的知识点

Qt开发中需要了解的C++基础知识

namespace

输入输出

字符串类型

class类

构造函数和析构函数（解析函数）

类的继承

相关文章