告别枯燥数据用OLED屏打造你的桌面天气站Arduino/STM32通用教程你是否厌倦了手机上千篇一律的天气应用想不想在桌面上放一个既实用又酷炫的个性化天气显示器今天我们就用一块小小的OLED屏幕结合常见的开发板打造一个能显示温湿度、天气信息甚至自定义动画的桌面天气站。这个项目不仅能让你的工作台瞬间科技感爆棚还能让你深入掌握OLED显示技术和传感器数据整合的实用技巧。1. 硬件选型与准备1.1 OLED屏幕选择与连接市面上常见的OLED屏幕主要有两种接口方式SPI和I2C。对于我们的天气站项目推荐使用128x64像素的I2C接口OLED原因有三接线简单I2C只需4根线VCC、GND、SCL、SDA节省IO口特别适合引脚资源有限的开发板通用性强Arduino和STM32都能轻松驱动以下是常见OLED模块的引脚定义引脚名称功能说明连接目标VCC电源正极3.3V或5V视模块而定GND电源负极GNDSCL时钟线开发板I2C时钟引脚SDA数据线开发板I2C数据引脚提示部分OLED模块需要上拉电阻如果发现通信不稳定可以在SCL和SDA线上各加一个4.7kΩ上拉电阻到VCC。1.2 开发板选择与环境搭建这个项目支持两种主流开发平台Arduino方案推荐使用Arduino Uno或Nano需要安装以下库Adafruit_GFX图形库Adafruit_SSD1306OLED驱动库WireI2C通信库STM32方案推荐使用STM32F103C8T6蓝莓板开发环境可以使用PlatformIO或Keil需要配置HAL库的I2C功能// Arduino平台I2C初始化示例 #include Wire.h void setup() { Wire.begin(); // 初始化I2C // 其他初始化代码... }2. 传感器数据采集与处理2.1 温湿度传感器集成DHT11是最容易上手的温湿度传感器之一虽然精度一般湿度±5%温度±2℃但对于桌面天气站已经足够。接线非常简单VCC → 5VGND → GNDDATA → 任意数字引脚// DHT11读取示例Arduino #include DHT.h #define DHTPIN 2 #define DHTTYPE DHT11 DHT dht(DHTPIN, DHTTYPE); void setup() { Serial.begin(9600); dht.begin(); } void loop() { float h dht.readHumidity(); float t dht.readTemperature(); if (isnan(h) || isnan(t)) { Serial.println(读取DHT11失败!); return; } Serial.print(湿度: ); Serial.print(h); Serial.print(%); Serial.print( 温度: ); Serial.print(t); Serial.println(°C); delay(2000); }注意DHT11读取间隔建议不小于2秒否则可能读取失败。如需更高精度可以考虑BME280或SHT31等传感器。2.2 气压传感器扩展可选如果你想增加气压和海拔数据BMP280是个不错的选择。它同样使用I2C接口可以与OLED共用总线// BMP280初始化代码示例 #include Adafruit_BMP280.h Adafruit_BMP280 bmp; // I2C接口 void setup() { if (!bmp.begin(0x76)) { // 地址可能是0x76或0x77 Serial.println(找不到BMP280传感器!); while (1); } } void loop() { Serial.print(温度 ); Serial.print(bmp.readTemperature()); Serial.println( *C); Serial.print(气压 ); Serial.print(bmp.readPressure() / 100.0F); Serial.println( hPa); Serial.print(海拔 ); Serial.print(bmp.readAltitude(1013.25)); Serial.println( 米); delay(2000); }3. OLED界面设计与优化3.1 信息布局策略在128x64的小屏幕上显示多种信息需要精心设计布局。以下是经过验证的有效方案主界面分区顶部20像素日期时间大字体中间30像素温度/湿度图标数值底部14像素状态栏WiFi信号、电池电量等天气图标设计技巧使用8x8或16x16像素的简洁图标晴天简单太阳图形雨天水滴图案多云云朵轮廓// 天气图标定义示例 const unsigned char sunny_icon[] PROGMEM { 0x00, 0x42, 0x24, 0x18, 0x18, 0x24, 0x42, 0x00 }; void drawWeatherIcon(int x, int y, const unsigned char* icon) { display.drawBitmap(x, y, icon, 8, 8, WHITE); }3.2 动态效果实现简单的动画能让你的天气站更加生动温度计动态效果绘制温度计轮廓静态根据当前温度计算液柱高度使用fillRect动态更新液柱// 温度计动画示例 void drawThermometer(int temp) { // 绘制轮廓 display.drawRect(10, 10, 8, 40, WHITE); display.fillCircle(14, 52, 4, WHITE); // 计算液柱高度假设范围0-40°C int height map(temp, 0, 40, 0, 36); display.fillRect(12, 48 - height, 4, height, WHITE); }4. 系统集成与高级功能4.1 网络时间同步使用ESP8266或ESP32模块可以为你的天气站添加网络功能实现自动时间同步// ESP8266获取网络时间示例 #include ESP8266WiFi.h #include NTPClient.h #include WiFiUdp.h WiFiUDP ntpUDP; NTPClient timeClient(ntpUDP, pool.ntp.org, 28800, 60000); void setup() { WiFi.begin(SSID, password); while (WiFi.status() ! WL_CONNECTED) { delay(500); } timeClient.begin(); } void loop() { timeClient.update(); String formattedTime timeClient.getFormattedTime(); // 显示时间... }4.2 天气API接入通过免费的天气API如OpenWeatherMap可以获取实时天气数据// 获取天气数据示例需要WiFiClient库 String getWeatherData() { WiFiClient client; if (!client.connect(api.openweathermap.org, 80)) { return 连接失败; } client.print(String(GET /data/2.5/weather?qBeijingappidYOUR_API_KEY HTTP/1.1\r\n) Host: api.openweathermap.org\r\n Connection: close\r\n\r\n); while(client.connected() !client.available()) delay(1); String result; while(client.available()) { result client.readStringUntil(\r); } return result; }4.3 低功耗优化如果你打算用电池供电这些技巧可以延长续航设置OLED对比度为最低可用值降低传感器读取频率如每5分钟一次在不操作时让MCU进入睡眠模式使用深色界面OLED显示黑色不耗电// Arduino低功耗示例 #include avr/sleep.h void enterSleep() { set_sleep_mode(SLEEP_MODE_PWR_DOWN); sleep_enable(); sleep_mode(); // 唤醒后会从这里继续执行 sleep_disable(); }5. 项目扩展与创意玩法5.1 3D打印外壳设计给你的天气站一个漂亮的家使用Tinkercad或Fusion 360设计简单外壳留出传感器通风孔考虑倾斜角度便于查看屏幕添加挂墙孔或支架接口5.2 多屏信息切换通过按钮或手势控制切换不同信息页面主页面天气温湿度第二页气压趋势图第三页系统信息IP地址、运行时间等// 多页面切换示例 int currentPage 0; const int MAX_PAGES 3; void checkButton() { if (digitalRead(BUTTON_PIN) LOW) { currentPage (currentPage 1) % MAX_PAGES; delay(200); // 防抖 } } void drawPage() { switch(currentPage) { case 0: drawMainPage(); break; case 1: drawPressurePage(); break; case 2: drawSystemPage(); break; } }5.3 数据记录与可视化添加SD卡模块记录史数据每分钟记录一次温湿度每天生成一个CSV文件通过Python脚本分析数据趋势在OLED上显示24小时温度曲线// SD卡数据记录示例 #include SD.h void logData(float temp, float humidity) { File dataFile SD.open(datalog.csv, FILE_WRITE); if (dataFile) { dataFile.print(millis()); dataFile.print(,); dataFile.print(temp); dataFile.print(,); dataFile.println(humidity); dataFile.close(); } }在实际项目中我发现最耗时的部分不是代码编写而是界面设计的反复调整。有时候为了多显示一个数据点需要尝试五六种布局方案。建议先用纸笔画出草图再逐步实现这样效率会高很多。另外使用透明的亚克力板做外壳时记得在内部贴一层磨砂膜这样OLED的显示效果会更加柔和均匀。
告别枯燥数据！用OLED屏打造你的桌面天气站（Arduino/STM32通用教程）
发布时间：2026/6/6 16:34:37
告别枯燥数据用OLED屏打造你的桌面天气站Arduino/STM32通用教程你是否厌倦了手机上千篇一律的天气应用想不想在桌面上放一个既实用又酷炫的个性化天气显示器今天我们就用一块小小的OLED屏幕结合常见的开发板打造一个能显示温湿度、天气信息甚至自定义动画的桌面天气站。这个项目不仅能让你的工作台瞬间科技感爆棚还能让你深入掌握OLED显示技术和传感器数据整合的实用技巧。1. 硬件选型与准备1.1 OLED屏幕选择与连接市面上常见的OLED屏幕主要有两种接口方式SPI和I2C。对于我们的天气站项目推荐使用128x64像素的I2C接口OLED原因有三接线简单I2C只需4根线VCC、GND、SCL、SDA节省IO口特别适合引脚资源有限的开发板通用性强Arduino和STM32都能轻松驱动以下是常见OLED模块的引脚定义引脚名称功能说明连接目标VCC电源正极3.3V或5V视模块而定GND电源负极GNDSCL时钟线开发板I2C时钟引脚SDA数据线开发板I2C数据引脚提示部分OLED模块需要上拉电阻如果发现通信不稳定可以在SCL和SDA线上各加一个4.7kΩ上拉电阻到VCC。1.2 开发板选择与环境搭建这个项目支持两种主流开发平台Arduino方案推荐使用Arduino Uno或Nano需要安装以下库Adafruit_GFX图形库Adafruit_SSD1306OLED驱动库WireI2C通信库STM32方案推荐使用STM32F103C8T6蓝莓板开发环境可以使用PlatformIO或Keil需要配置HAL库的I2C功能// Arduino平台I2C初始化示例 #include Wire.h void setup() { Wire.begin(); // 初始化I2C // 其他初始化代码... }2. 传感器数据采集与处理2.1 温湿度传感器集成DHT11是最容易上手的温湿度传感器之一虽然精度一般湿度±5%温度±2℃但对于桌面天气站已经足够。接线非常简单VCC → 5VGND → GNDDATA → 任意数字引脚// DHT11读取示例Arduino #include DHT.h #define DHTPIN 2 #define DHTTYPE DHT11 DHT dht(DHTPIN, DHTTYPE); void setup() { Serial.begin(9600); dht.begin(); } void loop() { float h dht.readHumidity(); float t dht.readTemperature(); if (isnan(h) || isnan(t)) { Serial.println(读取DHT11失败!); return; } Serial.print(湿度: ); Serial.print(h); Serial.print(%); Serial.print( 温度: ); Serial.print(t); Serial.println(°C); delay(2000); }注意DHT11读取间隔建议不小于2秒否则可能读取失败。如需更高精度可以考虑BME280或SHT31等传感器。2.2 气压传感器扩展可选如果你想增加气压和海拔数据BMP280是个不错的选择。它同样使用I2C接口可以与OLED共用总线// BMP280初始化代码示例 #include Adafruit_BMP280.h Adafruit_BMP280 bmp; // I2C接口 void setup() { if (!bmp.begin(0x76)) { // 地址可能是0x76或0x77 Serial.println(找不到BMP280传感器!); while (1); } } void loop() { Serial.print(温度 ); Serial.print(bmp.readTemperature()); Serial.println( *C); Serial.print(气压 ); Serial.print(bmp.readPressure() / 100.0F); Serial.println( hPa); Serial.print(海拔 ); Serial.print(bmp.readAltitude(1013.25)); Serial.println( 米); delay(2000); }3. OLED界面设计与优化3.1 信息布局策略在128x64的小屏幕上显示多种信息需要精心设计布局。以下是经过验证的有效方案主界面分区顶部20像素日期时间大字体中间30像素温度/湿度图标数值底部14像素状态栏WiFi信号、电池电量等天气图标设计技巧使用8x8或16x16像素的简洁图标晴天简单太阳图形雨天水滴图案多云云朵轮廓// 天气图标定义示例 const unsigned char sunny_icon[] PROGMEM { 0x00, 0x42, 0x24, 0x18, 0x18, 0x24, 0x42, 0x00 }; void drawWeatherIcon(int x, int y, const unsigned char* icon) { display.drawBitmap(x, y, icon, 8, 8, WHITE); }3.2 动态效果实现简单的动画能让你的天气站更加生动温度计动态效果绘制温度计轮廓静态根据当前温度计算液柱高度使用fillRect动态更新液柱// 温度计动画示例 void drawThermometer(int temp) { // 绘制轮廓 display.drawRect(10, 10, 8, 40, WHITE); display.fillCircle(14, 52, 4, WHITE); // 计算液柱高度假设范围0-40°C int height map(temp, 0, 40, 0, 36); display.fillRect(12, 48 - height, 4, height, WHITE); }4. 系统集成与高级功能4.1 网络时间同步使用ESP8266或ESP32模块可以为你的天气站添加网络功能实现自动时间同步// ESP8266获取网络时间示例 #include ESP8266WiFi.h #include NTPClient.h #include WiFiUdp.h WiFiUDP ntpUDP; NTPClient timeClient(ntpUDP, pool.ntp.org, 28800, 60000); void setup() { WiFi.begin(SSID, password); while (WiFi.status() ! WL_CONNECTED) { delay(500); } timeClient.begin(); } void loop() { timeClient.update(); String formattedTime timeClient.getFormattedTime(); // 显示时间... }4.2 天气API接入通过免费的天气API如OpenWeatherMap可以获取实时天气数据// 获取天气数据示例需要WiFiClient库 String getWeatherData() { WiFiClient client; if (!client.connect(api.openweathermap.org, 80)) { return 连接失败; } client.print(String(GET /data/2.5/weather?qBeijingappidYOUR_API_KEY HTTP/1.1\r\n) Host: api.openweathermap.org\r\n Connection: close\r\n\r\n); while(client.connected() !client.available()) delay(1); String result; while(client.available()) { result client.readStringUntil(\r); } return result; }4.3 低功耗优化如果你打算用电池供电这些技巧可以延长续航设置OLED对比度为最低可用值降低传感器读取频率如每5分钟一次在不操作时让MCU进入睡眠模式使用深色界面OLED显示黑色不耗电// Arduino低功耗示例 #include avr/sleep.h void enterSleep() { set_sleep_mode(SLEEP_MODE_PWR_DOWN); sleep_enable(); sleep_mode(); // 唤醒后会从这里继续执行 sleep_disable(); }5. 项目扩展与创意玩法5.1 3D打印外壳设计给你的天气站一个漂亮的家使用Tinkercad或Fusion 360设计简单外壳留出传感器通风孔考虑倾斜角度便于查看屏幕添加挂墙孔或支架接口5.2 多屏信息切换通过按钮或手势控制切换不同信息页面主页面天气温湿度第二页气压趋势图第三页系统信息IP地址、运行时间等// 多页面切换示例 int currentPage 0; const int MAX_PAGES 3; void checkButton() { if (digitalRead(BUTTON_PIN) LOW) { currentPage (currentPage 1) % MAX_PAGES; delay(200); // 防抖 } } void drawPage() { switch(currentPage) { case 0: drawMainPage(); break; case 1: drawPressurePage(); break; case 2: drawSystemPage(); break; } }5.3 数据记录与可视化添加SD卡模块记录史数据每分钟记录一次温湿度每天生成一个CSV文件通过Python脚本分析数据趋势在OLED上显示24小时温度曲线// SD卡数据记录示例 #include SD.h void logData(float temp, float humidity) { File dataFile SD.open(datalog.csv, FILE_WRITE); if (dataFile) { dataFile.print(millis()); dataFile.print(,); dataFile.print(temp); dataFile.print(,); dataFile.println(humidity); dataFile.close(); } }在实际项目中我发现最耗时的部分不是代码编写而是界面设计的反复调整。有时候为了多显示一个数据点需要尝试五六种布局方案。建议先用纸笔画出草图再逐步实现这样效率会高很多。另外使用透明的亚克力板做外壳时记得在内部贴一层磨砂膜这样OLED的显示效果会更加柔和均匀。
