当前位置: 首页 > news >正文

【NodeMCU实时天气时钟温湿度项目 1】连接点亮SPI-TFT屏幕和UI布局设计

前言

        从今天开始,我们详解介绍制作实时天气时钟项目的方法步骤,主要分以下几个专题分别进行:(1)连接点亮SPI-TFT屏幕和UI布局设计;(2)NodeMCU的WIFI模式设置及连接;(3)连接I2C-SHT30传感器,获取显示当前温湿度数据;(4)连接NTP服务器,获取并显示网络时钟数据;(5)连接 [和风天气](商业气象服务商)服务器,获取并显示实时天气数据;(6)按照UI设计实时更新显示各项数据,等等。
        第二专题内容,请参考
        【NodeMCU实时天气时钟温湿度项目 2】WIFI模式设置及连接-CSDN博客
        第三专题内容,请参考       
【NodeMCU实时天气时钟温湿度项目 3】连接SHT30传感器,获取并显示当前环境温湿度数据(I2C)-CSDN博客
        今天是第一专题的内容。

一、项目需求清单

        1. MCU开发平台:NodeMCU 1.0 (ESP-12E Module)

                        
        2. 软件开发环境:VSCode + PlatformIO
                                     Platforms:Espressif 8266
                                     Framework: Arduino
        3. TFT显示屏:1.3寸液晶屏模组,240x240 IPS高清SPI串口屏,驱动芯片ST7789

                        
        4. 传感器:SHT3X温湿度传感器

                        
        4. 面包板、杜邦线若干
        5. 第三方库:TFT_eSPI,NTPClient,ArduinoJson,etc ...   

二、硬件电路连接关系

                

                

三、添加TFT_eSPI 图形库

        方法一:直接打开 PlatformIO 界面,在箭头指向的搜索栏内,输入TFT_eSPI,添加库。

                

方法二:当创建工程完成后,在该工程中添加库。

1. 打开当前工程文件夹
2. 依次进入.pio\libdeps\nodemcuv2\目录,直接将下载解压后的文件,拷贝到此目录。

四、配置TFT_eSPI 图形库

        1、依次进入项目文件夹下的 .pio\libdeps\nodemcuv2\TFT_eSPI 文件夹。

                

        2、使用NotePad++打开 User_Setup.h文件,复制以下代码,替换该文件内容。

#define USER_SETUP_INFO "User_Setup"#define ST7789_DRIVER      // Full configuration option, define additional parameters below for this display
#define TFT_WIDTH  240 // ST7789 240 x 240 and 240 x 320
#define TFT_HEIGHT 240 // ST7789 240 x 240// For NodeMCU - use pin numbers in the form PIN_Dx where Dx is the NodeMCU pin designation
#define TFT_MOSI  PIN_D7  // Automatically assigned with ESP8266 if not defined
#define TFT_SCLK  PIN_D5  // Automatically assigned with ESP8266 if not defined//*** 2.4寸TFT,8P,320*240, display cs pin is attached to MCU pin GND. //*** 1.3寸TFT,7P, 240*240, this line is not attached any MCU pin.
//#define TFT_CS    PIN_D8  // Chip select control pin D8   
#define TFT_DC    PIN_D3  // Data Command control pin
#define TFT_RST   PIN_D4  // Reset pin (could connect to NodeMCU RST, see next line)#define LOAD_GLCD   // Font 1. Original Adafruit 8 pixel font needs ~1820 bytes in FLASH
#define LOAD_FONT2  // Font 2. Small 16 pixel high font, needs ~3534 bytes in FLASH, 96 characters
#define LOAD_FONT4  // Font 4. Medium 26 pixel high font, needs ~5848 bytes in FLASH, 96 characters
#define LOAD_FONT6  // Font 6. Large 48 pixel font, needs ~2666 bytes in FLASH, only characters 1234567890:-.apm
#define LOAD_FONT7  // Font 7. 7 segment 48 pixel font, needs ~2438 bytes in FLASH, only characters 1234567890:-.
#define LOAD_FONT8  // Font 8. Large 75 pixel font needs ~3256 bytes in FLASH, only characters 1234567890:-.#define LOAD_GFXFF  // FreeFonts. Include access to the 48 Adafruit_GFX free fonts FF1 to FF48 and custom fonts#define SMOOTH_FONT
#define SPI_FREQUENCY  27000000
#define SPI_READ_FREQUENCY  20000000
#define SPI_TOUCH_FREQUENCY  2500000

