在前面我实现在小智工程上的温度湿度计但是主界面是小智的功能界面这篇我将分享如何使用界面设计来实现用户自定义的界面。【界面设计】1、打开guiguider设计创建自定义的屏。Edgi_Talk的屏的分辨率为512*800因此定义屏的界面为宽512*高800。2、添加标签控件到界面设计效果如下基中只需要有两个标签来实现动态更新的分别定义为label_temp与label_hum来在工程中实现交互。【注】中文显示需要指定中文字库我这里指定为SourceHanSerif3、完成界面设计后生成C工程代码。【工程创建】1、打开RT-Thread StudioIDE创建基于Edgi_Talk的LVGL示例工程。2、在main.c中关闭lvgldemo的代码。当然为了保险起见最好生成工程后编译下载到开发板确认运行demo正常。【代码移植】1、将guiguider设计工程的custom与generated两个文件复制粘帖到apllcations下面2、在这两个文件下面右键将这两个目录添加到参与构建。子目录也需要同样添加进去。3、在工程上右键-属性将目录添加到工程中4、同时确认路径与符号也添加到工程到这里我们在工程中的自定义设计页面就添加成功。5、代码修改打开main.c添加对应的代码到文件中复制#include gui_guider.h编译代码并下面到开发板可以看到界面就显示成我们在guiguider的界面中一致如果汉字显不对那就是字库没有选择好重新选择并复制custom与generatedg两个文件过来即可解决。【温湿度界面更新】1、ATH20的更新可以参照我的前面的帖子【英飞凌 Edgi Talk评测】基于小智示例的温湿度计 - 英飞凌MCU论坛英飞凌MCU论坛官方技术支持论坛2、custom自定事件更新。更新的思路是创建一个定时器每两秒读取一下在ath20中缓存数据。然后更新到界面。其代码如下复制/** Copyright 2024 NXP* NXP Proprietary. This software is owned or controlled by NXP and may only be used strictly in* accordance with the applicable license terms. By expressly accepting such terms or by downloading, installing,* activating and/or otherwise using the software, you are agreeing that you have read, and that you agree to* comply with and are bound by, such license terms. If you do not agree to be bound by the applicable license* terms, then you may not retain, install, activate or otherwise use the software.*//********************** INCLUDES*********************/#include stdio.h#include lvgl.h#include custom.h/* Extern AHT10 global variables from aht10_sample.c */extern float g_aht10_temperature;extern float g_aht10_humidity;/*********************** STATIC PROTOTYPES**********************/static void aht10_timer_update(lv_timer_t * timer);/*********************** STATIC VARIABLES**********************/static lv_timer_t * g_aht10_timer NULL;/*********************** GLOBAL FUNCTIONS**********************/void custom_init(lv_ui *ui){LV_UNUSED(ui);g_aht10_timer lv_timer_create(aht10_timer_update, 2000, NULL);}/*********************** STATIC FUNCTIONS**********************/static void aht10_timer_update(lv_timer_t * timer){LV_UNUSED(timer);char buf[32];/* Temperature: split into integer and decimal parts */int temp_int (int)g_aht10_temperature;int temp_frac (int)(g_aht10_temperature * 10) % 10;snprintf(buf, sizeof(buf), %d.%d, temp_int, temp_frac);lv_label_set_text(guider_ui.screen_label_temp, buf);/* Humidity: split into integer and decimal parts */int hum_int (int)g_aht10_humidity;int hum_frac (int)(g_aht10_humidity * 10) % 10;snprintf(buf, sizeof(buf), %d.%d, hum_int, hum_frac);lv_label_set_text(guider_ui.screen_label_hum, buf);}3、修改main.c添加custom与event事件实始化代码复制#include gui_guider.h#include custom.h#include events_init.h#define LED_PIN_G GET_PIN(16, 6)lv_ui guider_ui;void lv_user_gui_init(void){setup_ui(guider_ui);events_init(guider_ui);custom_init(guider_ui);}【实现效果】工程编译好后下载到开发板实现效果如下并且可以实时更新温湿度值。【经验心得】这款芯片非常强大官方给出了屏的驱动实例用户可以少造好多轮子得益于rtthread的强大插件。。---------------------作者lulugl链接https://bbs.21ic.com/icview-3516919-1-1.html来源21ic.com此文章已获得原创/原创奖标签著作权归21ic所有任何人未经允许禁止转载。
)
