天气应用

这是一个基于Electron开发的天气预报应用，提供实时天气信息、逐小时和7天天气预报功能。

功能特性

• 城市搜索和位置查询
• 实时天气信息展示（温度、天气状况、湿度、风速、气压、能见度）
• 24小时逐时预报
• 7天天气预报
• 温度单位切换（摄氏度/华氏度）
• 主题切换（明亮/暗黑/跟随系统）
• 自动刷新设置
• 网络状态监测
• 默认位置设置

使用方法

1. 安装依赖：

   npm install
   

2. 启动应用：

   npm start
   

快捷键

• Ctrl+F - 聚焦搜索框
• Ctrl+, - 打开设置面板

项目结构

• main.js - 主进程代码，负责窗口创建和菜单管理
• preload.js - 预加载脚本，提供IPC通信桥接
• renderer.js - 渲染进程代码，处理天气数据获取和UI更新
• index.html - 应用界面
• style.css - 应用样式

开发说明

• 本项目使用Electron 25.0.0和axios 1.6.0
• 由于是演示项目，天气数据使用模拟数据
• 支持Windows、macOS和Linux平台，鸿蒙PC平台

鸿蒙PC适配改造指南

1. 环境准备

• 系统要求：Windows 10/11、8GB RAM以上、20GB可用空间

• 工具安装：
  DevEco Studio 5.0+（安装鸿蒙SDK API 20+）

• Node.js 18.x+

2. 获取Electron鸿蒙编译产物

1. 登录Electron 鸿蒙官方仓库

2. 下载Electron 34+版本的Release包（.zip格式）

3. 解压到项目目录，确认electron/libs/arm64-v8a/下包含核心.so库

3. 部署应用代码

将Electron应用代码按以下目录结构放置：

web_engine/src/main/resources/resfile/resources/app/
├── main.js
├── package.json
└── src/
    ├── index.html
    ├── preload.js
    ├── renderer.js
    └── style.css

4. 配置与运行

1. 打开项目：在DevEco Studio中打开ohos_hap目录

2. 配置签名：
   进入File → Project Structure → Signing Configs

3. 自动生成调试签名或导入已有签名

4. 连接设备：
   启用鸿蒙设备开发者模式和USB调试

5. 通过USB Type-C连接电脑

6. 编译运行：点击Run按钮或按Shift+F10

5. 验证检查项

• ✅ 应用窗口正常显示

• ✅ 窗口大小可调整，响应式布局生效

• ✅ 控制台无"SysCap不匹配"或"找不到.so文件"错误

• ✅ 动画效果正常播放

跨平台兼容性

鸿蒙开发调试技巧

1. 日志查看

在DevEco Studio的Log面板中过滤"Electron"关键词，查看应用运行日志和错误信息。

2. 常见问题解决

• "SysCap不匹配"错误：检查module.json5中的reqSysCapabilities，只保留必要系统能力

• "找不到.so文件"错误：确认arm64-v8a目录下四个核心库文件完整

• 窗口不显示：在main.js中添加app.disableHardwareAcceleration()

• 动画卡顿：简化CSS动画效果，减少重绘频率