五、项目UI布局设计展示

        下图是项目最终完成后的TFT显示布局,显示内容为静态文本,仅作为布局设计的展示。
        今后几个专题,我们将从网络获取实时日期时间、实时天气和明天天气,从温湿度传感器获取实时的空间数据。

                

        以下代码是项目主文件 main.cpp 具体内容,供参考。

//main.cpp   ---项目主文件#include <Arduino.h>
#include <TFT_eSPI.h>//构造函数,实例化 TFT 屏幕对象
TFT_eSPI tft = TFT_eSPI();//程序用到的字库文件,后面再详细说明
#include "hefeng-min-40px.h"
#include "weather_font20.h"
#include "weather_font16.h"void setup()
{//设置串口波特率Serial.begin(115200);//等待串口稳定Serial.println("");Serial.println("");Serial.println("");//TFT初始化设置tft.init();tft.setSwapBytes(true);tft.setRotation(0);  tft.fillScreen(TFT_BLACK);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);// 显示当前日期,星期几,农历tft.loadFont(weather_font16);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);tft.drawString("2024-05-03  星期五  三月二五", 0, 0);tft.unloadFont();tft.setTextSize(5);tft.setTextColor(TFT_GREEN, TFT_BLACK, true);tft.drawString("17:16:26", 0, 30);// 今日天气// 擦除指定区域tft.fillRect(55, 90, 240, 40, TFT_BLACK);tft.setTextColor(TFT_YELLOW, TFT_BLACK, true);tft.loadFont(hefeng40);tft.drawString("\uf101", 10, 90);tft.unloadFont();tft.loadFont(weather_font20);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);tft.drawString("25°C  晴", 55, 90);tft.drawString("东南风3级 3KM/H", 55, 110);tft.drawLine(0, 140, 240, 140, TFT_WHITE);// 明日天气// 擦除指定区域tft.fillRect(55, 150, 240, 40, TFT_BLACK);tft.loadFont(hefeng40);tft.setTextColor(TFT_YELLOW, TFT_BLACK, true);tft.drawString("\uf103", 10, 150);tft.unloadFont();tft.loadFont(weather_font20);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);tft.drawString("明天 15° - 28°", 55, 150);tft.drawString("多云", 55, 170);tft.drawLine(0, 200, 240, 200, TFT_WHITE);// 温湿度传感器的数据tft.loadFont(weather_font20);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);tft.drawString("室温:", 20, 210);tft.setTextColor(TFT_GREEN, TFT_BLACK, true);tft.setTextColor(TFT_WHITE, TFT_BLACK, true);tft.drawString("湿度:", 120, 210);tft.setTextColor(TFT_GREEN, TFT_BLACK, true);
}void loop()
{
}

六、项目源代码下载

        百度网盘下载链接:https://pan.baidu.com/s/1zejX6A5kA70HZqXS0XWqYA?pwd=ueef
                          提取码:ueef

        将项目导入 【VSCode + PlatformIO】环境下,编译上传到开发板后,TFT屏幕即按照UI布局设计的样式,显示出有关的信息。

        参考文档:欢迎留言交流

        1. platformio添加外部库文件方法_platformio添加自己的库-CSDN博客
        2. 【NodeMcu-ESP8266】点亮 1.3寸/2.4寸TFT液晶屏(SPI,ST7789)-CSDN博客

相关文章:

