devbox
知新_RL
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

【开源】嵌入式Linux（IMX6U）应用层综合项目（1）--云平台调试APP

作者：知新_RL | 2024-08-03 12:41:36

赞

踩

【开源】嵌入式Linux（IMX6U）应用层综合项目（1）--云平台调试APP

目录

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下发的传感器数据。

  1. /*
  2.  * 这个例程适用于`Linux`这类支持pthread的POSIX设备, 它演示了用SDK配置MQTT参数并建立连接, 之后创建2个线程
  3.  *
  4.  * + 一个线程用于保活长连接
  5.  * + 一个线程用于接收消息, 并在有消息到达时进入默认的数据回调, 在连接状态变化时进入事件回调
  6.  *
  7.  * 需要用户关注或修改的部分, 已经用 TODO 在注释中标明
  8.  *
  9.  */
  10. #include <stdio.h>
  11. #include <string.h>
  12. #include <unistd.h>
  13. #include <pthread.h>
  14. #include "aiot_state_api.h"
  15. #include "aiot_sysdep_api.h"
  16. #include "aiot_mqtt_api.h"
  17. #include "mqtt_aliyun.h"
  18. #include "cJSON.h"
  19. #include "ui_main.h"
  20.  
  21. /* TODO: 替换为自己设备的三元组 */
  22. char *product_key       = "k1h2hJkoTA7";
  23. char *device_name       = "Linux_ATK";
  24. char *device_secret     = "00708c34c4e4b75f035c07e13613285f";
  25. char  *mqtt_host = "iot-06z00jlxn39wea0.mqtt.iothub.aliyuncs.com";
  26. const uint16_t port = 8883;
  27. //const uint16_t port = 1883;
  28.  
  29. /* 位于portfiles/aiot_port文件夹下的系统适配函数集合 */
  30. extern aiot_sysdep_portfile_t g_aiot_sysdep_portfile;
  31.  
  32. /* 位于external/ali_ca_cert.c中的服务器证书 */
  33. extern const char *ali_ca_cert;
  34.  
  35. static pthread_t g_mqtt_process_thread = NULL;
  36. static pthread_t g_mqtt_recv_thread = NULL;
  37. static uint8_t g_mqtt_process_thread_running = 0;
  38. static uint8_t g_mqtt_recv_thread_running = 0;
  39.  
  40. extern g_sensor_t g_sensor;
  41. extern lv_obj_t * temp_bar;
  42. lv_anim_t a;
  43.  
  44. //char *sub_topic1 = "/k1h2hJkoTA7/Linux_ATK/user/get";
  45. char *sub_topic = "/sys/k1h2hJkoTA7/Linux_ATK/thing/service/property/set";
  46.  
  47. // 比较主题的函数
  48. int compare_topic(const char* received_topic, const char* sub_topic, size_t sub_topic_len) {
  49.     // 确保接收到的主题长度至少与订阅的主题长度相同
  50.     if (strlen(received_topic) < sub_topic_len) {
  51.         return 0; // 主题长度不足，无法比较
  52.     }
  53.  
  54.     // 截取接收到的主题的前缀部分
  55.     char received_prefix[sub_topic_len + 1];
  56.     strncpy(received_prefix, received_topic, sub_topic_len);
  57.     received_prefix[sub_topic_len] = '\0'; // 确保截取的字符串以 null 结尾
  58.     printf("received_prefix = %s\r\n", received_prefix);
  59.     // 比较前缀
  60.     return strcmp(received_prefix, sub_topic) == 0;
  61. }
  62.  
  63. void Get_Data_From_Cloud(char *payload, int payload_len) 
  64. {
  65.     char buf[25];
  66.     // 根据需要解析 JSON 数据
  67.     cJSON *json = cJSON_Parse(payload);
  68.     if (json != NULL) 
  69.     {
  70.         // 解析并处理 params 数据
  71.         cJSON *params = cJSON_GetObjectItem(json, "params");
  72.         if (cJSON_IsObject(params)) 
  73.         {
  74.             // 解析并处理 Temp 数据
  75.             cJSON *Temp = cJSON_GetObjectItem(params, "Temp");
  76.             if (cJSON_IsNumber(Temp)) 
  77.             {
  78.                 printf("Temp: %d\n", Temp->valueint);
  79.                 // 在这里处理 Temp 数据
  80.                 g_sensor.temp_value = Temp->valueint;
  81.                 lv_snprintf(buf, 25, "Temp:%d\n", g_sensor.temp_value);
  82.                 ui_update_sublish_message(buf, payload_len);
  83.                 memset(buf, 0, 25);
  84.             } 
  85.  
  86.             // 解析并处理 Humi 数据
  87.             cJSON *humi = cJSON_GetObjectItem(params, "Humi");
  88.             if (cJSON_IsNumber(humi)) 
  89.             {
  90.                 printf("Humi: %d\n", humi->valueint);
  91.                 // 在这里处理 Humi 数据
  92.                 g_sensor.humi_value = humi->valueint;
  93.                 lv_snprintf(buf, 25, "Humi:%d\n", g_sensor.humi_value);
  94.                 ui_update_sublish_message(buf, payload_len);
  95.                 memset(buf, 0, 25);
  96.             } 
  97.             
  98.             // 解析并处理 light 数据
  99.             cJSON *light = cJSON_GetObjectItem(params, "light");
  100.             if (cJSON_IsNumber(light)) 
  101.             {
  102.                 printf("light: %d\n", light->valueint);
  103.                 // 在这里处理 light 数据
  104.                 g_sensor.light_value = light->valueint;
  105.                 lv_snprintf(buf, 25, "Light:%d\n", g_sensor.light_value);
  106.                 ui_update_sublish_message(buf, payload_len);
  107.                 memset(buf, 0, 25);
  108.             } 
  109.         } 
  110.         else 
  111.         {
  112.             printf("Error: params is not an object\n");
  113.         }
  114.  
  115.         cJSON_Delete(json);
  116.     } 
  117.     else 
  118.     {
  119.         printf("Error: Unable to parse JSON\n");
  120.     }
  121. }
  122.  
  123. int mqtt_payload_handle(char *payload, int payload_len)
  124. {
  125.     if(payload_len > 0)
  126.     {
  127.         payload[payload_len] = '\0';
  128.     }
  129.     ui_update_sublish_message(payload, payload_len);
  130.  
  131.     if(!strcmp(payload, "led_on"))
  132.     {
  133.         set_led_mode("on");
  134.         return LED_ON;
  135.     } 
  136.     else if(!strcmp(payload, "led_off"))
  137.     {
  138.         set_led_mode("off");
  139.         return LED_OFF;
  140.     }
  141.     else if(!strcmp(payload, "beep_on"))
  142.     {
  143.         set_beep_mode("on");
  144.         return BEEP_ON;
  145.     }
  146.     else if(!strcmp(payload, "beep_off"))
  147.     {
  148.         set_beep_mode("off");
  149.         return BEEP_OFF;
  150.     }
  151.     return 0;
  152. }
  153.  
  154. /* TODO: 如果要关闭日志, 就把这个函数实现为空, 如果要减少日志, 可根据code选择不打印
  155.  *
  156.  * 例如: [1577589489.033][LK-0317] mqtt_basic_demo&gb80sFmX7yX
  157.  *
  158.  * 上面这条日志的code就是0317(十六进制), code值的定义见core/aiot_state_api.h
  159.  *
  160.  */
  161.  
  162. /* 日志回调函数, SDK的日志会从这里输出 */
  163. int32_t demo_state_logcb(int32_t code, char *message)
  164. {
  165.     //printf("%s", message);
  166.     //return 0;
  167. }
  168.  
  169. /* MQTT事件回调函数, 当网络连接/重连/断开时被触发, 事件定义见core/aiot_mqtt_api.h */
  170. void demo_mqtt_event_handler(void *handle, const aiot_mqtt_event_t *event, void *userdata)
  171. {
  172.     switch (event->type) {
  173.         /* SDK因为用户调用了aiot_mqtt_connect()接口, 与mqtt服务器建立连接已成功 */
  174.         case AIOT_MQTTEVT_CONNECT: {
  175.             printf("AIOT_MQTTEVT_CONNECT\n");
  176.             
  177.             /* TODO: 处理SDK建连成功, 不可以在这里调用耗时较长的阻塞函数 */
  178.         }
  179.         break;
  180.  
  181.         /* SDK因为网络状况被动断连后, 自动发起重连已成功 */
  182.         case AIOT_MQTTEVT_RECONNECT: {
  183.             printf("AIOT_MQTTEVT_RECONNECT\n");
  184.             /* TODO: 处理SDK重连成功, 不可以在这里调用耗时较长的阻塞函数 */
  185.         }
  186.         break;
  187.  
  188.         /* SDK因为网络的状况而被动断开了连接, network是底层读写失败, heartbeat是没有按预期得到服务端心跳应答 */
  189.         case AIOT_MQTTEVT_DISCONNECT: {
  190.             char *cause = (event->data.disconnect == AIOT_MQTTDISCONNEVT_NETWORK_DISCONNECT) ? ("network disconnect") :
  191.                           ("heartbeat disconnect");
  192.             printf("AIOT_MQTTEVT_DISCONNECT: %s\n", cause);
  193.             /* TODO: 处理SDK被动断连, 不可以在这里调用耗时较长的阻塞函数 */
  194.         }
  195.         break;
  196.  
  197.         default: {
  198.  
  199.         }
  200.     }
  201. }
  202.  
  203. /* MQTT默认消息处理回调, 当SDK从服务器收到MQTT消息时, 且无对应用户回调处理时被调用 */
  204. void demo_mqtt_default_recv_handler(void *handle, const aiot_mqtt_recv_t *packet, void *userdata)
  205. {
  206.     switch (packet->type) {
  207.         case AIOT_MQTTRECV_HEARTBEAT_RESPONSE: {
  208.             printf("heartbeat response\n");
  209.             /* TODO: 处理服务器对心跳的回应, 一般不处理 */
  210.         }
  211.         break;
  212.  
  213.         case AIOT_MQTTRECV_SUB_ACK: {
  214.             printf("suback, res: -0x%04X, packet id: %d, max qos: %d\n",
  215.                    -packet->data.sub_ack.res, packet->data.sub_ack.packet_id, packet->data.sub_ack.max_qos);
  216.             /* TODO: 处理服务器对订阅请求的回应, 一般不处理 */
  217.         }
  218.         break;
  219.  
  220.         /* TODO: 云-->客户端 处理服务器下发的业务报文 */
  221.         case AIOT_MQTTRECV_PUB: {
  222.             //printf("pub, qos: %d, topic: %.*s\n", packet->data.pub.qos, packet->data.pub.topic_len, packet->data.pub.topic);
  223.             //printf("pub, payload: %.*s\n", packet->data.pub.payload_len, packet->data.pub.payload);
  224.             /* TODO: 处理服务器下发的业务报文 */
  225.             printf("payload = %.*s\n",  packet->data.pub.payload_len, packet->data.pub.payload);
  226.             //printf("packet->data.pub.topic = %s\n",  packet->data.pub.topic);
  227.             Get_Data_From_Cloud(packet->data.pub.payload, packet->data.pub.payload_len);
  228.         }
  229.         break;
  230.  
  231.         case AIOT_MQTTRECV_PUB_ACK: {
  232.             printf("puback, packet id: %d\n", packet->data.pub_ack.packet_id);
  233.             /* TODO: 处理服务器对QoS1上报消息的回应, 一般不处理 */
  234.         }
  235.         break;
  236.  
  237.         default: {
  238.  
  239.         }
  240.     }
  241. }
  242.  
  243. /* 执行aiot_mqtt_process的线程, 包含心跳发送和QoS1消息重发 */
  244. void *demo_mqtt_process_thread(void *args)
  245. {
  246.     int32_t res = STATE_SUCCESS;
  247.  
  248.     while (g_mqtt_process_thread_running) {
  249.         res = aiot_mqtt_process(args);
  250.         if (res == STATE_USER_INPUT_EXEC_DISABLED) {
  251.             break;
  252.         }
  253.         sleep(1);
  254.     }
  255.     return 0;
  256. }
  257.  
  258. /* 执行aiot_mqtt_recv的线程, 包含网络自动重连和从服务器收取MQTT消息 */
  259. void *demo_mqtt_recv_thread(void *args)
  260. {
  261.     int32_t res = STATE_SUCCESS;
  262.  
  263.     while (g_mqtt_recv_thread_running) {
  264.         res = aiot_mqtt_recv(args);
  265.         if (res < STATE_SUCCESS) {
  266.             if (res == STATE_USER_INPUT_EXEC_DISABLED) {
  267.                 break;
  268.             }
  269.             sleep(1);
  270.         }
  271.     }
  272.     return 0;
  273. }
  274.  
  275. void *mqtt_handle = NULL;
  276. int net_mqtt_aliyun_init(void)
  277. {
  278.     int32_t     res = STATE_SUCCESS;
  279.     
  280.     aiot_sysdep_network_cred_t cred; /* 安全凭据结构体, 如果要用TLS, 这个结构体中配置CA证书等参数 */
  281.  
  282.     /* 配置SDK的底层依赖 */
  283.     aiot_sysdep_set_portfile(&g_aiot_sysdep_portfile);
  284.     /* 配置SDK的日志输出 */
  285.     aiot_state_set_logcb(demo_state_logcb);
  286.  
  287.     /* 创建SDK的安全凭据, 用于建立TLS连接 */
  288.     memset(&cred, 0, sizeof(aiot_sysdep_network_cred_t));
  289.     cred.option = AIOT_SYSDEP_NETWORK_CRED_SVRCERT_CA;  /* 使用RSA证书校验MQTT服务端 */
  290.     cred.max_tls_fragment = 16384; /* 最大的分片长度为16K, 其它可选值还有4K, 2K, 1K, 0.5K */
  291.     cred.sni_enabled = 1;                               /* TLS建连时, 支持Server Name Indicator */
  292.     cred.x509_server_cert = ali_ca_cert;                 /* 用来验证MQTT服务端的RSA根证书 */
  293.     cred.x509_server_cert_len = strlen(ali_ca_cert);     /* 用来验证MQTT服务端的RSA根证书长度 */
  294.  
  295.     /* 创建1个MQTT客户端实例并内部初始化默认参数 */
  296.     mqtt_handle = aiot_mqtt_init();
  297.     if (mqtt_handle == NULL) {
  298.         printf("aiot_mqtt_init failed\n");
  299.         return -1;
  300.     }
  301.  
  302.     /* TODO: 如果以下代码不被注释, 则例程会用TCP而不是TLS连接云平台 */
  303.     /*
  304.     {
  305.         memset(&cred, 0, sizeof(aiot_sysdep_network_cred_t));
  306.         cred.option = AIOT_SYSDEP_NETWORK_CRED_NONE;
  307.     }
  308.     */
  309.  
  310.     /* 配置MQTT服务器地址 */
  311.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_HOST, (void *)mqtt_host);
  312.     /* 配置MQTT服务器端口 */
  313.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_PORT, (void *)&port);
  314.     /* 配置设备productKey */
  315.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_PRODUCT_KEY, (void *)product_key);
  316.     /* 配置设备deviceName */
  317.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_DEVICE_NAME, (void *)device_name);
  318.     /* 配置设备deviceSecret */
  319.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_DEVICE_SECRET, (void *)device_secret);
  320.     /* 配置网络连接的安全凭据, 上面已经创建好了 */
  321.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_NETWORK_CRED, (void *)&cred);
  322.     /* 配置MQTT默认消息接收回调函数 */
  323.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_RECV_HANDLER, (void *)demo_mqtt_default_recv_handler);
  324.     /* 配置MQTT事件回调函数 */
  325.     aiot_mqtt_setopt(mqtt_handle, AIOT_MQTTOPT_EVENT_HANDLER, (void *)demo_mqtt_event_handler);
  326.  
  327.     /* 与服务器建立MQTT连接 */
  328.     res = aiot_mqtt_connect(mqtt_handle);
  329.     if (res < STATE_SUCCESS) {
  330.         /* 尝试建立连接失败, 销毁MQTT实例, 回收资源 */
  331.         aiot_mqtt_deinit(&mqtt_handle);
  332.         printf("aiot_mqtt_connect failed: -0x%04X\n\r\n", -res);
  333.         printf("please check variables like mqtt_host, produt_key, device_name, device_secret in demo\r\n");
  334.         return -1;
  335.     }
  336.  
  337.     /* MQTT 订阅topic功能示例, 请根据自己的业务需求进行使用 */
  338.     {
  339.         res = aiot_mqtt_sub(mqtt_handle, sub_topic, NULL, 1, NULL);
  340.         if (res < 0) {
  341.             printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
  342.             return -1;
  343.         }
  344.     } 
  345.  
  346.     /* MQTT 发布消息功能示例, 请根据自己的业务需求进行使用 */
  347.     // {
  348.     //     char *pub_topic = "/k1h2hJkoTA7/Linux_ATK/user/update";
  349.     //     char *pub_payload = "{\"id\":\"1\",\"version\":\"1.0\",\"params\":{\"LightSwitch\":0}}";
  350.  
  351.     //     res = aiot_mqtt_pub(mqtt_handle, pub_topic, (uint8_t *)pub_payload, (uint32_t)strlen(pub_payload), 0);
  352.     //     if (res < 0) {
  353.     //         printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
  354.     //         return -1;
  355.     //     }
  356.     // }
  357.  
  358.     /* 创建一个单独的线程, 专用于执行aiot_mqtt_process, 它会自动发送心跳保活, 以及重发QoS1的未应答报文 */
  359.     g_mqtt_process_thread_running = 1;
  360.     res = pthread_create(&g_mqtt_process_thread, NULL, demo_mqtt_process_thread, mqtt_handle);
  361.     if (res < 0) {
  362.         printf("pthread_create demo_mqtt_process_thread failed: %d\n", res);
  363.         return -1;
  364.     }
  365.     printf("pthread_create demo_mqtt_process_thread successfully!\n");
  366.     /* 创建一个单独的线程用于执行aiot_mqtt_recv, 它会循环收取服务器下发的MQTT消息, 并在断线时自动重连 */
  367.     g_mqtt_recv_thread_running = 1;
  368.     res = pthread_create(&g_mqtt_recv_thread, NULL, demo_mqtt_recv_thread, mqtt_handle);
  369.     if (res < 0) {
  370.         printf("pthread_create demo_mqtt_recv_thread failed: %d\n", res);
  371.         //lv_textarea_set_text(recv_ta, "aliyun unconnected!");
  372.         return -1;
  373.     }
  374.     //lv_textarea_set_text(recv_ta, "aliyun connected!");
  375.  
  376.     // /* 断开MQTT连接, 一般不会运行到这里 */
  377.     // g_mqtt_process_thread_running = 0;
  378.     // g_mqtt_recv_thread_running = 0;
  379.     // sleep(1);
  380.     // pthread_join(g_mqtt_process_thread, NULL);
  381.     // pthread_join(g_mqtt_recv_thread, NULL);
  382.  
  383.     // res = aiot_mqtt_disconnect(mqtt_handle);
  384.     // if (res < STATE_SUCCESS) {
  385.     //     aiot_mqtt_deinit(&mqtt_handle);
  386.     //     printf("aiot_mqtt_disconnect failed: -0x%04X\n", -res);
  387.     //     return -1;
  388.     // }
  389.  
  390.     // /* 销毁MQTT实例, 一般不会运行到这里 */
  391.     // res = aiot_mqtt_deinit(&mqtt_handle);
  392.     // if (res < STATE_SUCCESS) {
  393.     //     printf("aiot_mqtt_deinit failed: -0x%04X\n", -res);
  394.     //     return -1;
  395.     // }
  396.  
  397.      return 0;
  398. }
  399.  
  400. int net_mqtt_aliyun_thread_delete(void)
  401. {
  402.     if(pthread_join(g_mqtt_process_thread, NULL) != 0)
  403.     {
  404.         printf("delete g_mqtt_process_thread false\n");
  405.         return -1;
  406.     }
  407.     if(pthread_join(g_mqtt_recv_thread, NULL) != 0)
  408.     {
  409.         printf("delete g_mqtt_recv_thread false\n");
  410.         return -1;
  411.     }
  412.     return 0;
  413. }

