1. 项目概述你的第一个智能天气时钟最近在B站看到一个用STM32和ESP32做的智能天气时钟项目觉得特别有意思。这个项目不仅能显示时间还能实时更新天气信息关键是成本不到200块钱。我自己跟着做了一遍发现虽然涉及的技术点不少但每一步都有迹可循特别适合想入门嵌入式开发的朋友练手。这个项目的核心思路很简单用ESP32连网获取天气数据和时间然后通过串口传给STM32最后由STM32驱动ST7735屏幕显示出来。听起来是不是很像把几个模块拼积木但实际操作中会遇到不少坑比如AT指令的调试、SPI屏幕的驱动、网络数据的解析等等。不过别担心我会把每个环节都拆开讲清楚。硬件方面需要准备的东西不少但大部分都很常见。核心是STM32F103C8T6最小系统板和ESP32-C3模组屏幕建议选1.8寸的ST7735驱动的TFT屏SPI接口。其他像杜邦线、下载器这些玩过单片机的朋友应该都有现成的。软件方面主要用Keil MDK开发配合VSCode写代码会更高效。2. 硬件搭建从零开始的连接指南2.1 核心器件选型建议STM32我推荐用蓝色pill板STM32F103C8T6价格便宜资料多。ESP32建议用ESP32-C3模组比传统的ESP8266性能更强还支持蓝牙。屏幕一定要确认是ST7735驱动芯片的市面上有些兼容屏驱动方式不一样。我第一次就买错了结果调了一整天都没点亮。连接前务必准备好以下硬件STM32核心板 x1ESP32-C3模组 x1ST7735屏幕 x1USB转TTL模块 x1J-Link OB下载器 x1杜邦线若干建议备齐公对公、公对母、母对母三种2.2 电路连接详解接线是第一个容易踩坑的地方。ESP32和STM32之间需要用串口通信我建议用USART2PA2、PA3因为USART1通常要留给下载程序用。具体连接方式STM32 ESP32-C3 ST7735 PA2 RX - PA3 TX - 3.3V 3.3V VCC GND GND GND PA4 - RES PA5 - DC PA6 - SDA PA7 - SCL PB0 - CS特别注意ESP32的RX接STM32的TXTX接RX别反了。屏幕的背光可以单独接个PWM控制这样能实现亮度调节。我第一次做的时候把所有线都挤在一起结果干扰严重导致屏幕闪烁后来重新整理走线就好了。3. 软件开发环境配置3.1 工具链安装建议先用VSCode写代码再用Keil编译。VSCode装个C/C插件和EditorConfig插件后者可以自动规范代码格式。Keil需要安装STM32F1的Device Family Pack这个在Keil官网就能下载。配置VSCode的.editorconfig文件[*.{c,h}] charset utf-8 indent_style space indent_size 4 trim_trailing_whitespace true insert_final_newline true3.2 工程模板搭建在Keil里新建工程时记得勾选CMSIS核心和Device Startup文件。外设库建议用HAL库比标准库更简单。需要初始化的外设有USART2连接ESP32SPI1连接屏幕GPIO屏幕控制线定时器可选用于屏幕刷新重点检查时钟树配置STM32F103默认是72MHz主频但有些开发板外部晶振是8MHz需要手动修改PLL倍频参数。我之前就因为时钟没配对导致SPI通信速率不对屏幕显示全是乱码。4. ESP32网络通信实战4.1 AT指令基础ESP32-C3默认固件就支持AT指令先用USB转TTL模块测试基本功能AT ATCWMODE1 // 设置STA模式 ATCWJAPWiFi名称,密码 // 连接WiFi ATCIPSNTPCFG1,8,ntp1.aliyun.com // 配置NTP服务器调试时建议用串口助手单独测试每条指令确认ESP32能正常联网后再集成到STM32工程里。常见问题有指令格式错误比如多了空格、响应超时等。我遇到最坑的是某些路由器频道不兼容换了个2.4G频段就好了。4.2 天气API对接推荐使用心知天气的免费API注册后获取私钥。请求URL格式https://api.seniverse.com/v3/weather/now.json?key你的私钥location城市名languagezh-Hansunitc在STM32中通过AT指令发送HTTP请求ATCIPSTARTTCP,api.seniverse.com,80 ATCIPSEND100 GET /v3/weather/now.json?keyxxxlocationbeijing HTTP/1.1 Host: api.seniverse.com收到返回的JSON数据后需要用字符串处理函数解析出温度、天气状况等信息。建议先固定测试一个城市调试好解析逻辑后再扩展。5. ST7735屏幕驱动技巧5.1 底层驱动实现ST7735是SPI接口的但STM32的硬件SPI可能和屏幕时序不匹配建议先用软件模拟SPI调试。关键操作序列拉低CS片选发送命令字节DC线拉低发送数据字节DC线拉高拉高CS片选初始化代码要严格按照datasheet的时序来特别是复位和睡眠唤醒的延时。我参考了GD32驱动ST7735的代码发现复位后至少要延时120ms才能发送初始化命令。5.2 显示优化技巧天气图标可以用LVGL官网的工具转换选择RGB565格式。文字显示建议用点阵字库网上有现成的12x12、16x16字库。如果要显示中文需要处理GBK编码转换。一个实用的刷新策略分区域更新。比如时间区域每秒刷新一次天气区域每10分钟更新一次这样可以减少闪屏。实测发现全屏刷新时会有明显闪烁后来改成局部刷新就流畅多了。6. 系统整合与优化6.1 主程序架构推荐用状态机模型管理各个功能模块typedef enum { SYS_INIT, NET_CONNECT, TIME_SYNC, WEATHER_UPDATE, DISPLAY_REFRESH } SystemState; void main() { SystemState state SYS_INIT; while(1) { switch(state) { case SYS_INIT: // 硬件初始化 break; // 其他状态处理... } } }6.2 常见问题排查屏幕白屏检查复位信号和背光电压天气数据获取失败确认ESP32联网状态和API密钥时间不准调整NTP服务器地址和时区参数显示乱码检查SPI时钟极性和相位设置调试时建议把关键变量通过串口打印出来比如网络返回的原始数据、解析后的天气信息等。我后来加了个错误代码显示功能遇到问题直接在屏幕上显示错误类型省去了连串口的麻烦。7. 进阶改造思路基础功能实现后可以尝试这些扩展增加温湿度传感器如DHT11添加触摸按键切换显示内容用PWM调节屏幕亮度晚上自动变暗支持多城市天气切换添加日程提醒功能我在第二个版本里加了MPU6050陀螺仪摇一摇就能切换显示模式效果很酷。存储方面可以加个W25Q Flash芯片用来缓存天气图标和字库。
基于STM32与ESP32的智能天气时钟DIY全解析（附B站复现指南）
发布时间：2026/5/27 3:35:10
1. 项目概述你的第一个智能天气时钟最近在B站看到一个用STM32和ESP32做的智能天气时钟项目觉得特别有意思。这个项目不仅能显示时间还能实时更新天气信息关键是成本不到200块钱。我自己跟着做了一遍发现虽然涉及的技术点不少但每一步都有迹可循特别适合想入门嵌入式开发的朋友练手。这个项目的核心思路很简单用ESP32连网获取天气数据和时间然后通过串口传给STM32最后由STM32驱动ST7735屏幕显示出来。听起来是不是很像把几个模块拼积木但实际操作中会遇到不少坑比如AT指令的调试、SPI屏幕的驱动、网络数据的解析等等。不过别担心我会把每个环节都拆开讲清楚。硬件方面需要准备的东西不少但大部分都很常见。核心是STM32F103C8T6最小系统板和ESP32-C3模组屏幕建议选1.8寸的ST7735驱动的TFT屏SPI接口。其他像杜邦线、下载器这些玩过单片机的朋友应该都有现成的。软件方面主要用Keil MDK开发配合VSCode写代码会更高效。2. 硬件搭建从零开始的连接指南2.1 核心器件选型建议STM32我推荐用蓝色pill板STM32F103C8T6价格便宜资料多。ESP32建议用ESP32-C3模组比传统的ESP8266性能更强还支持蓝牙。屏幕一定要确认是ST7735驱动芯片的市面上有些兼容屏驱动方式不一样。我第一次就买错了结果调了一整天都没点亮。连接前务必准备好以下硬件STM32核心板 x1ESP32-C3模组 x1ST7735屏幕 x1USB转TTL模块 x1J-Link OB下载器 x1杜邦线若干建议备齐公对公、公对母、母对母三种2.2 电路连接详解接线是第一个容易踩坑的地方。ESP32和STM32之间需要用串口通信我建议用USART2PA2、PA3因为USART1通常要留给下载程序用。具体连接方式STM32 ESP32-C3 ST7735 PA2 RX - PA3 TX - 3.3V 3.3V VCC GND GND GND PA4 - RES PA5 - DC PA6 - SDA PA7 - SCL PB0 - CS特别注意ESP32的RX接STM32的TXTX接RX别反了。屏幕的背光可以单独接个PWM控制这样能实现亮度调节。我第一次做的时候把所有线都挤在一起结果干扰严重导致屏幕闪烁后来重新整理走线就好了。3. 软件开发环境配置3.1 工具链安装建议先用VSCode写代码再用Keil编译。VSCode装个C/C插件和EditorConfig插件后者可以自动规范代码格式。Keil需要安装STM32F1的Device Family Pack这个在Keil官网就能下载。配置VSCode的.editorconfig文件[*.{c,h}] charset utf-8 indent_style space indent_size 4 trim_trailing_whitespace true insert_final_newline true3.2 工程模板搭建在Keil里新建工程时记得勾选CMSIS核心和Device Startup文件。外设库建议用HAL库比标准库更简单。需要初始化的外设有USART2连接ESP32SPI1连接屏幕GPIO屏幕控制线定时器可选用于屏幕刷新重点检查时钟树配置STM32F103默认是72MHz主频但有些开发板外部晶振是8MHz需要手动修改PLL倍频参数。我之前就因为时钟没配对导致SPI通信速率不对屏幕显示全是乱码。4. ESP32网络通信实战4.1 AT指令基础ESP32-C3默认固件就支持AT指令先用USB转TTL模块测试基本功能AT ATCWMODE1 // 设置STA模式 ATCWJAPWiFi名称,密码 // 连接WiFi ATCIPSNTPCFG1,8,ntp1.aliyun.com // 配置NTP服务器调试时建议用串口助手单独测试每条指令确认ESP32能正常联网后再集成到STM32工程里。常见问题有指令格式错误比如多了空格、响应超时等。我遇到最坑的是某些路由器频道不兼容换了个2.4G频段就好了。4.2 天气API对接推荐使用心知天气的免费API注册后获取私钥。请求URL格式https://api.seniverse.com/v3/weather/now.json?key你的私钥location城市名languagezh-Hansunitc在STM32中通过AT指令发送HTTP请求ATCIPSTARTTCP,api.seniverse.com,80 ATCIPSEND100 GET /v3/weather/now.json?keyxxxlocationbeijing HTTP/1.1 Host: api.seniverse.com收到返回的JSON数据后需要用字符串处理函数解析出温度、天气状况等信息。建议先固定测试一个城市调试好解析逻辑后再扩展。5. ST7735屏幕驱动技巧5.1 底层驱动实现ST7735是SPI接口的但STM32的硬件SPI可能和屏幕时序不匹配建议先用软件模拟SPI调试。关键操作序列拉低CS片选发送命令字节DC线拉低发送数据字节DC线拉高拉高CS片选初始化代码要严格按照datasheet的时序来特别是复位和睡眠唤醒的延时。我参考了GD32驱动ST7735的代码发现复位后至少要延时120ms才能发送初始化命令。5.2 显示优化技巧天气图标可以用LVGL官网的工具转换选择RGB565格式。文字显示建议用点阵字库网上有现成的12x12、16x16字库。如果要显示中文需要处理GBK编码转换。一个实用的刷新策略分区域更新。比如时间区域每秒刷新一次天气区域每10分钟更新一次这样可以减少闪屏。实测发现全屏刷新时会有明显闪烁后来改成局部刷新就流畅多了。6. 系统整合与优化6.1 主程序架构推荐用状态机模型管理各个功能模块typedef enum { SYS_INIT, NET_CONNECT, TIME_SYNC, WEATHER_UPDATE, DISPLAY_REFRESH } SystemState; void main() { SystemState state SYS_INIT; while(1) { switch(state) { case SYS_INIT: // 硬件初始化 break; // 其他状态处理... } } }6.2 常见问题排查屏幕白屏检查复位信号和背光电压天气数据获取失败确认ESP32联网状态和API密钥时间不准调整NTP服务器地址和时区参数显示乱码检查SPI时钟极性和相位设置调试时建议把关键变量通过串口打印出来比如网络返回的原始数据、解析后的天气信息等。我后来加了个错误代码显示功能遇到问题直接在屏幕上显示错误类型省去了连串口的麻烦。7. 进阶改造思路基础功能实现后可以尝试这些扩展增加温湿度传感器如DHT11添加触摸按键切换显示内容用PWM调节屏幕亮度晚上自动变暗支持多城市天气切换添加日程提醒功能我在第二个版本里加了MPU6050陀螺仪摇一摇就能切换显示模式效果很酷。存储方面可以加个W25Q Flash芯片用来缓存天气图标和字库。