【NodeMCU实时天气时钟温湿度项目 1】连接点亮SPI-TFT屏幕和UI布局设计

前言 从今天开始&#xff0c;我们详解介绍制作实时天气时钟项目的方法步骤&#xff0c;主要分以下几个专题分别进行&#xff1a;&#xff08;1&#xff09;连接点亮SPI-TFT屏幕和UI布局设计&#xff1b;&#xff08;2&#xff09;NodeMCU的WIFI模式设置及连接&#xff1b;&…...

国内首发 | CSA大中华区启动《AI安全产业图谱(2024)》调研

在人工智能&#xff08;AI&#xff09;技术的快速发展浪潮中&#xff0c;AI安全已成为全球关注的焦点。为应对AI安全带来的挑战&#xff0c;确保AI技术的健康发展&#xff0c;全球范围内的研究机构、企业和技术社区都在积极探索解决方案。 在这一背景下&#xff0c;CSA大中华区…...

web页面与原生android通信,调用原生android方法

注册初始化方法JsBridge //JS注册事件监听 function connectWebViewJavascriptBridge(callback) {if (window.WebViewJavascriptBridge) {callback(WebViewJavascriptBridge)} else {document.addEventListener(WebViewJavascriptBridgeReady,function() {callback(WebViewJav…...

Linux的编译器

程序编译的过程 程序的编译过程是将源代码转换为可执行文件的一系列步骤。这个过程涉及多个阶段&#xff0c;主要包括预处理、编译、汇编和链接。下面详细介绍每个阶段&#xff1a; 1. 预处理&#xff08;Preprocessing&#xff09; 在实际编译之前&#xff0c;源代码文件首…...

redis--安装

简介 官网&#xff1a;RedisInsight - The Best Redis GUI 各个版本官网下载地址&#xff1a;http://download.redis.io/releases/ Redis和Memcached是非关系型数据库也称为NoSQL数据库&#xff0c;MySQL、Mariadb、SQL Server、PostgreSQL Oracle 数据库属于关系型数据 应用…...

魔法程序员的奥妙指南:Java基本语法

作为一名魔法程序员&#xff0c;精通Java语言是至关重要的。Java作为一种强大的编程语言&#xff0c;在编写优质代码和开发强大应用程序时发挥着重要作用。让我们深入探讨Java基本语法的关键要点&#xff0c;从注释到变量&#xff0c;无所不包&#xff01; Java基本语法的神秘魔…...

SpringMVC传递参数

1.RequestMapping RequestMapping本身可以处理&#xff0c;get或post,指定了get或post之后&#xff0c;就只能处理对应的请求。 RequestMapping(value{"haihiyo","goodMoring"},methodRequestMethod.POST)2.RestFul风格 RestFul是一种风格 比如:网站的访…...

【Scala---04】函数式编程 『 函数 vs 方法 | 函数至简原则 | 函数式编程』

文章目录 1. 函数 vs 方法1.1 方法(1) 定义方法(2) 运算符即方法 1.2 函数(1) 定义函数(2) 匿名函数 1.3 方法转为函数1.4 可变参数&默认参数 2. 函数至简原则3. 函数式编程3.1 函数式编程思想3.3 函数柯里化&闭包3.5 递归 & 尾递归 4. 补充4.1 访问元祖元素4.2 &g…...

[华为OD] B卷 树状结构查询 200

题目&#xff1a; 通常使用多行的节点、父节点表示一棵树&#xff0c;比如 西安 陕西 陕西 中国 江西 中国 中国 亚洲 泰国 亚洲 输入一个节点之后&#xff0c;请打印出来树中他的所有下层节点 输入描述 第一行输入行数&#xff0c;下面是多行数据&#xff0c;每行以空…...

基于机器学习的学生学习行为自主评价设计与实现

