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

手把手教你用STM32F103和ESP8266做一个桌面天气时钟（附完整代码和接线图）

news 2026/6/6 2:03:01

从零打造智能桌面天气时钟：STM32F103与ESP8266的完美组合

在创客圈里，能够实时显示天气和时间的桌面摆件一直是热门项目。它不仅实用，还能展现你的技术实力。今天，我将带你用STM32F103C8T6和ESP8266-01S模块，打造一个功能完善、界面精美的智能天气时钟。

1. 硬件选型与准备

选择适合的硬件是项目成功的第一步。我们需要平衡性能、成本和易用性。

核心组件清单：

STM32F103C8T6最小系统板（蓝色药丸）
ESP8266-01S WiFi模块
0.96寸OLED显示屏（I2C接口）
USB转TTL模块（用于调试）
ST-Link V2下载器

提示：ESP8266-01S比普通ESP8266-01更稳定，建议优先选用

硬件连接时，特别注意供电问题。ESP8266在发送数据时瞬时电流可能达到200mA，而STM32的3.3V稳压芯片通常只能提供150mA左右。我推荐两种解决方案：

使用外部3.3V稳压模块单独给ESP8266供电
在STM32的3.3V输出端并联470μF电容

2. 开发环境搭建

工欲善其事，必先利其器。我们需要配置好开发环境才能高效编码。

2.1 软件工具准备

Keil MDK-ARM（建议V5.25以上）
STM32CubeMX（用于外设初始化）
VSCode（辅助代码编辑）
串口调试助手（推荐XCOM或Putty）

2.2 工程配置要点

在CubeMX中配置时，特别注意以下几点：

时钟树配置：
- HSE选择8MHz
- 系统时钟设为72MHz
- APB1总线时钟设为36MHz
串口配置：
- USART1用于调试输出（PA9-TX, PA10-RX）
- USART3用于ESP8266通信（PB10-TX, PB11-RX）
I2C配置：
- I2C2用于OLED（PB10-SCL, PB11-SDA）
- 时钟速度设为400kHz

// 示例：I2C初始化代码片段 void MX_I2C2_Init(void) { hi2c2.Instance = I2C2; hi2c2.Init.ClockSpeed = 400000; hi2c2.Init.DutyCycle = I2C_DUTYCYCLE_2; hi2c2.Init.OwnAddress1 = 0; hi2c2.Init.AddressingMode = I2C_ADDRESSINGMODE_7BIT; hi2c2.Init.DualAddressMode = I2C_DUALADDRESS_DISABLE; hi2c2.Init.OwnAddress2 = 0; hi2c2.Init.GeneralCallMode = I2C_GENERALCALL_DISABLE; hi2c2.Init.NoStretchMode = I2C_NOSTRETCH_DISABLE; if (HAL_I2C_Init(&hi2c2) != HAL_OK) { Error_Handler(); } }

3. ESP8266通信实现

ESP8266是这个项目的网络门户，稳定可靠的WiFi连接是获取天气数据的关键。

3.1 AT指令交互设计

与ESP8266通信主要使用AT指令。为提高可靠性，我建议实现以下功能函数：

发送指令并等待响应
带超时的响应等待
自动重试机制

#define ESP8266_MAX_RETRY 3 #define ESP8266_TIMEOUT_MS 2000 uint8_t esp8266_send_command(const char* cmd, const char* expect, uint32_t timeout) { uint8_t retry = 0; uint32_t start_time = HAL_GetTick(); while(retry < ESP8266_MAX_RETRY) { HAL_UART_Transmit(&huart3, (uint8_t*)cmd, strlen(cmd), HAL_MAX_DELAY); HAL_UART_Transmit(&huart3, (uint8_t*)"\r\n", 2, HAL_MAX_DELAY); // 清空接收缓冲区 esp8266_rx_index = 0; memset(esp8266_rx_buffer, 0, sizeof(esp8266_rx_buffer)); // 等待响应 while((HAL_GetTick() - start_time) < timeout) { if(esp8266_rx_index > 0 && strstr(esp8266_rx_buffer, expect)) { return 1; // 成功 } HAL_Delay(10); } retry++; HAL_Delay(100); } return 0; // 失败 }

3.2 网络请求优化

获取天气数据时，建议采用以下策略：

使用稳定的天气API（如心知天气、和风天气）
实现HTTP长连接减少握手开销
添加数据缓存机制，避免频繁请求

API请求对比表：

服务提供商	免费额度	更新频率	数据格式	稳定性
心知天气	500次/天	实时	JSON	★★★★☆
和风天气	1000次/天	每小时	JSON	★★★★★
OpenWeather	60次/分钟	实时	JSON	★★★☆☆

4. OLED显示设计

0.96寸OLED虽然小巧，但通过精心设计可以呈现丰富信息。

4.1 显示布局规划

我推荐的分区布局方案：

顶部区域：实时时间（大字体）
中部左侧：天气图标
中部右侧：温度/湿度
底部区域：日期和空气质量

void update_display(void) { OLED_Clear(); // 显示时间 (24小时制) OLED_ShowString(0, 0, "Time:", 16); OLED_ShowNum(40, 0, time.hour, 2, 16); OLED_ShowString(64, 0, ":", 16); OLED_ShowNum(72, 0, time.minute, 2, 16); OLED_ShowString(96, 0, ":", 16); OLED_ShowNum(104, 0, time.second, 2, 16); // 显示日期 char date_str[20]; sprintf(date_str, "%04d-%02d-%02d", time.year, time.month, time.day); OLED_ShowString(0, 16, date_str, 16); // 显示天气信息 OLED_ShowString(0, 32, "Temp:", 16); OLED_ShowNum(40, 32, weather.temperature, 2, 16); OLED_ShowString(64, 32, "C", 16); // 显示天气图标 draw_weather_icon(80, 32, weather.condition); // 显示空气质量 OLED_ShowString(0, 48, "AQI:", 16); OLED_ShowNum(32, 48, weather.aqi, 3, 16); }

4.2 显示刷新优化

OLED频繁刷新会导致闪烁，建议采用以下策略：

分区域刷新：只更新变化的部分
双缓冲机制：先在内存中绘制完整帧再显示
定时刷新：时间每秒刷新，天气每10分钟刷新

5. 系统整合与调试

将所有模块整合后，系统架构如下：

主循环处理用户输入和定时任务
WiFi任务在后台获取数据
显示任务负责界面更新
RTC提供本地计时

常见问题及解决方案：

问题现象	可能原因	解决方法
ESP8266不响应	供电不足	增加电容或独立供电
时间获取失败	服务器不稳定	更换时间API或添加重试
OLED显示异常	I2C干扰	缩短连线，加10k上拉电阻
系统死机	堆栈溢出	增大任务堆栈大小