Flutter 框架跨平台鸿蒙开发 - 智能垃圾分类助手应用
摘要： 智能垃圾分类助手是一款基于Flutter开发的生活服务应用，支持鸿蒙OS/Web平台。核心功能包括拍照识别垃圾种类、分类指南查询、分类记录统计及环保成就系统。应用采用Material Design 3规范，通过CustomPainter实现数据可视化，包含四大模块：识别分类（图像识别）、分类指南（知识库）、分类记录（数据统计）和环保成就（徽章系统）。技术栈选用Flutter 3.0+和Da
·
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图
1.1 应用简介
智能垃圾分类助手是一款生活服务类应用，帮助用户快速识别垃圾种类、了解分类方法、记录分类数据。支持拍照识别、分类指南、分类记录、环保成就等功能，让垃圾分类变得简单有趣。应用以环保的绿色为主色调，象征可持续发展与生态保护。涵盖识别分类、分类指南、分类记录、环保成就四大模块，助力用户成为环保达人。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 拍照识别 | 拍照识别垃圾种类 | 图像识别 |
| 分类指南 | 各类垃圾分类方法 | 知识库 |
| 分类记录 | 记录每日分类数据 | 数据统计 |
| 环保成就 | 完成成就获得奖励 | 徽章系统 |
| 分类知识 | 垃圾分类知识学习 | 卡片展示 |
| 环保排行 | 社区环保达人排行 | 排行榜 |
1.3 垃圾分类定义
| 序号 | 分类名称 | Emoji | 颜色标识 | 描述 |
|---|---|---|---|---|
| 1 | 可回收物 | ♻️ | 蓝色 | 纸类、塑料、金属等 |
| 2 | 有害垃圾 | ☠️ | 红色 | 电池、药品、灯管等 |
| 3 | 厨余垃圾 | 🍂 | 绿色 | 剩菜剩饭、果皮等 |
| 4 | 其他垃圾 | 🗑️ | 灰色 | 难以回收的废弃物 |
1.4 常见垃圾类型
| 序号 | 垃圾名称 | Emoji | 所属分类 | 处理建议 |
|---|---|---|---|---|
| 1 | 塑料瓶 | 🍶 | 可回收物 | 清洗后压扁投放 |
| 2 | 废电池 | 🔋 | 有害垃圾 | 投放专用回收点 |
| 3 | 剩饭剩菜 | 🍚 | 厨余垃圾 | 沥干水分后投放 |
| 4 | 废纸巾 | 📄 | 其他垃圾 | 直接投放 |
| 5 | 易拉罐 | 🥫 | 可回收物 | 清洗压扁后投放 |
| 6 | 过期药品 | 💊 | 有害垃圾 | 连包装一起投放 |
| 7 | 果皮果核 | 🍎 | 厨余垃圾 | 直接投放 |
| 8 | 烟蒂 | 🚬 | 其他垃圾 | 熄灭后投放 |
| 9 | 玻璃瓶 | 🍾 | 可回收物 | 小心轻放防碎 |
| 10 | 旧衣服 | 👕 | 可回收物 | 清洗干净后投放 |
1.5 环保等级定义
| 序号 | 等级名称 | Emoji | 积分范围 | 描述 |
|---|---|---|---|---|
| 1 | 环保新手 | 🌱 | 0-100 | 刚开始学习分类 |
| 2 | 环保达人 | 🌿 | 101-500 | 掌握基本分类 |
| 3 | 环保先锋 | 🌳 | 501-1000 | 分类准确率高 |
| 4 | 环保卫士 | 🏆 | 1001-2000 | 分类专家级别 |
| 5 | 环保大使 | 👑 | 2001+ | 社区环保领袖 |
1.6 成就类型定义
| 序号 | 成就名称 | Emoji | 条件描述 |
|---|---|---|---|
| 1 | 分类新手 | 🎯 | 首次成功分类 |
| 2 | 分类达人 | ⭐ | 累计分类100次 |
| 3 | 准确率之星 | 🎖️ | 准确率达95% |
| 4 | 连续打卡 | 🔥 | 连续7天分类 |
| 5 | 知识达人 | 📚 | 学完所有知识 |
| 6 | 环保先锋 | 🌍 | 累计积分1000 |
1.7 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 自定义绘制 | CustomPainter | - |
| 动画效果 | AnimationController | - |
| 目标平台 | 鸿蒙OS / Web | API 21+ |
1.8 项目结构
lib/
└── main_garbage_classification.dart
├── GarbageClassificationApp # 应用入口
├── GarbageCategory # 垃圾分类枚举
├── GarbageItem # 垃圾项模型
├── EcoLevel # 环保等级枚举
├── AchievementType # 成就类型枚举
├── ClassificationRecord # 分类记录模型
├── GarbageClassificationHomePage # 主页面（底部导航）
├── _buildClassifyPage # 识别页面
├── _buildGuidePage # 指南页面
├── _buildRecordPage # 记录页面
├── _buildProfilePage # 我的页面
├── ClassificationChartPainter # 分类图表绘制器
└── EcoRingPainter # 环保进度环绘制器
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 页面导航流程
2.4 分类识别流程
三、核心模块设计
3.1 数据模型设计
3.1.1 垃圾分类枚举 (GarbageCategory)
enum GarbageCategory {
recyclable('可回收物', '♻️', Color(0xFF2196F3), '纸类、塑料、金属等'),
hazardous('有害垃圾', '☠️', Color(0xFFF44336), '电池、药品、灯管等'),
kitchen('厨余垃圾', '🍂', Color(0xFF4CAF50), '剩菜剩饭、果皮等'),
other('其他垃圾', '🗑️', Color(0xFF9E9E9E), '难以回收的废弃物');
final String label;
final String emoji;
final Color color;
final String description;
}
3.1.2 环保等级枚举 (EcoLevel)
enum EcoLevel {
novice('环保新手', '🌱', 0, 100),
expert('环保达人', '🌿', 101, 500),
pioneer('环保先锋', '🌳', 501, 1000),
guardian('环保卫士', '🏆', 1001, 2000),
ambassador('环保大使', '👑', 2001, 999999);
final String label;
final String emoji;
final int minPoints;
final int maxPoints;
}
3.1.3 垃圾项模型 (GarbageItem)
class GarbageItem {
final String id; // 垃圾ID
final String name; // 垃圾名称
final String emoji; // 图标
final GarbageCategory category; // 所属分类
final String disposal; // 处理建议
final List<String> tips; // 分类提示
}
3.1.4 分类记录模型 (ClassificationRecord)
class ClassificationRecord {
final String id; // 记录ID
final GarbageItem item; // 垃圾项
final GarbageCategory userCategory; // 用户选择的分类
final bool isCorrect; // 是否正确
final int points; // 获得积分
final DateTime createdAt; // 创建时间
}
3.1.5 分类分布示例
3.2 页面结构设计
3.2.1 主页面布局
3.2.2 识别页结构
3.2.3 指南页结构
3.2.4 记录页结构
3.3 分类识别逻辑
3.4 积分计算逻辑
四、UI设计规范
4.1 配色方案
应用以环保的绿色为主色调，象征可持续发展与生态保护：
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | #4CAF50 (Green) | 导航、主题元素 |
| 辅助色 | #66BB6A | 识别页面 |
| 第三色 | #81C784 | 指南页面 |
| 强调色 | #43A047 | 记录页面 |
| 可回收色 | #2196F3 (Blue) | 可回收物标识 |
| 有害色 | #F44336 (Red) | 有害垃圾标识 |
| 厨余色 | #4CAF50 (Green) | 厨余垃圾标识 |
| 其他色 | #9E9E9E (Grey) | 其他垃圾标识 |
| 背景色 | #0A0A1A | 页面背景 |
| 卡片背景 | #1A1A2E | 垃圾卡片 |
4.2 分类配色方案
| 分类 | 色值 | 视觉效果 |
|---|---|---|
| 可回收物 | #2196F3 | 环保蓝色 |
| 有害垃圾 | #F44336 | 警示红色 |
| 厨余垃圾 | #4CAF50 | 自然绿色 |
| 其他垃圾 | #9E9E9E | 中性灰色 |
4.3 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 页面标题 | 24px | Bold | 主色 |
| 垃圾名称 | 16px | Bold | #FFFFFF |
| 分类标签 | 12px | Regular | 白色 |
| 积分数字 | 28px | Bold | 白色 |
4.4 组件规范
4.4.1 环保积分卡片
┌─────────────────────────────────────┐
│ 🌿 环保达人 │
│ │
│ 520 积分 │
│ │
│ 今日分类: 12次 准确率: 95% │
└─────────────────────────────────────┘
4.4.2 垃圾分类卡片
┌─────────────────────────────────────┐
│ 🍶 塑料瓶 │
│ │
│ ♻️ 可回收物 │
│ │
│ 处理建议: 清洗后压扁投放 │
│ │
│ [选择分类] │
└─────────────────────────────────────┘
4.4.3 分类指南卡片
┌─────────────────────────────────────┐
│ ♻️ 可回收物 │
│ │
│ 纸类、塑料、金属、玻璃等 │
│ │
│ 常见物品: │
│ 📰报纸 📦纸箱 🍶塑料瓶 │
│ 🥫易拉罐 🍾玻璃瓶 │
│ │
│ 处理方式: 清洁干燥后投放 │
└─────────────────────────────────────┘
4.4.4 分类记录卡片
┌─────────────────────────────────────┐
│ 🍶 塑料瓶 → ♻️ 可回收物 │
│ │
│ ✅ 分类正确 +10积分 │
│ │
│ 时间: 今天 14:30 │
└─────────────────────────────────────┘
4.4.5 成就徽章
┌─────────────────────────────────────┐
│ 🏆 我的成就 │
│ │
│ [🎯] [⭐] [🎖️] [🔒] [🔒] [🔒] │
│ 分类新手 分类达人 准确率之星 │
└─────────────────────────────────────┘
五、核心功能实现
5.1 分类识别实现
void _classifyGarbage(GarbageItem item, GarbageCategory userCategory) {
final isCorrect = item.category == userCategory;
final points = isCorrect ? 10 : 0;
final record = ClassificationRecord(
id: 'r_${DateTime.now().millisecondsSinceEpoch}',
item: item,
userCategory: userCategory,
isCorrect: isCorrect,
points: points,
);
setState(() {
_records.insert(0, record);
_totalPoints += points;
if (isCorrect) _correctCount++;
_totalCount++;
});
_checkAchievements();
}
5.2 环保等级计算实现
EcoLevel _calculateEcoLevel(int points) {
for (final level in EcoLevel.values) {
if (points >= level.minPoints && points <= level.maxPoints) {
return level;
}
}
return EcoLevel.ambassador;
}
5.3 准确率计算实现
double _calculateAccuracy() {
if (_totalCount == 0) return 0;
return (_correctCount / _totalCount * 100);
}
5.4 成就检测实现
void _checkAchievements() {
if (_totalCount == 1 && !_hasAchievement(AchievementType.firstClassify)) {
_unlockAchievement(AchievementType.firstClassify);
}
if (_totalCount >= 100 && !_hasAchievement(AchievementType.classifyExpert)) {
_unlockAchievement(AchievementType.classifyExpert);
}
if (_calculateAccuracy() >= 95 && _totalCount >= 50 && !_hasAchievement(AchievementType.accuracyStar)) {
_unlockAchievement(AchievementType.accuracyStar);
}
if (_totalPoints >= 1000 && !_hasAchievement(AchievementType.ecoPioneer)) {
_unlockAchievement(AchievementType.ecoPioneer);
}
}
5.5 分类统计实现
Map<GarbageCategory, int> _getCategoryDistribution() {
final distribution = <GarbageCategory, int>{};
for (final category in GarbageCategory.values) {
distribution[category] = _records.where((r) => r.item.category == category).length;
}
return distribution;
}
六、交互设计
6.1 分类流程
6.2 学习流程
6.3 成就解锁流程
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 AI识别
识别功能：
- 拍照自动识别
- 多物体同时识别
- 语音播报结果
- 识别历史记录
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_garbage_classification.dart --web-port 8152
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_garbage_classification.dart
# 代码分析
flutter analyze lib/main_garbage_classification.dart
十、总结
智能垃圾分类助手应用通过识别分类、分类指南、分类记录、环保成就四大模块，为用户提供了一个便捷的垃圾分类学习平台。应用支持4种垃圾分类、5种环保等级、6种成就类型，帮助用户轻松掌握垃圾分类知识，养成环保好习惯。
核心功能涵盖垃圾识别分类、分类指南学习、分类记录统计、环保成就激励四大模块。垃圾分类覆盖可回收物、有害垃圾、厨余垃圾、其他垃圾四大类；环保等级从新手到大使，清晰反映用户环保贡献；成就系统激励用户持续参与分类。
应用采用 Material Design 3 设计规范，以环保的绿色为主色调，象征可持续发展与生态保护。通过本应用，希望能够帮助用户轻松掌握垃圾分类知识，养成环保好习惯，共同守护美丽家园。
智能垃圾分类助手——让分类变得简单有趣
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
有“AI”的1024 = 2048，欢迎大家加入2048 AI社区
更多推荐
0
0- 0
已为社区贡献2条内容
所有评论(0)