Flutter 框架跨平台鸿蒙开发 - 家庭消防逃生演练
运行效果图家庭消防逃生演练是一款安全健康类应用，帮助家庭成员学习消防安全知识、掌握逃生技能、熟悉家庭逃生路线。支持AR模拟火灾场景、灭火器使用教学、逃生路线规划、定期演练提醒等功能，让安全意识深入人心。应用以警示的红色为主色调，象征消防安全的重要性。涵盖知识学习、逃生演练、灭火训练、演练记录四大模块，全面提升家庭消防安全能力。序号类型名称Emoji描述1电器火灾⚡电器短路、过载引起2厨房火灾🔥油
·
家庭消防逃生演练应用
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图
1.1 应用简介
家庭消防逃生演练是一款安全健康类应用，帮助家庭成员学习消防安全知识、掌握逃生技能、熟悉家庭逃生路线。支持AR模拟火灾场景、灭火器使用教学、逃生路线规划、定期演练提醒等功能，让安全意识深入人心。应用以警示的红色为主色调，象征消防安全的重要性。涵盖知识学习、逃生演练、灭火训练、演练记录四大模块，全面提升家庭消防安全能力。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 消防知识 | 安全知识学习与测试 | 卡片展示 |
| 逃生演练 | 模拟火灾逃生路线 | 场景模拟 |
| 灭火训练 | 灭火器使用教学 | 步骤引导 |
| 演练记录 | 演练历史与统计 | 列表管理 |
| 安全检查 | 家庭消防隐患排查 | 检查清单 |
| 紧急求助 | 一键报警与紧急联系 | 快捷操作 |
1.3 火灾类型定义
| 序号 | 类型名称 | Emoji | 描述 |
|---|---|---|---|
| 1 | 电器火灾 | ⚡ | 电器短路、过载引起 |
| 2 | 厨房火灾 | 🔥 | 油锅起火、燃气泄漏 |
| 3 | 卧室火灾 | 🛏️ | 被褥、家具燃烧 |
| 4 | 客厅火灾 | 🛋️ | 家具、装饰品起火 |
| 5 | 阳台火灾 | 🌅 | 杂物堆放引发 |
| 6 | 楼道火灾 | 🚪 | 通道堵塞、杂物燃烧 |
1.4 灭火器类型定义
| 序号 | 类型名称 | Emoji | 适用场景 | 描述 |
|---|---|---|---|---|
| 1 | 干粉灭火器 | 🧯 | 通用型 | 适用于多种火灾 |
| 2 | 二氧化碳 | ❄️ | 电器火灾 | 不留痕迹 |
| 3 | 泡沫灭火器 | 🫧 | 油类火灾 | 覆盖灭火 |
| 4 | 水基灭火器 | 💧 | 固体火灾 | 降温灭火 |
1.5 演练难度定义
| 序号 | 难度名称 | Emoji | 时间限制 | 描述 |
|---|---|---|---|---|
| 1 | 入门 | 🌱 | 无限制 | 学习基本知识 |
| 2 | 简单 | ⭐ | 5分钟 | 单一场景 |
| 3 | 中等 | ⭐⭐ | 3分钟 | 多场景组合 |
| 4 | 困难 | ⭐⭐⭐ | 2分钟 | 复杂场景 |
| 5 | 极限 | ⭐⭐⭐⭐ | 90秒 | 真实模拟 |
1.6 演练状态定义
| 序号 | 状态名称 | Emoji | 描述 |
|---|---|---|---|
| 1 | 未开始 | ⏳ | 等待开始 |
| 2 | 进行中 | 🔥 | 正在演练 |
| 3 | 已完成 | ✅ | 成功逃生 |
| 4 | 失败 | ❌ | 需要重新学习 |
1.7 安全等级定义
| 序号 | 等级名称 | Emoji | 分数范围 | 描述 |
|---|---|---|---|---|
| 1 | 危险 | 🚨 | 0-40 | 存在严重隐患 |
| 2 | 警告 | ⚠️ | 41-60 | 需要改进 |
| 3 | 良好 | 👍 | 61-80 | 基本达标 |
| 4 | 优秀 | 🌟 | 81-90 | 安全意识强 |
| 5 | 模范 | 🏆 | 91-100 | 消防安全标兵 |
1.8 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 自定义绘制 | CustomPainter | - |
| 动画效果 | AnimationController | - |
| 目标平台 | 鸿蒙OS / Web | API 21+ |
1.9 项目结构
lib/
└── main_fire_escape.dart
├── FireEscapeApp # 应用入口
├── FireType # 火灾类型枚举
├── ExtinguisherType # 灭火器类型枚举
├── DrillDifficulty # 演练难度枚举
├── DrillStatus # 演练状态枚举
├── SafetyLevel # 安全等级枚举
├── DrillRecord # 演练记录模型
├── SafetyCheckItem # 安全检查项模型
├── FireEscapeHomePage # 主页面（底部导航）
├── _buildLearnPage # 学习页面
├── _buildDrillPage # 演练页面
├── _buildExtinguisherPage # 灭火器页面
├── _buildRecordPage # 记录页面
├── FireScenePainter # 火灾场景绘制器
└── EscapeRoutePainter # 逃生路线绘制器
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 页面导航流程
2.4 演练流程
三、核心模块设计
3.1 数据模型设计
3.1.1 火灾类型枚举 (FireType)
enum FireType {
electrical('电器火灾', '⚡', '电器短路、过载引起', Color(0xFFFFD700)),
kitchen('厨房火灾', '🔥', '油锅起火、燃气泄漏', Color(0xFFFF5722)),
bedroom('卧室火灾', '🛏️', '被褥、家具燃烧', Color(0xFF9C27B0)),
livingRoom('客厅火灾', '🛋️', '家具、装饰品起火', Color(0xFF2196F3)),
balcony('阳台火灾', '🌅', '杂物堆放引发', Color(0xFFFF9800)),
corridor('楼道火灾', '🚪', '通道堵塞、杂物燃烧', Color(0xFF795548));
final String label;
final String emoji;
final String description;
final Color color;
}
3.1.2 灭火器类型枚举 (ExtinguisherType)
enum ExtinguisherType {
dryPowder('干粉灭火器', '🧯', '通用型', '适用于多种火灾'),
co2('二氧化碳灭火器', '❄️', '电器火灾', '不留痕迹'),
foam('泡沫灭火器', '🫧', '油类火灾', '覆盖灭火'),
waterBased('水基灭火器', '💧', '固体火灾', '降温灭火');
final String label;
final String emoji;
final String usage;
final String description;
}
3.1.3 演练记录模型 (DrillRecord)
class DrillRecord {
final String id; // 记录ID
final FireType fireType; // 火灾类型
final DrillDifficulty difficulty; // 演练难度
DrillStatus status; // 演练状态
final int duration; // 用时(秒)
final int score; // 得分
final DateTime createdAt; // 创建时间
final List<String> mistakes; // 错误记录
}
3.1.4 安全检查项模型 (SafetyCheckItem)
class SafetyCheckItem {
final String id; // 检查项ID
final String title; // 检查项标题
final String description; // 详细描述
bool isChecked; // 是否已检查
final String category; // 分类
final int importance; // 重要程度(1-5)
}
3.1.5 演练难度分布
3.2 页面结构设计
3.2.1 主页面布局
3.2.2 学习页结构
3.2.3 演练页结构
3.2.4 灭火器页结构
3.3 逃生演练流程
3.4 安全评分算法
四、UI设计规范
4.1 配色方案
应用以警示的红色为主色调，象征消防安全的重要性：
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | #F44336 (Red) | 导航、警示元素 |
| 辅助色 | #EF5350 | 演练页面 |
| 第三色 | #E53935 | 灭火器页面 |
| 强调色 | #D32F2F | 记录页面 |
| 安全色 | #4CAF50 (Green) | 安全标识 |
| 警告色 | #FF9800 (Orange) | 注意事项 |
| 背景色 | #0A0A1A | 页面背景 |
| 卡片背景 | #1A1A2E | 知识卡片 |
4.2 火灾场景配色
| 火灾类型 | 色值 | 视觉效果 |
|---|---|---|
| 电器火灾 | #FFD700 | 警示金色 |
| 厨房火灾 | #FF5722 | 火焰橙色 |
| 卧室火灾 | #9C27B0 | 紫色警示 |
| 客厅火灾 | #2196F3 | 冷静蓝色 |
| 阳台火灾 | #FF9800 | 日落橙色 |
| 楼道火灾 | #795548 | 烟雾棕色 |
4.3 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 页面标题 | 24px | Bold | 主色 |
| 场景名称 | 16px | Bold | #FFFFFF |
| 知识要点 | 14px | Medium | 白色 |
| 警示标签 | 12px | Regular | 白色 |
| 统计数字 | 28px | Bold | 白色 |
4.4 组件规范
4.4.1 安全评分卡片
┌─────────────────────────────────────┐
│ 🏆 家庭安全评分 │
│ │
│ 85 分 │
│ 优秀 🌟 │
│ │
│ 演练: 5次 知识: 90分 检查: 80分 │
└─────────────────────────────────────┘
4.4.2 火灾场景卡片
┌─────────────────────────────────────┐
│ ⚡ 电器火灾 │
│ │
│ 电器短路、过载引起 │
│ │
│ 难度: ⭐⭐ 中等 │
│ 最佳逃生时间: 2分钟 │
│ │
│ [开始演练] │
└─────────────────────────────────────┘
4.4.3 灭火器教学卡片
┌─────────────────────────────────────┐
│ 🧯 干粉灭火器使用步骤 │
│ │
│ 1️⃣ 提 - 提起灭火器 │
│ 2️⃣ 拔 - 拔掉保险销 │
│ 3️⃣ 握 - 握住喷管 │
│ 4️⃣ 压 - 压下把手 │
│ │
│ [观看演示] [开始练习] │
└─────────────────────────────────────┘
4.4.4 演练记录卡片
┌─────────────────────────────────────┐
│ 🔥 厨房火灾演练 │
│ │
│ 难度: ⭐⭐ 中等 │
│ 用时: 1分45秒 │
│ 得分: 92分 │
│ │
│ 状态: ✅ 成功逃生 │
│ 时间: 2024-01-15 14:30 │
└─────────────────────────────────────┘
4.4.5 安全检查清单
┌─────────────────────────────────────┐
│ ✅ 安全检查清单 │
│ │
│ ☑️ 灭火器是否在有效期内 │
│ ☑️ 烟雾报警器是否正常 │
│ ☐ 逃生通道是否畅通 │
│ ☑️ 电器线路是否老化 │
│ ☐ 燃气管道是否泄漏 │
│ │
│ 完成度: 3/5 (60%) │
└─────────────────────────────────────┘
五、核心功能实现
5.1 演练评分实现
int _calculateDrillScore({
required int duration,
required int timeLimit,
required int correctDecisions,
required int totalDecisions,
required List<String> mistakes,
}) {
int baseScore = 100;
// 时间评分
final timeRatio = duration / timeLimit;
if (timeRatio > 1.0) {
baseScore -= ((timeRatio - 1.0) * 20).toInt();
}
// 决策评分
final decisionScore = (correctDecisions / totalDecisions * 30).toInt();
// 错误扣分
baseScore -= mistakes.length * 5;
return (baseScore + decisionScore).clamp(0, 100);
}
5.2 安全等级计算实现
SafetyLevel _calculateSafetyLevel(int score) {
if (score >= 91) return SafetyLevel.model;
if (score >= 81) return SafetyLevel.excellent;
if (score >= 61) return SafetyLevel.good;
if (score >= 41) return SafetyLevel.warning;
return SafetyLevel.danger;
}
5.3 逃生路线验证实现
bool _validateEscapeRoute(List<Offset> userRoute, List<Offset> correctRoute) {
if (userRoute.length < correctRoute.length * 0.5) return false;
int correctPoints = 0;
for (final point in userRoute) {
for (final correctPoint in correctRoute) {
if ((point - correctPoint).distance < 50) {
correctPoints++;
break;
}
}
}
return correctPoints >= correctRoute.length * 0.7;
}
5.4 灭火器操作验证实现
bool _validateExtinguisherOperation(List<String> steps) {
final correctOrder = ['提', '拔', '握', '压'];
if (steps.length != correctOrder.length) return false;
for (int i = 0; i < steps.length; i++) {
if (steps[i] != correctOrder[i]) return false;
}
return true;
}
5.5 安全检查评分实现
int _calculateSafetyScore(List<SafetyCheckItem> items) {
if (items.isEmpty) return 0;
int totalScore = 0;
int maxScore = 0;
for (final item in items) {
maxScore += item.importance * 20;
if (item.isChecked) {
totalScore += item.importance * 20;
}
}
return maxScore > 0 ? (totalScore * 100 / maxScore).toInt() : 0;
}
六、交互设计
6.1 演练流程
6.2 安全检查流程
6.3 灭火器学习流程
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 AR场景模拟
AR功能：
- 真实家庭场景建模
- 火灾动态模拟
- 逃生路线AR导航
- 沉浸式体验
7.2.2 智能提醒
提醒功能：
- 定期演练提醒
- 灭火器过期提醒
- 安全检查提醒
- 季节性安全提示
7.2.3 社区联动
联动功能：
- 社区消防站联系
- 紧急求助一键报警
- 消防知识分享
- 演练排行榜
八、注意事项
8.1 开发注意事项
-
场景真实性：火灾场景需贴近真实情况
-
操作引导：灭火器使用步骤需清晰准确
-
安全提示：演练过程中需有安全提示
-
数据保存：演练记录需持久化存储
-
紧急功能：一键报警功能需稳定可靠
8.2 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 场景加载慢 | 资源过大 | 优化资源 |
| 评分不准确 | 算法问题 | 调整权重 |
| 路线识别错误 | 坐标计算偏差 | 优化判断逻辑 |
| 提醒不生效 | 权限问题 | 检查通知权限 |
| 数据丢失 | 未正确保存 | 检查存储逻辑 |
8.3 使用技巧
🔥 消防安全要点 🔥
预防措施
- 定期检查电器线路
- 不在楼道堆放杂物
- 厨房用火不离人
- 配备合格灭火器
逃生原则
- 保持冷静，不乘电梯
- 湿毛巾捂口鼻
- 低姿前行避烟雾
- 熟悉逃生路线
灭火器使用
- 提：提起灭火器
- 拔：拔掉保险销
- 握：握住喷管
- 压：压下把手
九、运行说明
9.1 环境要求
| 环境 | 版本要求 |
|---|---|
| Flutter SDK | >= 3.0.0 |
| Dart SDK | >= 2.17.0 |
| 鸿蒙OS | API 21+ |
| Web浏览器 | Chrome 90+ |
9.2 运行命令
# 查看可用设备
flutter devices
# 运行到Web服务器
flutter run -d web-server -t lib/main_fire_escape.dart --web-port 8151
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_fire_escape.dart
# 代码分析
flutter analyze lib/main_fire_escape.dart
十、总结
家庭消防逃生演练应用通过知识学习、逃生演练、灭火训练、演练记录四大模块，为家庭成员提供了一个全面的消防安全学习平台。应用支持6种火灾类型、4种灭火器类型、5种演练难度、5种安全等级，帮助家庭成员系统学习消防知识，掌握逃生技能。
核心功能涵盖消防知识学习、逃生演练模拟、灭火器使用教学、安全检查评估四大模块。火灾类型覆盖家庭常见场景；灭火器教学采用四步法，简单易学；演练难度从入门到极限，循序渐进；安全等级从危险到模范，清晰反映家庭安全状况。
应用采用 Material Design 3 设计规范，以警示的红色为主色调，象征消防安全的重要性。通过本应用，希望能够帮助家庭成员提高消防安全意识，掌握逃生技能，真正做到防患于未然。
家庭消防逃生演练——防患于未然
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
开源鸿蒙跨平台开发社区汇聚开发者与厂商，共建“一次开发，多端部署”的开源生态，致力于降低跨端开发门槛，推动万物智联创新。
更多推荐
6
0- 0
已为社区贡献11条内容
所有评论(0)