管理员功能&#xff1a; a)学生学习数据管理&#xff1a;可查看学生学习的详情&#xff0c;编辑学生学习的内容&#xff0c;删除和添加学生学习&#xff0c;设置学生学习库存。 b)角色管理&#xff1a;增加删除学生用户&#xff0c;分配学生用户权限&#xff0c;查看学生用户…...

toml与json联系对比

前言 本文简单介绍toml&#xff1b;并且和json转化做对比&#xff0c;以及我对toml设计的理解。 参考&#xff1a; TOML: 简体中文 v1.0.0 json和toml转化工具 在线JSON转toml-toml转JSON - bejson在线工具 正文 数组 说白了&#xff0c;就是一个变量名&#xff0c;有多个…...

(已解决)org.springframework.amqp.rabbit.support.ListenerExecutionFailedException

报错截图 解决方案 1、登录rabbitMQ网址&#xff0c;删除所有队列 2、重启rabbitMQ 亲测有效&#xff01;&#xff01;&#xff01;亲测有效&#xff01;&#xff01;&#xff01;亲测有效&#xff01;&#xff01;&#xff01;...

基于FPGA的数字信号处理(9)--定点数据的两种溢出处理模式:饱和(Saturate)和绕回(Wrap)

1、前言 在逻辑设计中&#xff0c;为了保证运算结果的正确性&#xff0c;常常需要对结果的位宽进行扩展。比如2个3bits的无符号数相加&#xff0c;只有将结果设定为4bits&#xff0c;才能保证结果一定是正确的。不然&#xff0c;某些情况如77 14(1110)&#xff0c;如果结果只…...

基于STM32的宠物箱温度湿度监控系统毕业设计

基于STM32的宠物箱温度湿度监控系统毕业设计 一、项目背景与意义 随着人们生活水平的提高&#xff0c;养宠物已经成为一种流行趋势。然而&#xff0c;对于宠物的居住环境&#xff0c;尤其是温度与湿度的控制&#xff0c;是确保宠物健康的关键。本项目旨在设计一款基于STM32微…...

Linux sudo 指令

sudo命令 概念&#xff1a; sudo是linux下常用的允许普通用户使用超级用户权限的工具&#xff0c;允许系统管理员让普通用户执行一些或者全部的root命令&#xff0c;如halt&#xff0c;reboot&#xff0c;su等。这样不仅减少了root用户的登录和管理时间&#xff0c;同样也提高…...

【NumPy数组】:深入了解numpy.linspace()函数

一、numpy.linspace()函数的原理 numpy.linspace()函数的核心原理是在指定的起始值和终止值之间&#xff0c;按照给定的元素个数&#xff0c;生成等间隔的数值序列。与numpy.arange()函数不同&#xff0c;numpy.linspace()生成的是等间隔的数值&#xff0c;而不是等差的数值&a…...

计算机网络实验二:交换机的基本配置与操作

实验二:交换机的基本配置与操作 一、实验要求 (1)掌握windows网络参数的设置(TCP/IP协议的设置); (2)掌握交换机命令行各种操作模式的区别,以及模式之间的切换; (3)掌握交换机的全局的基本配置; (4)掌握交换机端口的常用配置参数; (5)查看交换机系统和…...

宏的优缺点?C++有哪些技术替代宏?(const)权限的平移、缩小

宏的优缺点&#xff1f; 优点&#xff1a; 1.增强代码的复用性。【减少冗余代码】 2.提高性能&#xff0c;提升代码运行效率。 缺点&#xff1a; 1.不方便调试宏。&#xff08;因为预编译阶段进行了替换&#xff09; 2.导致代码可读性差&#xff0c;可维护性差&#xff0…...

2024数维杯数学建模选题建议及各题思路来啦!

大家好呀&#xff0c;2024数维杯数学建模挑战赛开始了&#xff0c;来说一下初步的选题建议吧&#xff1a; 首先定下主基调&#xff0c; 本次数维杯建议选B。难度上C&#xff1e;A&#xff1e;B。B题目是比较经典的数据分析类题目&#xff0c;主要做统计分析差异显著性以及相关…...