2.2云平台调试UI

大致内容分为两部分，用lvgl创建了两个框，一个只接收显示STM32采集到的传感器数据，另一个框点击会出现一个键盘，可以输入对应的Json格式数据去控制STM32的外设。这一块就是利用了MQTT的订阅和发布主题的功能，不了解的可以自行百度。

  1. #include "ui_app_yunpintai.h"
  2.  
  3. lv_obj_t * recv_ta;
  4. static lv_obj_t * kb;
  5. extern void *mqtt_handle;
  6. extern char *pub_topic;
  7.  
  8. /*打印云下发的payload 到Sublish栏中*/
  9. void ui_update_sublish_message(char *payload, int payload_len)
  10. {
  11.     if(payload_len > 25){
  12.         payload_len = 25;
  13.     }
  14.     char buf[26];
  15.     strncpy(buf, payload, payload_len);
  16.     buf[payload_len] = '\0';
  17.     printf("buf = %s\n", buf);
  18.  
  19.     if(recv_ta == NULL)
  20.     {
  21.         printf("Error: recv_ta is NULL\n");
  22.         return;
  23.     }
  24.     lv_textarea_add_text(recv_ta, buf);
  25. }
  26.  
  27. static void publish_event_cb(lv_event_t * e)
  28. {
  29.     int res;
  30.     lv_event_code_t code = lv_event_get_code(e);
  31.     lv_obj_t * ta = lv_event_get_target(e);
  32.  
  33.     if (code == LV_EVENT_FOCUSED) 
  34.      {
  35.         lv_keyboard_set_textarea(kb, ta); // Set the keyboard to the focused text area
  36.         lv_obj_clear_flag(kb, LV_OBJ_FLAG_HIDDEN); // Show the keyboard
  37.     } 
  38.     else if (code == LV_EVENT_DEFOCUSED) 
  39.     {
  40.         lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN); // Hide the keyboard
  41.     }
  42.     else if(code == LV_EVENT_READY)
  43.     {
  44.         //char *pub_payload = "{\"LED\":1}";
  45.         const char * text = lv_textarea_get_text(ta);
  46.         printf("Sent text: %s\n", text);
  47.         res = aiot_mqtt_pub(mqtt_handle, pub_topic, (uint8_t *)text, (uint32_t)strlen(text), 0);
  48.         if (res < 0) {
  49.             printf("aiot_mqtt_sub failed, res: -0x%04X\n", -res);
  50.             return -1;
  51.         }
  52.     }
  53. }
  54.  
  55. void ui_app_yunpintai(void)
  56. {
  57.     //ui_app_clear_area();
  58.     clear_area(0, 0, 800, 480, lv_color_hex(MY_UI_COLOR_DEEP_WHITE));
  59.     ui_left_app_bar(20, 70);
  60.  
  61.     lv_obj_t * img = lv_img_create(lv_scr_act());
  62.     lv_img_set_src(img, &img_yunpintai_on);
  63.     lv_obj_align(img, LV_ALIGN_TOP_LEFT, 32, 90);
  64.  
  65.     lv_obj_t * mid_label = lv_label_create(lv_scr_act());
  66.     lv_label_set_text(mid_label, "Cloud");
  67.     static lv_style_t mid_label_style;
  68.     lv_style_init(&mid_label_style);  
  69.     lv_style_set_text_font(&mid_label_style, &lv_font_montserrat_24); // 设置字体
  70.     lv_style_set_text_color(&mid_label_style, lv_color_hex(MY_UI_COLOR_BLACK)); // 设置字体颜色
  71.     lv_obj_add_style(mid_label, &mid_label_style, LV_PART_MAIN);
  72.     lv_obj_align(mid_label, LV_ALIGN_TOP_MID, 0, 20);
  73.  
  74.     /*创建Sub订阅信息栏*/
  75.     lv_obj_t * sub_label = lv_label_create(lv_scr_act());
  76.     lv_label_set_text(sub_label, "Sublish");
  77.     static lv_style_t sub_label_style;
  78.     lv_style_init(&sub_label_style);  
  79.     lv_style_set_text_font(&sub_label_style, &lv_font_montserrat_48); // 设置字体
  80.     lv_style_set_text_color(&sub_label_style, lv_color_hex(MY_UI_COLOR_BLUE)); // 设置字体颜色
  81.     lv_obj_add_style(sub_label, &sub_label_style, LV_PART_MAIN);
  82.     lv_obj_align(sub_label, LV_ALIGN_TOP_LEFT, 195, 65);
  83.  
  84.     /*设置sub发布信息调试框*/
  85.     /* Create the receive text area */
  86.     recv_ta = lv_textarea_create(lv_scr_act());
  87.     printf("recv_ta after create: %p\n", recv_ta);
  88.     lv_textarea_set_one_line(recv_ta, false);
  89.     lv_textarea_set_password_mode(recv_ta, false);
  90.     lv_textarea_set_text(recv_ta, "");
  91.     lv_obj_set_size(recv_ta, 320, 320);
  92.     lv_obj_align(recv_ta, LV_ALIGN_TOP_LEFT, 128, 130);
  93.     lv_obj_set_style_text_font(recv_ta, &lv_font_montserrat_24, 0);
  94.     
  95.     /*创建Pub发布信息栏*/
  96.     lv_obj_t * pub_label = lv_label_create(lv_scr_act());
  97.     lv_label_set_text(pub_label, "Publish");
  98.     static lv_style_t pub_label_style;
  99.     lv_style_init(&pub_label_style);
  100.     lv_style_set_text_font(&pub_label_style, &lv_font_montserrat_48); // 设置字体
  101.     lv_style_set_text_color(&pub_label_style, lv_color_hex(MY_UI_COLOR_BLUE)); // 设置字体颜色
  102.     lv_obj_add_style(pub_label, &pub_label_style, LV_PART_MAIN);
  103.     lv_obj_align(pub_label, LV_ALIGN_TOP_LEFT, 525, 65);
  104.     /*设置Pub发布信息调试框*/
  105.     /*Create the one-line mode text area*/
  106.     lv_obj_t * pub_ta = lv_textarea_create(lv_scr_act());
  107.     lv_textarea_set_one_line(pub_ta, false);
  108.     lv_textarea_set_password_mode(pub_ta, false);
  109.  
  110.     lv_obj_add_event_cb(pub_ta, publish_event_cb, LV_EVENT_ALL, NULL);
  111.     lv_obj_set_size(pub_ta, 320, 320);
  112.     lv_obj_align(pub_ta, LV_ALIGN_TOP_LEFT, 462, 130);
  113.  
  114.     /*Create temp_anim keyboard*/
  115.     kb = lv_keyboard_create(lv_scr_act());
  116.     lv_obj_set_size(kb,  LV_HOR_RES, LV_VER_RES / 2);
  117.     lv_keyboard_set_textarea(kb, pub_ta); 
  118.     lv_obj_set_style_text_font(kb, &lv_font_dejavu_16_persian_hebrew, 0);
  119.     lv_obj_set_style_text_font(pub_ta, &lv_font_montserrat_24, 0);
  120.  
  121.     lv_obj_add_flag(kb, LV_OBJ_FLAG_HIDDEN);
  122. }

