教你快速复刻ESP8266太空人小电视（基于LVGL、GUI-Guider以及亮牛LN882H WIFI-BLE芯片）--持续更新
发布时间：2023年12月24日
目录
前言
????????之前有在哔哩哔哩上面看到基于ESP8266做的太空人小电视，感觉很有意思，一直想复刻一个，所以正好趁着最近有时间，用手上的亮牛半导体的WIFI芯片LN882H复刻了一个。
? ? ? ? 在开始之前先看看我的成果：
12月24日
一、GUI设计
????????正如标题里面提到的，我们是使用LVGL进行UI设计，LVGL有一个用户界面开发工具——GUI Guider，这个工具支持拖放的所见即所得UI设计，非常方便。GUI-Guider下载
? ? ? ? 安装好软件之后创建工程：
? ? ? ? 然后我们就可以参考网络上的太空人小电视来设计UI了，下图是我在网上随便找的，下面就开始根据这个来进行设计。
????????????????????????????????
????????首先，先放置一些标签（label），这些标签用来显示基本的文字信息，例如时间，地点，天气，温湿度等等。
放好之后就像下图这样：
????????然后开始放置图片和我们的太空人GIF，GUI-Guider会自动将GIF转成图片，但是图片太多了需要删除 一部分，并且编译然后看下结果，有乱码是因为字体不支持中文，这个可以后面解决。（因为是第一次编译，所以比较慢）
继续添加图片和温湿度的进度条：
然后再添加一个循环播放的标签就大功告成了：
至此，UI设计就结束了，点击右上角播放按钮可以自动生成LVGL的UI代码，同时运行虚拟机。
上文中的坐标可以参考下面生成的代码。一些图片资源可以在这里下载：图片资源
/*
* Copyright 2023 NXP
* NXP Confidential and 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.
*/
#include "lvgl.h"
#include <stdio.h>
#include "gui_guider.h"
#include "events_init.h"
#include "widgets_init.h"
void setup_scr_screen_time(lv_ui *ui)
{
//Write codes screen_time
ui->screen_time = lv_obj_create(NULL);
lv_obj_set_size(ui->screen_time, 240, 240);
//Write style for screen_time, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_bg_opa(ui->screen_time, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(ui->screen_time, lv_color_hex(0x000000), LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_label_point
ui->screen_time_label_point = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_label_point, ":");
lv_label_set_long_mode(ui->screen_time_label_point, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_label_point, 61, 53);
lv_obj_set_size(ui->screen_time_label_point, 83, 66);
//Write style for screen_time_label_point, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_label_point, lv_color_hex(0xbecdff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_label_point, &lv_font_Acme_Regular_64, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_label_point, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_label_point, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_label_point, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_hum_img
ui->screen_time_hum_img = lv_img_create(ui->screen_time);
lv_obj_add_flag(ui->screen_time_hum_img, LV_OBJ_FLAG_CLICKABLE);
lv_img_set_src(ui->screen_time_hum_img, &_hum_alpha_15x15);
lv_img_set_pivot(ui->screen_time_hum_img, 50,50);
lv_img_set_angle(ui->screen_time_hum_img, 10);
lv_obj_set_pos(ui->screen_time_hum_img, 7, 208);
lv_obj_set_size(ui->screen_time_hum_img, 15, 15);
//Write style for screen_time_hum_img, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_img_opa(ui->screen_time_hum_img, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_tem_img
ui->screen_time_tem_img = lv_img_create(ui->screen_time);
lv_obj_add_flag(ui->screen_time_tem_img, LV_OBJ_FLAG_CLICKABLE);
lv_img_set_src(ui->screen_time_tem_img, &_tem_alpha_20x20);
lv_img_set_pivot(ui->screen_time_tem_img, 50,50);
lv_img_set_angle(ui->screen_time_tem_img, 0);
lv_obj_set_pos(ui->screen_time_tem_img, 7, 172);
lv_obj_set_size(ui->screen_time_tem_img, 20, 20);
//Write style for screen_time_tem_img, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_img_opa(ui->screen_time_tem_img, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_animimg_1
ui->screen_time_animimg_1 = lv_animimg_create(ui->screen_time);
lv_animimg_set_src(ui->screen_time_animimg_1, (const void **) screen_time_animimg_1_imgs, 6, false);
lv_animimg_set_duration(ui->screen_time_animimg_1, 60*6);
lv_animimg_set_repeat_count(ui->screen_time_animimg_1, LV_ANIM_REPEAT_INFINITE);
lv_animimg_start(ui->screen_time_animimg_1);
lv_obj_set_pos(ui->screen_time_animimg_1, 150, 150);
lv_obj_set_size(ui->screen_time_animimg_1, 90, 90);
//Write codes screen_time_hum_label
ui->screen_time_hum_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_hum_label, "-26℃");
lv_label_set_long_mode(ui->screen_time_hum_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_hum_label, 95, 207);
lv_obj_set_size(ui->screen_time_hum_label, 65, 20);
//Write style for screen_time_hum_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_hum_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_hum_label, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_hum_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_hum_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_hum_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_tem_label
ui->screen_time_tem_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_tem_label, "100%");
lv_label_set_long_mode(ui->screen_time_tem_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_tem_label, 95, 175);
lv_obj_set_size(ui->screen_time_tem_label, 65, 20);
//Write style for screen_time_tem_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_tem_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_tem_label, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_tem_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_tem_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_tem_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_hum_bar
ui->screen_time_hum_bar = lv_bar_create(ui->screen_time);
lv_obj_set_style_anim_time(ui->screen_time_hum_bar, 1000, 0);
lv_bar_set_mode(ui->screen_time_hum_bar, LV_BAR_MODE_NORMAL);
lv_bar_set_value(ui->screen_time_hum_bar, 50, LV_ANIM_OFF);
lv_obj_set_pos(ui->screen_time_hum_bar, 28, 212);
lv_obj_set_size(ui->screen_time_hum_bar, 71, 8);
//Write style for screen_time_hum_bar, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_bg_opa(ui->screen_time_hum_bar, 60, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(ui->screen_time_hum_bar, lv_color_hex(0x2195f6), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_hum_bar, 10, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_hum_bar, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write style for screen_time_hum_bar, Part: LV_PART_INDICATOR, State: LV_STATE_DEFAULT.
lv_obj_set_style_bg_opa(ui->screen_time_hum_bar, 255, LV_PART_INDICATOR|LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(ui->screen_time_hum_bar, lv_color_hex(0xa8c3ff), LV_PART_INDICATOR|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_hum_bar, 10, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//Write codes screen_time_tem_bar
ui->screen_time_tem_bar = lv_bar_create(ui->screen_time);
lv_obj_set_style_anim_time(ui->screen_time_tem_bar, 1000, 0);
lv_bar_set_mode(ui->screen_time_tem_bar, LV_BAR_MODE_NORMAL);
lv_bar_set_value(ui->screen_time_tem_bar, 50, LV_ANIM_OFF);
lv_obj_set_pos(ui->screen_time_tem_bar, 28, 180);
lv_obj_set_size(ui->screen_time_tem_bar, 71, 8);
//Write style for screen_time_tem_bar, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_bg_opa(ui->screen_time_tem_bar, 60, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(ui->screen_time_tem_bar, lv_color_hex(0x2195f6), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_tem_bar, 10, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_tem_bar, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write style for screen_time_tem_bar, Part: LV_PART_INDICATOR, State: LV_STATE_DEFAULT.
lv_obj_set_style_bg_opa(ui->screen_time_tem_bar, 255, LV_PART_INDICATOR|LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(ui->screen_time_tem_bar, lv_color_hex(0xffe4ae), LV_PART_INDICATOR|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_tem_bar, 10, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//Write codes screen_time_second_label
ui->screen_time_second_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_second_label, "55\n");
lv_label_set_long_mode(ui->screen_time_second_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_second_label, 175, 84);
lv_obj_set_size(ui->screen_time_second_label, 57, 28);
//Write style for screen_time_second_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_second_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_second_label, &lv_font_Acme_Regular_32, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_second_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_second_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_second_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_weather_img
ui->screen_time_weather_img = lv_img_create(ui->screen_time);
//lv_obj_add_flag(ui->screen_time_weather_img, LV_OBJ_FLAG_CLICKABLE);
lv_img_set_src(ui->screen_time_weather_img, &w0);
lv_img_set_pivot(ui->screen_time_weather_img, 48,48);
lv_img_set_size_mode(ui->screen_time_weather_img, LV_IMG_SIZE_MODE_VIRTUAL);
// lv_img_set_angle(ui->screen_time_weather_img, 0);
lv_obj_set_pos(ui->screen_time_weather_img, 182, 0);
lv_obj_set_size(ui->screen_time_weather_img, 48, 48);
//Write style for screen_time_weather_img, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_img_opa(ui->screen_time_weather_img, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_weather_label
ui->screen_time_weather_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_weather_label, "暴风雨");
lv_label_set_long_mode(ui->screen_time_weather_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_weather_label, 100, 7);
lv_obj_set_size(ui->screen_time_weather_label, 90, 18);
//Write style for screen_time_weather_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_weather_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_weather_label, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_weather_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_weather_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_weather_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_label_5
ui->screen_time_label_5 = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_label_5, "室外温度：25℃，室外湿度30%");
lv_label_set_long_mode(ui->screen_time_label_5, LV_LABEL_LONG_SCROLL_CIRCULAR);
lv_obj_set_pos(ui->screen_time_label_5, 19, 32);
lv_obj_set_size(ui->screen_time_label_5, 150, 18);
//Write style for screen_time_label_5, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_label_5, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_label_5, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_label_5, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_label_5, LV_TEXT_ALIGN_RIGHT, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_label_5, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_minute_label
ui->screen_time_minute_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_minute_label, "24");
lv_label_set_long_mode(ui->screen_time_minute_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_minute_label, 107, 59);
lv_obj_set_size(ui->screen_time_minute_label, 83, 66);
//Write style for screen_time_minute_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_minute_label, lv_color_hex(0xff9711), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_minute_label, &lv_font_Acme_Regular_64, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_minute_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_minute_label, LV_TEXT_ALIGN_LEFT, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_minute_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_hour_label
ui->screen_time_hour_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_hour_label, "24");
lv_label_set_long_mode(ui->screen_time_hour_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_hour_label, 14, 59);
lv_obj_set_size(ui->screen_time_hour_label, 83, 66);
//Write style for screen_time_hour_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_hour_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_hour_label, &lv_font_Acme_Regular_64, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_hour_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_hour_label, LV_TEXT_ALIGN_RIGHT, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_hour_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_position_label
ui->screen_time_position_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_position_label, "上海");
lv_label_set_long_mode(ui->screen_time_position_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_position_label, 6, 7);
lv_obj_set_size(ui->screen_time_position_label, 100, 18);
//Write style for screen_time_position_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_position_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_position_label, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_position_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_position_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_position_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Write codes screen_time_day_label
ui->screen_time_day_label = lv_label_create(ui->screen_time);
lv_label_set_text(ui->screen_time_day_label, "2023年24月24日 周二");
lv_label_set_long_mode(ui->screen_time_day_label, LV_LABEL_LONG_WRAP);
lv_obj_set_pos(ui->screen_time_day_label, 0, 131);
lv_obj_set_size(ui->screen_time_day_label, 240, 16);
//Write style for screen_time_day_label, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
lv_obj_set_style_border_width(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_radius(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_color(ui->screen_time_day_label, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_font(ui->screen_time_day_label, &my_chinese_font_16, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_letter_space(ui->screen_time_day_label, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_line_space(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_text_align(ui->screen_time_day_label, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_top(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_shadow_width(ui->screen_time_day_label, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//Update current screen layout.
lv_obj_update_layout(ui->screen_time);
}
二、获取天气和时间信息
对于如何获取天气信息和时间信息可以参考我的这篇博客：获取天气和时间信息
三、硬件连接
? ? ? ? 1. 我的主控芯片是亮牛半导体的新一代WIFI-BLE芯片——LN882H，使用了Coretex M4F，160M主频，内置296KByte RAM，8/16Mbit Flash，具备了SPI、UART、I2C、SDIO、PWM等多种外设。
????????
? ? ? ? 2. 屏幕使用240*240分辨率的TFT屏幕，LCD驱动IC为st7789
四、软件编写
后续继续更新。
文章来源:https://blog.csdn.net/xue745146527/article/details/135180547
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符，请联系我的编程经验分享网邮箱：chenni525@qq.com进行投诉反馈，一经查实，立即删除！
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符，请联系我的编程经验分享网邮箱：chenni525@qq.com进行投诉反馈，一经查实，立即删除！
最新文章
- Python教程
- 深入理解 MySQL 中的 HAVING 关键字和聚合函数
- Qt之QChar编码（1）
- MyBatis入门基础篇
- 用Python脚本实现FFmpeg批量转换
- 一加怎么录屏？轻松录制，让你事半功倍！
- 小贴士：知道方程的解如何求通解
- Vue模板编译
- muduo网络库剖析——事件循环EventLoop类
- 10 - MHA集群概述｜部署MHA集群
- C++I/O流——(4)格式化输入/输出(第二节)
- Ansible的Shell命令配置自动补全
- 如何在 Spring Boot 中配置日志记录？
- SQL语句详解一
- 大数据Doris（三十八）：Aggregate 和 Uniq 模型中的 ROLLUP