centos的常用命令

CentOS是一个基于Red Hat Enterprise Linux&#xff08;RHEL&#xff09;的开源操作系统&#xff0c;常用于服务器环境。以下是一些CentOS中常用的命令&#xff1a; 文件和目录管理&#xff1a; ls&#xff1a;列出目录中的文件。 ls -l&#xff1a;以长格式列出文件和目录的…...

装饰模式(Decorator Pattern)重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

华为OD机试-食堂供餐-二分法

import java.util.Arrays; import java.util.Scanner;public class DemoTest3 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextIn…...

【2025年】解决Burpsuite抓不到https包的问题

环境&#xff1a;windows11 burpsuite:2025.5 在抓取https网站时&#xff0c;burpsuite抓取不到https数据包&#xff0c;只显示&#xff1a; 解决该问题只需如下三个步骤&#xff1a; 1、浏览器中访问 http://burp 2、下载 CA certificate 证书 3、在设置--隐私与安全--…...

土地利用/土地覆盖遥感解译与基于CLUE模型未来变化情景预测;从基础到高级,涵盖ArcGIS数据处理、ENVI遥感解译与CLUE模型情景模拟等

&#x1f50d; 土地利用/土地覆盖数据是生态、环境和气象等诸多领域模型的关键输入参数。通过遥感影像解译技术&#xff0c;可以精准获取历史或当前任何一个区域的土地利用/土地覆盖情况。这些数据不仅能够用于评估区域生态环境的变化趋势&#xff0c;还能有效评价重大生态工程…...

相机Camera日志分析之三十一:高通Camx HAL十种流程基础分析关键字汇总(后续持续更新中)

【关注我,后续持续新增专题博文,谢谢!!!】 上一篇我们讲了:有对最普通的场景进行各个日志注释讲解,但相机场景太多,日志差异也巨大。后面将展示各种场景下的日志。 通过notepad++打开场景下的日志,通过下列分类关键字搜索,即可清晰的分析不同场景的相机运行流程差异…...

用docker来安装部署freeswitch记录

今天刚才测试一个callcenter的项目&#xff0c;所以尝试安装freeswitch 1、使用轩辕镜像 - 中国开发者首选的专业 Docker 镜像加速服务平台 编辑下面/etc/docker/daemon.json文件为 {"registry-mirrors": ["https://docker.xuanyuan.me"] }同时可以进入轩…...

大学生职业发展与就业创业指导教学评价

这里是引用 作为软工2203/2204班的学生&#xff0c;我们非常感谢您在《大学生职业发展与就业创业指导》课程中的悉心教导。这门课程对我们即将面临实习和就业的工科学生来说至关重要&#xff0c;而您认真负责的教学态度&#xff0c;让课程的每一部分都充满了实用价值。 尤其让我…...

省略号和可变参数模板

本文主要介绍如何展开可变参数的参数包 1.C语言的va_list展开可变参数 #include <iostream> #include <cstdarg>void printNumbers(int count, ...) {// 声明va_list类型的变量va_list args;// 使用va_start将可变参数写入变量argsva_start(args, count);for (in…...

篇章二 论坛系统——系统设计

目录 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 1. 数据库设计 1.1 数据库名: forum db 1.2 表的设计 1.3 编写SQL 2.系统设计 2.1 技术选型 2.2 设计数据库结构 2.2.1 数据库实体 通过需求分析获得概念类并结合业务实现过程中的技术需要&#x…...

鸿蒙HarmonyOS 5军旗小游戏实现指南

1. 项目概述 本军旗小游戏基于鸿蒙HarmonyOS 5开发&#xff0c;采用DevEco Studio实现&#xff0c;包含完整的游戏逻辑和UI界面。 2. 项目结构 /src/main/java/com/example/militarychess/├── MainAbilitySlice.java // 主界面├── GameView.java // 游戏核…...