5.3 KiB
5.3 KiB
天气时钟界面说明
📋 概述
已成功将Arduino版本的MiniTV天气时钟UI移植到ESP-IDF LVGL环境中。新的天气时钟界面完全替换了原来的简单时钟界面,提供更丰富的信息显示。
🎨 界面布局
参考Arduino版本,新界面采用240x240分区布局:
┌─────────────────────────────────┐
│ 天气信息滚动 │ 城市名称 │ 顶部 (0-34px)
├─────────────────────────────────┤
│ │
│ 时:分 秒 │ 中部 (35-165px)
│ (大字体) (小字体) │
│ │
├─────┬─────────────┬─────────────┤
│ AQI │ 湿度图标 │ 温度图标 │ 底部上 (166-200px)
│空气 │ 💧XX% │ 🌡️XX℃ │
├─────┼─────────────┼─────────────┤
│周X │ XX月XX日 │ (空白) │ 底部下 (200-240px)
└─────┴─────────────┴─────────────┘
✨ 新增功能
1. 天气数据显示
- ✅ 城市名称
- ✅ 实时温度
- ✅ 湿度百分比
- ✅ 空气质量指数(AQI)和等级
- ✅ 最高/最低温度
- ✅ 风向和风速
2. 动态信息滚动
顶部滚动区域每2.5秒切换显示:
- 实时天气状况
- 空气质量描述
- 风向风速信息
- 今日天气概况
- 最低/最高温度
3. AQI颜色编码
空气质量指数自动显示对应颜色:
- 🟢 优 (0-50): 绿色
- 🟡 良 (51-100): 黄色
- 🟠 轻度污染 (101-150): 橙色
- 🟣 中度污染 (151-200): 紫红色
- 🔴 重度污染 (200+): 深红色
4. 自动更新
- ⏰ 时间:每秒更新
- 🌤️ 天气:每10分钟更新一次
📁 新增文件
- idle_screen.h - 天气时钟UI头文件(重写)
- idle_screen.cc - 天气时钟UI实现(重写)
- weather_service.h - 天气API服务头文件
- weather_service.cc - 天气API服务实现
🔧 修改文件
- genjutech-s3-1.54tft.cc
- 添加
SpiLcdDisplayEx类扩展 - 集成天气服务
- 添加
InitWeatherService()方法 - 自动启动天气更新任务
- 添加
🌐 天气API
使用中国天气网API:
- 城市代码自动检测:
http://wgeo.weather.com.cn/ip/ - 天气数据获取:
http://d1.weather.com.cn/weather_index/{城市代码}.html
🎯 城市代码配置(两种方式)
方式1:自动检测(推荐)✨
默认已启用,WiFi连接后会根据IP地址自动获取所在城市!
在 genjutech-s3-1.54tft.cc 的 InitWeatherService() 中:
self->weather_service_.Initialize(""); // 空字符串 = 自动检测
优点:
- ✅ 无需手动配置
- ✅ 根据实际位置显示天气
- ✅ 设备移动到其他城市会自动适应
- ✅ 失败时自动回退到北京
方式2:手动指定城市代码
如果你想固定显示某个城市的天气,可以指定城市代码:
self->weather_service_.Initialize("101280601"); // 指定:深圳
常用城市代码:
- 北京:
101010100 - 上海:
101020100 - 广州:
101280101 - 深圳:
101280601 - 成都:
101270101 - 杭州:
101210101 - 武汉:
101200101 - 西安:
101110101 - 青岛:
101120201 - 南京:
101190101 - 重庆:
101040100 - 天津:
101030100
优点:
- ✅ 可查看其他城市天气
- ✅ 不受网络IP地址影响
🎯 使用说明
1. 编译
idf.py build
2. 烧录
idf.py flash monitor
3. 配置城市
修改 genjutech-s3-1.54tft.cc 中的城市代码后重新编译烧录。
🔄 与原有功能的集成
- ✅ 保留语音交互功能
- ✅ 保留闹钟功能
- ✅ 闹钟触发时在时钟界面上显示
- ✅ 设备空闲时自动显示天气时钟
- ✅ 语音交互时自动切换到聊天界面
🐛 故障排查
天气数据不显示
- 检查WiFi连接状态
- 检查城市代码是否正确
- 查看串口日志中的天气API响应
界面显示异常
- 确认LVGL初始化正常
- 检查显示锁是否正确使用
- 查看内存使用情况
📝 注意事项
- 天气更新需要WiFi连接
- 首次获取天气数据需等待5秒(WiFi连接时间)
- 天气API可能受网络状况影响
- 建议在WiFi稳定环境下使用
🎨 设计理念
- 简洁实用:一屏显示所有关键信息
- 视觉清晰:分区明确,信息层次分明
- 动态更新:滚动显示更多天气详情
- 色彩编码:AQI用颜色直观表示空气质量
🚀 未来扩展
可能的扩展方向:
- 支持多城市切换
- 添加未来天气预报
- 自定义UI主题和颜色
- 添加天气图标/动画
- 支持更多天气数据源
移植时间: 2025-01-10
原始参考: Arduino MiniTV Weather Clock by DIY攻城狮
实现版本: ESP-IDF + LVGL