LVGL学习之路——模拟器的搭建，使用button做出第一个ui界面

最新推荐文章于 2024-09-28 16:01:11 发布

沧御kirto

最新推荐文章于 2024-09-28 16:01:11 发布

阅读量7.6k

点赞数 13

分类专栏： lvgl 文章标签：嵌入式 gui 单片机

本文链接：https://blog.csdn.net/qq_42679566/article/details/109771809

版权

lvgl 专栏收录该内容

3 篇文章 5 订阅

订阅专栏

LVGL模拟器搭建

我用的是vs搭建的模拟器，实际上很简单，去下载最新的vs然后我是选择了
接下来，下载安装。再下载官方的模拟器。就可以进行仿真了

熟悉模拟器的结构

拿到模拟器第一反应就是F5运行一下。
lvgl
然后就可以打开main文件去查看一下主函数结构。

static void hal_init(void);
static int tick_thread(void *data);
static lv_indev_t * kb_indev;
int main(int argc, char** argv)
{
	lv_init();       		// 初始化lvgl
	hal_init();				// 这里单片机就是硬件初始化，模拟器中是模拟器初始化(修改配置)
	lv_demo_widgets();		// 这个函数就是演示的demo(修改示例)
	while (1) 
	{
		lv_task_handler();	// lvgl的任务处理，主要处理事件响应
		Sleep(10); 			// 休眠10ms
	}
}

经过分析实际我们只需要修改配置和demo就行了，经过对hal_init()的分析发现在lv_conf.h里有个宏定义

/* Maximal horizontal and vertical resolution to support by the library.*/
#define LV_HOR_RES_MAX          (800)
#define LV_VER_RES_MAX          (480)

/* Color depth:
 * - 1:  1 byte per pixel
 * - 8:  RGB332
 * - 16: RGB565
 * - 32: ARGB8888
 */
#define LV_COLOR_DEPTH     32

这里有长宽和色深，我们可以修改它，当然还有很多配置，可以自己选择修改。

编写自己的demo

通过寻找我们找到了lv_demo_widgets();所在的地方: .\src\lv_demo_benchmark\lv_demo_benchmark.c
于是我就自己在src里建立了一个lv_test的文件夹在文件夹内建立了一个.h和.c，然后打开https://docs.lvgl.io/v7/en/html/widgets/btn.html?highlight=button，研究一下button控件，开始自己编写button啦

#include "../../lv_examples.h"
#include "test.h"
#include <Windows.h>

void lv_ex_btn(void)
{
    lv_obj_t* btn1 = lv_btn_create(lv_scr_act(), NULL);
}

主函数把之前例子函数换成lv_ex_btn()，F5就出来啦

不过这样感觉太简单了加入

lv_obj_t* label = lv_label_create(btn1, NULL);
lv_label_set_text(label, "Button");

通过创建lable并放到button上，就可以显示Button这个名字啦

可以通过

lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, 0);

就可以把它放到中央了，这时我们的按钮就很漂亮了，可以发现因为之前标签放到button上所以移动的时候是二者一起移动的
但是我们点击它什么反应都没有。那是因为我们没有绑定相关的“动作函数”在c语言里叫回调函数。

static void event_handler(lv_obj_t* obj, lv_event_t event) 	// 设置动作函数
{
    if (event == LV_EVENT_CLICKED) { // 按下的时候会产生点击事件通过判断可以做出相应响应
        printf("Clicked\n");
    }
}

在lv_ex_btn()中加入绑定

lv_obj_set_event_cb(btn1, event_handler);

就可以实现效果啦

再举一反三，就完成了第一个简单的ui了

#include "../../lv_examples.h"
#include "test.h"
#include <Windows.h>

static void event_handler(lv_obj_t* obj, lv_event_t event)
{
    if (event == LV_EVENT_CLICKED) {
        printf("Clicked\n");
    }
    else if (event == LV_EVENT_VALUE_CHANGED) {
        printf("Toggled\n");
    }
}

void lv_ex_btn(void)
{

    lv_obj_t* btn1 = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_event_cb(btn1, event_handler);
    

    lv_obj_t* label = lv_label_create(btn1, NULL);
    lv_label_set_text(label, "Button");
    lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, -40);

    lv_obj_t* btn2 = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_event_cb(btn2, event_handler);
    lv_obj_align(btn2, NULL, LV_ALIGN_CENTER, 0, 40);
    lv_btn_set_checkable(btn2, true);
    lv_btn_toggle(btn2);
    lv_btn_set_fit2(btn2, LV_FIT_NONE, LV_FIT_TIGHT);

    label = lv_label_create(btn2, NULL);
    lv_label_set_text(label, "Toggled");
}