2.3Ui_main.c界面切换处理文件

此文件中，创建了一个线程来处理我们项目中所有UI的处理，左边的app功能栏中的4个图片按钮用于切换4个不同功能的app，其他的诸如清屏，按键回调函数，各位自行看看即可。

  1. #include "ui_main.h"
  2. #include "ui_app_yunpintai.h"
  3. #include "ui_app_smarthome.h"
  4. #include "ui_app_camera.h"
  5. #include "ui_app_music.h"
  6.  
  7. static app_imgbtn_t app_imgbtn[NUM_APPS];
  8. static int current_active_app = -1;
  9. static pthread_t g_ds_ui_page_thread = NULL;
  10. extern void *mqtt_handle;
  11. extern lv_obj_t *recv_ta;
  12. char *pub_topic = "/k1h2hJkoTA7/Linux_ATK/user/Android_STM32";
  13. int app_index = 0;
  14.  
  15. // 创建一个与背景颜色相同的对象来覆盖指定区域
  16. void clear_area(lv_coord_t x, lv_coord_t y, lv_coord_t width, lv_coord_t height, lv_color_t value)
  17. {
  18.     lv_obj_t *clear_obj = lv_obj_create(lv_scr_act());   // 创建一个对象
  19.     lv_obj_remove_style_all(clear_obj);                  // 移除默认样式
  20.     lv_obj_set_size(clear_obj, width, height);           // 设置对象大小
  21.     lv_obj_set_pos(clear_obj, x, y);                     // 设置对象位置
  22.     lv_obj_set_style_bg_color(clear_obj, value, 0);      // 设置对象背景颜色，假设背景是白色
  23.     lv_obj_set_style_bg_opa(clear_obj, LV_OPA_COVER, 0); // 设置对象不透明度
  24. }
  25.  
  26. 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)
  27. {
  28.     static lv_style_t style;
  29.     lv_style_init(&style);
  30.  
  31.     /*Set temp_anim background color and temp_anim radius*/
  32.     lv_style_set_radius(&style, 25);
  33.     lv_style_set_bg_opa(&style, LV_OPA_COVER);
  34.     lv_style_set_bg_color(&style, value);
  35.  
  36.     /*Create an object with the new style*/
  37.     lv_obj_t *obj = lv_obj_create(lv_scr_act());
  38.     lv_obj_add_style(obj, &style, 0);
  39.     lv_obj_set_size(obj, width, height);
  40.     lv_obj_align(obj, LV_ALIGN_TOP_LEFT, x, y);
  41. }
  42.  
  43. /* 功能栏按键 切换app */
  44. static void imgbtn_event_handler(lv_event_t *e)
  45. {
  46.     lv_obj_t *imgbtn = lv_event_get_target(e);
  47.     lv_event_code_t code = lv_event_get_code(e);
  48.  
  49.     if (code == LV_EVENT_CLICKED)
  50.     {
  51.         printf("Button clicked!\n");
  52.  
  53.         /* Find the app_index of the pressed button */
  54.         for (int i = 0; i < NUM_APPS; i++)
  55.         {
  56.             if (app_imgbtn[i].imgbtn == imgbtn)
  57.             {
  58.                 app_index = i;
  59.                 break;
  60.             }
  61.         }
  62.         printf("app_index = %d\n", app_index);
  63.         /* Update the active app */
  64.         current_active_app = app_index;
  65.         /* Call ui_smarthome_page to update the UI */
  66.         ui_page_main();
  67.     }
  68. }
  69.  
  70. void ui_create_app_imagebtn(unsigned int x, unsigned int y)
  71. {
  72.     /* Define the image resources for each app button */
  73.     app_imgbtn[0].img_on = &img_yunpintai_on;
  74.     app_imgbtn[0].img_off = &img_yunpintai_off;
  75.     app_imgbtn[1].img_on = &img_smarthome_on;
  76.     app_imgbtn[1].img_off = &img_smarthome_off;
  77.     app_imgbtn[2].img_on = &img_camera_on;
  78.     app_imgbtn[2].img_off = &img_camera_off;
  79.     app_imgbtn[3].img_on = &img_music_on;
  80.     app_imgbtn[3].img_off = &img_music_off;
  81.     /* Create an image button */
  82.     for (int i = 0; i < NUM_APPS; i++)
  83.     {
  84.         app_imgbtn[i].imgbtn = lv_imgbtn_create(lv_scr_act());
  85.         lv_imgbtn_set_src(app_imgbtn[i].imgbtn, LV_IMGBTN_STATE_RELEASED, NULL, NULL, app_imgbtn[i].img_off);
  86.         lv_imgbtn_set_src(app_imgbtn[i].imgbtn, LV_IMGBTN_STATE_PRESSED, NULL, NULL, app_imgbtn[i].img_on);
  87.         /* Add event handler to switch images on press */
  88.         lv_obj_add_event_cb(app_imgbtn[i].imgbtn, imgbtn_event_handler, LV_EVENT_CLICKED, NULL);
  89.         /* Set size and position */
  90.         lv_obj_set_size(app_imgbtn[i].imgbtn, 64, 64);
  91.         lv_obj_align(app_imgbtn[i].imgbtn, LV_ALIGN_TOP_LEFT, x + 12, y + 20 + 90 * i); // Adjust the positions as needed
  92.     }
  93. }
  94.  
  95. /*创建左app栏*/
  96. void ui_left_app_bar(unsigned int x, unsigned int y)
  97. {
  98.  
  99.     /* 创建左功能栏 */
  100.     static lv_style_t style_bg;
  101.     lv_style_init(&style_bg);
  102.     lv_style_set_radius(&style_bg, 25);
  103.     lv_style_set_bg_color(&style_bg, lv_color_hex(MY_UI_COLOR_WHITE));
  104.     lv_style_set_bg_opa(&style_bg, LV_OPA_COVER);
  105.     /* Create temp_anim background object */
  106.     lv_obj_t *bg = lv_obj_create(lv_scr_act());
  107.     lv_obj_add_style(bg, &style_bg, 0);
  108.  
  109.     lv_obj_set_size(bg, 90, 380);
  110.     lv_obj_align(bg, LV_ALIGN_TOP_LEFT, x, y);
  111.     ui_create_app_imagebtn(x, y);
  112. }
  113.  
  114. static void destroy_previous_objects(void)
  115. {
  116.     if (recv_ta != NULL)
  117.     {
  118.         lv_obj_del(recv_ta);
  119.         recv_ta = NULL;
  120.         printf("recv_ta destroyed\n");
  121.     }
  122. }
  123.  
  124. /* 页面主函数 */
  125. void ui_page_main(void)
  126. {
  127.     destroy_previous_objects();
  128.     lv_obj_set_style_bg_color(lv_scr_act(), lv_color_hex(MY_UI_COLOR_DEEP_WHITE), LV_PART_MAIN);
  129.     ui_left_app_bar(20, 70);
  130.     if (app_index == UI_APP_YUNPINTAI)
  131.     {
  132.         ui_app_yunpintai();
  133.     }
  134.     else if (app_index == UI_APP_SMARTHOME)
  135.     {
  136.         ui_app_smarthome();
  137.     }
  138.     else if (app_index == UI_APP_CAMERA)
  139.     {
  140.         ui_app_camera();
  141.     }
  142.     else if (app_index == UI_APP_MUSIC)
  143.     {
  144.         ui_app_music();
  145.     }
  146. }
  147.  
  148. void *ds_ui_page_thread(void *args)
  149. {
  150.     ui_page_main();
  151.     // setup_time_update();
  152.     while (1)
  153.     {
  154.         lv_task_handler();
  155.         usleep(5000);
  156.     }
  157.     return NULL;
  158. }
  159.  
  160. int ui_app_page_init(void)
  161. {
  162.     int res;
  163.     res = pthread_create(&g_ds_ui_page_thread, NULL, ds_ui_page_thread, NULL);
  164.     if (res != 0)
  165.     {
  166.         printf("pthread_create ds_ui_page_thread failed: %d\n", res);
  167.         return -1;
  168.     }
  169.     printf("ds_ui_page_thread created successfully\n");
  170.     return 0;
  171. }

