目录
1.简介
1.1功能介绍
1.2技术栈介绍
1.3演示视频
1.4硬件介绍
2.软件设计
2.1连接阿里云
2.2云平台调试UI
2.3Ui_main.c界面切换处理文件
2.4.main函数
3.结尾（附网盘链接）
1.简介
此文章并不是教程，只能当作笔者的学习分享，只会做一些简单的介绍，其他的各位结合着代码和运行现象自己分析吧，相信通过函数名和注释，基本上是不难看懂代码的，其中涉及到的一些技术栈，也请各位学习到的时候多查阅资料。
本篇的内容为嵌入式Linux应用层的一个综合性比较强的项目，结尾会将源码放在网盘中开源出来，笔者能力有限，只是简单的把功能实现了，代码开源供大家一起交流学习，有什么好的建议，请各位一定不吝赐教！！！
1.1功能介绍
项目包括了四个app：
1.云平台的调试窗口，用于查看订阅主题所下发的数据，另一个为输入Json格式的数据来控制STM32单片机上的外设。
2.智能家居的界面，有4个图片按钮用于控制STM32板子上的LED灯、门（舵机）、蜂鸣器，量计分别为温度、湿度和亮度的值，同样是STM32获取发布到云平台的。
3.通过一个摄像头模块做的一个相机功能，可以拍照、录像，以及查看拍摄的照片，和播放录制视频的回放。
4.简易的音乐播放器：能够切换歌曲，以及暂停播放音乐。
1.2技术栈介绍
虽然项目简单，但是所涉及到的技术栈还是比较杂，我简单在此列出：
1.LVGL库用于绘制UI。
2.MQTT协议，连接阿里云平台与STM32通讯。
3.alsa库用于音频处理。
4.LED、BEEP
5.V4L2 摄像头应用编程
1.3演示视频
【开源】嵌入式Linux应用层物联网小项目|通过MQTT协议与STM32通讯_哔哩哔哩_bilibili
1.4硬件介绍
硬件使用的是正点原子的阿尔法开发板，芯片是IMX6U，类似开发板应该都可以运行。
2.软件设计
2.1连接阿里云
要注意的部分就是要让开发板连上网，然后将三元组替换为自己所创建产品和设备对应的三元组。如何创建就不在本篇中赘述了，不清楚的可以看看之前发的文章：一篇文章将带你从0到1让Linux系统连接阿里云--MQTT协议【傻瓜式教程】_linux用mqtt连接云-CSDN博客
本文件干的事，就是让开发板连上云平台，然后通过订阅了STM32下发数据的主题，在回调函数中处理STM32下发的传感器数据。
/*
* 这个例程适用于`Linux`这类支持pthread的POSIX设备, 它演示了用SDK配置MQTT参数并建立连接, 之后创建2个线程
*
* + 一个线程用于保活长连接
* + 一个线程用于接收消息, 并在有消息到达时进入默认的数据回调, 在连接状态变化时进入事件回调
*
* 需要用户关注或修改的部分, 已经用 TODO 在注释中标明
*
*/
#include <stdio.h>
#include <string.h>
#include <unistd.h>
#include <pthread.h>
#include "aiot_state_api.h"
#include "aiot_sysdep_api.h"
#include "aiot_mqtt_api.h"
#include "mqtt_aliyun.h"
#include "cJSON.h"
#include "ui_main.h"
/* TODO: 替换为自己设备的三元组 */
char *product_key = "k1h2hJkoTA7";
char *device_name = "Linux_ATK";
char *device_secret = "00708c34c4e4b75f035c07e13613285f";
char *mqtt_host = "iot-06z00jlxn39wea0.mqtt.iothub.aliyuncs.com";
const uint16_t port = 8883;
//const uint16_t port = 1883;
/* 位于portfiles/aiot_port文件夹下的系统适配函数集合 */
extern aiot_sysdep_portfile_t g_aiot_sysdep_portfile;
/* 位于external/ali_ca_cert.c中的服务器证书 */
extern const char *ali_ca_cert;
static pthread_t g_mqtt_process_thread = NULL;
static pthread_t g_mqtt_recv_thread = NULL;
static uint8_t g_mqtt_process_thread_running = 0;
static uint8_t g_mqtt_recv_thread_running = 0;
extern g_sensor_t g_sensor;
extern lv_obj_t * temp_bar;
lv_anim_t a;
//char *sub_topic1 = "/k1h2hJkoTA7/Linux_ATK/user/get";
char *sub_topic = "/sys/k1h2hJkoTA7/Linux_ATK/thing/service/property/set";
// 比较主题的函数
int compare_topic(const char* received_topic, const char* sub_topic, size_t sub_topic_len) {
// 确保接收到的主题长度至少与订阅的主题长度相同
if (strlen(received_topic) < sub_topic_len) {
return 0; // 主题长度不足，无法比较
}
// 截取接收到的主题的前缀部分
char received_prefix[sub_topic_len + 1];
strncpy(received_prefix, received_topic, sub_topic_len);
received_prefix[sub_topic_len] = '\0'; // 确保截取的字符串以 null 结尾
printf("received_prefix = %s\r\n", received_prefix);
// 比较前缀
return strcmp(received_prefix, sub_topic) == 0;
}
void Get_Data_From_Cloud(char *payload, int payload_len)
{
char buf[25];
// 根据需要解析 JSON 数据
cJSON *json = cJSON_Parse(payload);
if (json != NULL)
{
// 解析并处理 params 数据
cJSON *params = cJSON_GetObjectItem(json, "params");
if (cJSON_IsObject(params))
{
// 解析并处理 Temp 数据
cJSON *Temp = cJSON_GetObjectItem(params, "Temp");
if (cJSON_IsNumber(Temp))
{
printf("Temp: %d\n", Temp->valueint);
// 在这里处理 Temp 数据
g_sensor.temp_value = Temp->valueint;
lv_snprintf(buf, 25, "Temp:%d\n", g_sensor.temp_value);
ui_update_sublish_message(buf, payload_len);
memset(buf, 0, 25);
}
// 解析并处理 Humi 数据
cJSON *humi = cJSON_GetObjectItem(params, "Humi");
if (cJSON_IsNumber(humi))
{
printf("Humi: %d\n", humi->valueint);
// 在这里处理 Humi 数据
g_sensor.humi_value = humi->valueint;
lv_snprintf(buf, 25, "Humi:%d\n", g_sensor.humi_value);
ui_update_sublish_message(buf, payload_len);
memset(buf, 0, 25);
}
// 解析并处理 light 数据
cJSON *light = cJSON_GetObjectItem(params, "light");
if (cJSON_IsNumber(light))
{
printf("light: %d\n", light->valueint);
// 在这里处理 light 数据
g_sensor.light_value = light->valueint;
lv_snprintf(buf, 25, "Light:%d\n", g_sensor.light_value);
ui_update_sublish_message(buf, payload_len);
memset(buf, 0, 25);
}
}
else
{
printf("Error: params is not an object\n");
}
cJSON_Delete(json);
}
else
{
printf("Error: Unable to parse JSON\n");
}
}
int mqtt_payload_handle(char *payload, int payload_len)
{
if(payload_len > 0)
{
payload[payload_len] = '\0';
}
ui_update_sublish_message(payload, payload_len);
if(!strcmp(payload, "led_on"))
{
set_led_mode("on");
return LED_ON;
}
else if(!strcmp(payload, "led_off"))
{
set_led_mode("off");
return LED_OFF;
}
else if(!strcmp(payload, "beep_on"))
{
set_beep_mode("on");
return BEEP_ON;
}
else if(!strcmp(payload, "beep_off"))
{
set_beep_mode("off");
return BEEP_OFF;
}
return 0;
}
/* TODO: 如果要关闭日志, 就把这个函数实现为空, 如果要减少日志, 可根据code选择不打印
*
* 例如: [1577589489.033][LK-0317] mqtt_basic_demo&gb80sFmX7yX
*
* 上面这条日志的code就是0317(十六进制), code值的定义见core/aiot_state_api.h
*
*/
/* 日志回调函数, SDK的日志会从这里输出 */
int32_t demo_state_logcb(int32_t code, char *message)
{
//printf("%s", message);
//return 0;
}
/* MQTT事件回调函数, 当网络连接/重连/断开时被触发, 事件定义见core/aiot_mqtt_api.h */
void demo_mqtt_event_handler(void *handle, const aiot_mqtt_event_t *event, void *userdata)
{
switch (event->type) {
/* SDK因为用户调用了aiot_mqtt_connect()接口, 与mqtt服务器建立连接已成功 */
case AIOT_MQTTEVT_CONNECT: {
printf("AIOT_MQTTEVT_CONNECT\n");
/* TODO: 处理SDK建连成功, 不可以在这里调用耗时较长的阻塞函数 */
}
break;
/* SDK因为网络状况被动断连后, 自动发起重连已成功 */
case AIOT_MQTTEVT_RECONNECT: {
printf("AIOT_MQTTEVT_RECONNECT\n");
/* TODO: 处理SDK重连成功, 不可以在这里调用耗时较长的阻塞函数 */
}
break;
/* SDK因为网络的状况而被动断开了连接, network是底层读写失败, heartbeat是没有按预期得到服务端心跳应答 */
case AIOT_MQTTEVT_DISCONNECT: {
char *cause = (event->data.disconnect == AIOT_MQTTDISCONNEVT_NETWORK_DISCONNECT) ? ("network disconnect") :
("heartbeat disconnect");
printf("AIOT_MQTTEVT_DISCONNECT: %s\n", cause);
/* TODO: 处理SDK被动断连, 不可以在这里调用耗时较长的阻塞函数 */
}
break;
default: {
}
}
}
/* MQTT默认消息处理回调, 当SDK从服务器收到MQTT消息时, 且无对应用户回调处理时被调用 */
void demo_mqtt_default_recv_handler(void *handle, const aiot_mqtt_recv_t *packet, void *userdata)
{
switch (packet->type) {
case AIOT_MQTTRECV_HEARTBEAT_RESPONSE: {
printf("heartbeat response\n");
/* TODO: 处理服务器对心跳的回应, 一般不处理 */
}
break;
case AIOT_MQTTRECV_SUB_ACK: {
printf("suback, res: -0x%04X, packet id: %d, max qos: %d\n",
-packet->data.sub_ack.res, packet->data.sub_ack.packet_id, packet->data.sub_ack.max_qos);
/* TODO: 处理服务器对订阅请求的回应, 一般不处理 */
}
break;
/* TODO: 云-->客户端 处理服务器下发的业务报文 */
case AIOT_MQTTRECV_PUB: {
//printf("pub, qos: %d, topic: %.*s\n", packet->data.pub.qos, packet->data.pub.topic_len, packet->data.pub.topic);
//printf("pub, payload: %.*s\n", packet->data.pub.payload_len, packet->data.pub.payload);
/* TODO: 处理服务器下发的业务报文 */
printf("payload = %.*s\n", packet->data.pub.payload_len, packet->data.pub.payload);
//printf("packet->data.pub.topic = %s\n", packet->data.pub.topic);
Get_Data_From_Cloud(packet->data.pub.payload, packet->data.pub.payload_len);
}
break;
case AIOT_MQTTRECV_PUB_ACK: {
printf("puback, packet id: %d\n", packet->data.pub_ack.packet_id);
/* TODO: 处理服务器对QoS1上报消息的回应, 一般不处理 */
}
break;
default: {
}
}
}
/* 执行aiot_mqtt_process的线程, 包含心跳发送和QoS1消息重发 */
void *demo_mqtt_process_thread(void *args)
{
int32_t res = STATE_SUCCESS;
while (g_mqtt_process_thread_running) {
res = aiot_mqtt_process(args);
if (res == STATE_USER_INPUT_EXEC_DISABLED) {
break;
}
sleep(1);
}
return 0;
}
/* 执行aiot_mqtt_recv的线程, 包含网络自动重连和从服务器收取MQTT消息 */
void *demo_mqtt_recv_thread(void *args)
{
int32_t res = STATE_SUCCESS;
while (g_mqtt_recv_thread_running) {
res = aiot_mqtt_recv(args);
if (res < STATE_SUCCESS) {
if (res == STATE_USER_INPUT_EXEC_DISABLED) {
break;
}
sleep(1);
}
}
return 0;
}
void *mqtt_handle = NULL;
int net_mqtt_aliyun_init(void)
{
int32_t res = STATE_SUCCESS;
aiot_sysdep_network_cred_t cred; /* 安全凭据结构体, 如果要用TLS, 这个结构体中配置CA证书等参数 */
/* 配置SDK的底层依赖 */
aiot_sysdep_set_portfile(&g_aiot_sysdep_portfile);
/* 配置SDK的日志输出 */
aiot_state_set_logcb(demo_state_logcb);
/* 创建SDK的安全凭据, 用于建立TLS连接 */
memset(&cred, 0, sizeof(aiot_sysdep_network_cred_t));
cred.option = AIOT_SYSDEP_NETWORK_CRED_SVRCERT_CA; /* 使用RSA证书校验MQTT服务端 */
cred.max_tls_fragment = 16384; /* 最大的分片长度为16K, 其它可选值还有4K, 2K, 1K, 0.5K */
cred.sni_enabled = 1; /* TLS建连时, 支持Server Name Indicator */
cred.x509_server_cert = ali_ca_cert; /* 用来验证MQTT服务端的RSA根证书 */
cred.x509_server_cert_len = strlen(ali_ca_cert); /* 用来验证MQTT服务端的RSA根证书长度 */
/* 创建1个MQTT客户端实例并内部初始化默认参数 */
mqtt_handle = aiot_mqtt_init();
if (mqtt_handle == NULL) {
printf("aiot_mqtt_init failed\n");
return -1;
}
/* TODO: 如果以下代码不被注释, 则例程会用TCP而不是TLS连接云平台 */
/*
{
memset(&cred, 0, sizeof(aiot_sysdep_network_cred_t));
cred.option = AIOT_SYSDEP_NETWORK_CRED_NONE;
}
*/
/* 配置MQTT服务器地址 */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_HOST, (void *)mqtt_host);
/* 配置MQTT服务器端口 */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_PORT, (void *)&port);
/* 配置设备productKey */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_PRODUCT_KEY, (void *)product_key);
/* 配置设备deviceName */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_DEVICE_NAME, (void *)device_name);
/* 配置设备deviceSecret */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_DEVICE_SECRET, (void *)device_secret);
/* 配置网络连接的安全凭据, 上面已经创建好了 */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_NETWORK_CRED, (void *)&cred);
/* 配置MQTT默认消息接收回调函数 */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_RECV_HANDLER, (void *)demo_mqtt_default_recv_handler);
/* 配置MQTT事件回调函数 */
aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_EVENT_HANDLER, (void *)demo_mqtt_event_handler);
/* 与服务器建立MQTT连接 */
res = aiot_mqtt_connect(mqtt_handle);
if (res < STATE_SUCCESS) {
/* 尝试建立连接失败, 销毁MQTT实例, 回收资源 */
aiot_mqtt_deinit(&mqtt_handle);
printf("aiot_mqtt_connect failed: -0x%04X\n\r\n", -res);
printf("please check variables like mqtt_host, produt_key, device_name, device_secret in demo\r\n");
return -1;
}
/* MQTT 订阅topic功能示例, 请根据自己的业务需求进行使用 */
{
res = aiot_mqtt_sub(mqtt_handle, sub_topic, NULL, 1, NULL);
if (res < 0) {
printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
return -1;
}
}
/* MQTT 发布消息功能示例, 请根据自己的业务需求进行使用 */
// {
// char *pub_topic = "/k1h2hJkoTA7/Linux_ATK/user/update";
// char *pub_payload = "{\"id\":\"1\",\"version\":\"1.0\",\"params\":{\"LightSwitch\":0}}";
// res = aiot_mqtt_pub(mqtt_handle, pub_topic, (uint8_t *)pub_payload, (uint32_t)strlen(pub_payload), 0);
// if (res < 0) {
// printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
// return -1;
// }
// }
/* 创建一个单独的线程, 专用于执行aiot_mqtt_process, 它会自动发送心跳保活, 以及重发QoS1的未应答报文 */
g_mqtt_process_thread_running = 1;
res = pthread_create(&g_mqtt_process_thread, NULL, demo_mqtt_process_thread, mqtt_handle);
if (res < 0) {
printf("pthread_create demo_mqtt_process_thread failed: %d\n", res);
return -1;
}
printf("pthread_create demo_mqtt_process_thread successfully!\n");
/* 创建一个单独的线程用于执行aiot_mqtt_recv, 它会循环收取服务器下发的MQTT消息, 并在断线时自动重连 */
g_mqtt_recv_thread_running = 1;
res = pthread_create(&g_mqtt_recv_thread, NULL, demo_mqtt_recv_thread, mqtt_handle);
if (res < 0) {
printf("pthread_create demo_mqtt_recv_thread failed: %d\n", res);
//lv_textarea_set_text(recv_ta, "aliyun unconnected!");
return -1;
}
//lv_textarea_set_text(recv_ta, "aliyun connected!");
// /* 断开MQTT连接, 一般不会运行到这里 */
// g_mqtt_process_thread_running = 0;
// g_mqtt_recv_thread_running = 0;
// sleep(1);
// pthread_join(g_mqtt_process_thread, NULL);
// pthread_join(g_mqtt_recv_thread, NULL);
// res = aiot_mqtt_disconnect(mqtt_handle);
// if (res < STATE_SUCCESS) {
// aiot_mqtt_deinit(&mqtt_handle);
// printf("aiot_mqtt_disconnect failed: -0x%04X\n", -res);
// return -1;
// }
// /* 销毁MQTT实例, 一般不会运行到这里 */
// res = aiot_mqtt_deinit(&mqtt_handle);
// if (res < STATE_SUCCESS) {
// printf("aiot_mqtt_deinit failed: -0x%04X\n", -res);
// return -1;
// }
return 0;
}
int net_mqtt_aliyun_thread_delete(void)
{
if(pthread_join(g_mqtt_process_thread, NULL) != 0)
{
printf("delete g_mqtt_process_thread false\n");
return -1;
}
if(pthread_join(g_mqtt_recv_thread, NULL) != 0)
{
printf("delete g_mqtt_recv_thread false\n");
return -1;
}
return 0;
}2.2云平台调试UI
大致内容分为两部分，用lvgl创建了两个框，一个只接收显示STM32采集到的传感器数据，另一个框点击会出现一个键盘，可以输入对应的Json格式数据去控制STM32的外设。这一块就是利用了MQTT的订阅和发布主题的功能，不了解的可以自行百度。
#include "ui_app_yunpintai.h"
lv_obj_t * recv_ta;
static lv_obj_t * kb;
extern void *mqtt_handle;
extern char *pub_topic;
/*打印云下发的payload 到Sublish栏中*/
void ui_update_sublish_message(char *payload, int payload_len)
{
if(payload_len > 25){
payload_len = 25;
}
char buf[26];
strncpy(buf, payload, payload_len);
buf[payload_len] = '\0';
printf("buf = %s\n", buf);
if(recv_ta == NULL)
{
printf("Error: recv_ta is NULL\n");
return;
}
lv_textarea_add_text(recv_ta, buf);
}
static void publish_event_cb(lv_event_t * e)
{
int res;
lv_event_code_t code = lv_event_get_code(e);
lv_obj_t * ta = lv_event_get_target(e);
if (code == LV_EVENT_FOCUSED)
{
lv_keyboard_set_textarea(kb, ta); // Set the keyboard to the focused text area
lv_obj_clear_flag(kb, LV_OBJ_FLAG_HIDDEN); // Show the keyboard
}
else if (code == LV_EVENT_DEFOCUSED)
{
lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN); // Hide the keyboard
}
else if(code == LV_EVENT_READY)
{
//char *pub_payload = "{\"LED\":1}";
const char * text = lv_textarea_get_text(ta);
printf("Sent text: %s\n", text);
res = aiot_mqtt_pub(mqtt_handle, pub_topic, (uint8_t *)text, (uint32_t)strlen(text), 0);
if (res < 0) {
printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
return -1;
}
}
}
void ui_app_yunpintai(void)
{
//ui_app_clear_area();
clear_area(0, 0, 800, 480, lv_color_hex(MY_UI_COLOR_DEEP_WHITE));
ui_left_app_bar(20, 70);
lv_obj_t * img = lv_img_create(lv_scr_act());
lv_img_set_src(img, &img_yunpintai_on);
lv_obj_align(img, LV_ALIGN_TOP_LEFT, 32, 90);
lv_obj_t * mid_label = lv_label_create(lv_scr_act());
lv_label_set_text(mid_label, "Cloud");
static lv_style_t mid_label_style;
lv_style_init(&mid_label_style);
lv_style_set_text_font(&mid_label_style, &lv_font_montserrat_24); // 设置字体
lv_style_set_text_color(&mid_label_style, lv_color_hex(MY_UI_COLOR_BLACK)); // 设置字体颜色
lv_obj_add_style(mid_label, &mid_label_style, LV_PART_MAIN);
lv_obj_align(mid_label, LV_ALIGN_TOP_MID, 0, 20);
/*创建Sub订阅信息栏*/
lv_obj_t * sub_label = lv_label_create(lv_scr_act());
lv_label_set_text(sub_label, "Sublish");
static lv_style_t sub_label_style;
lv_style_init(&sub_label_style);
lv_style_set_text_font(&sub_label_style, &lv_font_montserrat_48); // 设置字体
lv_style_set_text_color(&sub_label_style, lv_color_hex(MY_UI_COLOR_BLUE)); // 设置字体颜色
lv_obj_add_style(sub_label, &sub_label_style, LV_PART_MAIN);
lv_obj_align(sub_label, LV_ALIGN_TOP_LEFT, 195, 65);
/*设置sub发布信息调试框*/
/* Create the receive text area */
recv_ta = lv_textarea_create(lv_scr_act());
printf("recv_ta after create: %p\n", recv_ta);
lv_textarea_set_one_line(recv_ta, false);
lv_textarea_set_password_mode(recv_ta, false);
lv_textarea_set_text(recv_ta, "");
lv_obj_set_size(recv_ta, 320, 320);
lv_obj_align(recv_ta, LV_ALIGN_TOP_LEFT, 128, 130);
lv_obj_set_style_text_font(recv_ta, &lv_font_montserrat_24, 0);
/*创建Pub发布信息栏*/
lv_obj_t * pub_label = lv_label_create(lv_scr_act());
lv_label_set_text(pub_label, "Publish");
static lv_style_t pub_label_style;
lv_style_init(&pub_label_style);
lv_style_set_text_font(&pub_label_style, &lv_font_montserrat_48); // 设置字体
lv_style_set_text_color(&pub_label_style, lv_color_hex(MY_UI_COLOR_BLUE)); // 设置字体颜色
lv_obj_add_style(pub_label, &pub_label_style, LV_PART_MAIN);
lv_obj_align(pub_label, LV_ALIGN_TOP_LEFT, 525, 65);
/*设置Pub发布信息调试框*/
/*Create the one-line mode text area*/
lv_obj_t * pub_ta = lv_textarea_create(lv_scr_act());
lv_textarea_set_one_line(pub_ta, false);
lv_textarea_set_password_mode(pub_ta, false);
lv_obj_add_event_cb(pub_ta, publish_event_cb, LV_EVENT_ALL, NULL);
lv_obj_set_size(pub_ta, 320, 320);
lv_obj_align(pub_ta, LV_ALIGN_TOP_LEFT, 462, 130);
/*Create temp_anim keyboard*/
kb = lv_keyboard_create(lv_scr_act());
lv_obj_set_size(kb, LV_HOR_RES, LV_VER_RES / 2);
lv_keyboard_set_textarea(kb, pub_ta);
lv_obj_set_style_text_font(kb, &lv_font_dejavu_16_persian_hebrew, 0);
lv_obj_set_style_text_font(pub_ta, &lv_font_montserrat_24, 0);
lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN);
}2.3Ui_main.c界面切换处理文件
此文件中，创建了一个线程来处理我们项目中所有UI的处理，左边的app功能栏中的4个图片按钮用于切换4个不同功能的app，其他的诸如清屏，按键回调函数，各位自行看看即可。
#include "ui_main.h"
#include "ui_app_yunpintai.h"
#include "ui_app_smarthome.h"
#include "ui_app_camera.h"
#include "ui_app_music.h"
static app_imgbtn_t app_imgbtn[NUM_APPS];
static int current_active_app = -1;
static pthread_t g_ds_ui_page_thread = NULL;
extern void *mqtt_handle;
extern lv_obj_t *recv_ta;
char *pub_topic = "/k1h2hJkoTA7/Linux_ATK/user/Android_STM32";
int app_index = 0;
// 创建一个与背景颜色相同的对象来覆盖指定区域
void clear_area(lv_coord_t x, lv_coord_t y, lv_coord_t width, lv_coord_t height, lv_color_t value)
{
lv_obj_t *clear_obj = lv_obj_create(lv_scr_act()); // 创建一个对象
lv_obj_remove_style_all(clear_obj); // 移除默认样式
lv_obj_set_size(clear_obj, width, height); // 设置对象大小
lv_obj_set_pos(clear_obj, x, y); // 设置对象位置
lv_obj_set_style_bg_color(clear_obj, value, 0); // 设置对象背景颜色，假设背景是白色
lv_obj_set_style_bg_opa(clear_obj, LV_OPA_COVER, 0); // 设置对象不透明度
}
void ui_draw_backgroud_bar(lv_coord_t x, lv_coord_t y, lv_coord_t width, lv_coord_t height, lv_color_t value)
{
static lv_style_t style;
lv_style_init(&style);
/*Set temp_anim background color and temp_anim radius*/
lv_style_set_radius(&style, 25);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, value);
/*Create an object with the new style*/
lv_obj_t *obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_set_size(obj, width, height);
lv_obj_align(obj, LV_ALIGN_TOP_LEFT, x, y);
}
/* 功能栏按键 切换app */
static void imgbtn_event_handler(lv_event_t *e)
{
lv_obj_t *imgbtn = lv_event_get_target(e);
lv_event_code_t code = lv_event_get_code(e);
if (code == LV_EVENT_CLICKED)
{
printf("Button clicked!\n");
/* Find the app_index of the pressed button */
for (int i = 0; i < NUM_APPS; i++)
{
if (app_imgbtn[i].imgbtn == imgbtn)
{
app_index = i;
break;
}
}
printf("app_index = %d\n", app_index);
/* Update the active app */
current_active_app = app_index;
/* Call ui_smarthome_page to update the UI */
ui_page_main();
}
}
void ui_create_app_imagebtn(unsigned int x, unsigned int y)
{
/* Define the image resources for each app button */
app_imgbtn[0].img_on = &img_yunpintai_on;
app_imgbtn[0].img_off = &img_yunpintai_off;
app_imgbtn[1].img_on = &img_smarthome_on;
app_imgbtn[1].img_off = &img_smarthome_off;
app_imgbtn[2].img_on = &img_camera_on;
app_imgbtn[2].img_off = &img_camera_off;
app_imgbtn[3].img_on = &img_music_on;
app_imgbtn[3].img_off = &img_music_off;
/* Create an image button */
for (int i = 0; i < NUM_APPS; i++)
{
app_imgbtn[i].imgbtn = lv_imgbtn_create(lv_scr_act());
lv_imgbtn_set_src(app_imgbtn[i].imgbtn, LV_IMGBTN_STATE_RELEASED, NULL, NULL, app_imgbtn[i].img_off);
lv_imgbtn_set_src(app_imgbtn[i].imgbtn, LV_IMGBTN_STATE_PRESSED, NULL, NULL, app_imgbtn[i].img_on);
/* Add event handler to switch images on press */
lv_obj_add_event_cb(app_imgbtn[i].imgbtn, imgbtn_event_handler, LV_EVENT_CLICKED, NULL);
/* Set size and position */
lv_obj_set_size(app_imgbtn[i].imgbtn, 64, 64);
lv_obj_align(app_imgbtn[i].imgbtn, LV_ALIGN_TOP_LEFT, x + 12, y + 20 + 90 * i); // Adjust the positions as needed
}
}
/*创建左app栏*/
void ui_left_app_bar(unsigned int x, unsigned int y)
{
/* 创建左功能栏 */
static lv_style_t style_bg;
lv_style_init(&style_bg);
lv_style_set_radius(&style_bg, 25);
lv_style_set_bg_color(&style_bg, lv_color_hex(MY_UI_COLOR_WHITE));
lv_style_set_bg_opa(&style_bg, LV_OPA_COVER);
/* Create temp_anim background object */
lv_obj_t *bg = lv_obj_create(lv_scr_act());
lv_obj_add_style(bg, &style_bg, 0);
lv_obj_set_size(bg, 90, 380);
lv_obj_align(bg, LV_ALIGN_TOP_LEFT, x, y);
ui_create_app_imagebtn(x, y);
}
static void destroy_previous_objects(void)
{
if (recv_ta != NULL)
{
lv_obj_del(recv_ta);
recv_ta = NULL;
printf("recv_ta destroyed\n");
}
}
/* 页面主函数 */
void ui_page_main(void)
{
destroy_previous_objects();
lv_obj_set_style_bg_color(lv_scr_act(), lv_color_hex(MY_UI_COLOR_DEEP_WHITE), LV_PART_MAIN);
ui_left_app_bar(20, 70);
if (app_index == UI_APP_YUNPINTAI)
{
ui_app_yunpintai();
}
else if (app_index == UI_APP_SMARTHOME)
{
ui_app_smarthome();
}
else if (app_index == UI_APP_CAMERA)
{
ui_app_camera();
}
else if (app_index == UI_APP_MUSIC)
{
ui_app_music();
}
}
void *ds_ui_page_thread(void *args)
{
ui_page_main();
// setup_time_update();
while (1)
{
lv_task_handler();
usleep(5000);
}
return NULL;
}
int ui_app_page_init(void)
{
int res;
res = pthread_create(&g_ds_ui_page_thread, NULL, ds_ui_page_thread, NULL);
if (res != 0)
{
printf("pthread_create ds_ui_page_thread failed: %d\n", res);
return -1;
}
printf("ds_ui_page_thread created successfully\n");
return 0;
}
2.4.main函数
在main函数中先需要初始化lvgl的相关内容，然后调用ui_app_page_init();和net_mqtt_aliyun_init();来对界面初始化和连接上阿里云。
#include "app_main.h"
extern lv_obj_t *recv_ta;
#define DISP_BUF_SIZE (800 * 480)
static void my_lvgl_init(void);
int main(void)
{
printf("Hello Linux!!!\n\r");
set_led_mode("off");
my_lvgl_init();
ui_app_page_init();
net_mqtt_aliyun_init();
while (1)
{
sleep(1);
}
return 0;
}
/*Set in lv_conf.h as `LV_TICK_CUSTOM_SYS_TIME_EXPR`*/
uint32_t custom_tick_get(void)
{
static uint64_t start_ms = 0;
if (start_ms == 0)
{
struct timeval tv_start;
gettimeofday(&tv_start, NULL);
start_ms = (tv_start.tv_sec * 1000000 + tv_start.tv_usec) / 1000;
}
struct timeval tv_now;
gettimeofday(&tv_now, NULL);
uint64_t now_ms;
now_ms = (tv_now.tv_sec * 1000000 + tv_now.tv_usec) / 1000;
uint32_t time_ms = now_ms - start_ms;
return time_ms;
}
static void my_lvgl_init(void)
{
/*LittlevGL init*/
lv_init();
/*Linux frame buffer device init*/
fbdev_init();
/*A small buffer for LittlevGL to draw the screen's content*/
static lv_color_t buf[DISP_BUF_SIZE];
/*Initialize a descriptor for the buffer*/
static lv_disp_draw_buf_t disp_buf;
lv_disp_draw_buf_init(&disp_buf, buf, NULL, DISP_BUF_SIZE);
/*Initialize and register a display driver*/
static lv_disp_drv_t disp_drv;
lv_disp_drv_init(&disp_drv);
disp_drv.draw_buf = &disp_buf;
disp_drv.flush_cb = fbdev_flush;
disp_drv.hor_res = 800;
disp_drv.ver_res = 480;
lv_disp_drv_register(&disp_drv);
/* Linux input device init */
evdev_init();
/* Initialize and register a display input driver */
/* Segmentation fault:*/
lv_indev_drv_t indev_drv;
lv_indev_drv_init(&indev_drv); /*Basic initialization*/
indev_drv.type = LV_INDEV_TYPE_POINTER;
indev_drv.read_cb = evdev_read;
lv_indev_t *my_indev = lv_indev_drv_register(&indev_drv);
/* Segmentation fault:*/
// printf("LVGL_Init OK!\r\n");
}3.结尾（附网盘链接）
链接：百度网盘 请输入提取码
提取码：2jia
--来自百度网盘超级会员V5的分享