2.4.main函数

在main函数中先需要初始化lvgl的相关内容，然后调用ui_app_page_init();和net_mqtt_aliyun_init();来对界面初始化和连接上阿里云。

  1. #include "app_main.h"
  2.  
  3. extern lv_obj_t *recv_ta;
  4. #define DISP_BUF_SIZE (800 * 480)
  5. static void my_lvgl_init(void);
  6.  
  7. int main(void)
  8. {
  9.     printf("Hello Linux!!!\n\r");
  10.     set_led_mode("off");
  11.     my_lvgl_init();
  12.     ui_app_page_init();
  13.     net_mqtt_aliyun_init();
  14.  
  15.     while (1)
  16.     {
  17.         sleep(1);
  18.     }
  19.     return 0;
  20. }
  21.  
  22. /*Set in lv_conf.h as `LV_TICK_CUSTOM_SYS_TIME_EXPR`*/
  23. uint32_t custom_tick_get(void)
  24. {
  25.     static uint64_t start_ms = 0;
  26.     if (start_ms == 0)
  27.     {
  28.         struct timeval tv_start;
  29.         gettimeofday(&tv_start, NULL);
  30.         start_ms = (tv_start.tv_sec * 1000000 + tv_start.tv_usec) / 1000;
  31.     }
  32.  
  33.     struct timeval tv_now;
  34.     gettimeofday(&tv_now, NULL);
  35.     uint64_t now_ms;
  36.     now_ms = (tv_now.tv_sec * 1000000 + tv_now.tv_usec) / 1000;
  37.  
  38.     uint32_t time_ms = now_ms - start_ms;
  39.     return time_ms;
  40. }
  41.  
  42. static void my_lvgl_init(void)
  43. {
  44.     /*LittlevGL init*/
  45.     lv_init();
  46.  
  47.     /*Linux frame buffer device init*/
  48.     fbdev_init();
  49.  
  50.     /*A small buffer for LittlevGL to draw the screen's content*/
  51.     static lv_color_t buf[DISP_BUF_SIZE];
  52.  
  53.     /*Initialize a descriptor for the buffer*/
  54.     static lv_disp_draw_buf_t disp_buf;
  55.     lv_disp_draw_buf_init(&disp_buf, buf, NULL, DISP_BUF_SIZE);
  56.  
  57.     /*Initialize and register a display driver*/
  58.     static lv_disp_drv_t disp_drv;
  59.     lv_disp_drv_init(&disp_drv);
  60.     disp_drv.draw_buf = &disp_buf;
  61.     disp_drv.flush_cb = fbdev_flush;
  62.     disp_drv.hor_res = 800;
  63.     disp_drv.ver_res = 480;
  64.     lv_disp_drv_register(&disp_drv);
  65.  
  66.     /* Linux input device init */
  67.     evdev_init();
  68.     /* Initialize and register a display input driver */
  69.     /* Segmentation fault:*/
  70.     lv_indev_drv_t indev_drv;
  71.     lv_indev_drv_init(&indev_drv); /*Basic initialization*/
  72.     indev_drv.type = LV_INDEV_TYPE_POINTER;
  73.     indev_drv.read_cb = evdev_read;
  74.     lv_indev_t *my_indev = lv_indev_drv_register(&indev_drv);
  75.     /* Segmentation fault:*/
  76.     // printf("LVGL_Init OK!\r\n");
  77. }

3.结尾（附网盘链接）

链接：百度网盘 请输入提取码

提取码：2jia

--来自百度网盘超级会员V5的分享

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/知新_RL/article/detail/923047
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号