Flutter 框架跨平台鸿蒙开发 - AR植物养护助手
运行效果图AR植物养护助手是一款科技探索类应用,为植物爱好者和新手提供专业的植物识别与养护指导服务。应用以绿色为主色调,象征自然与生命。界面设计采用清新自然的风格,让用户能够轻松掌握植物养护知识。应用通过AR扫描识别植物种类,提供个性化的养护方案,包括浇水频率、光照需求、施肥提醒等功能。无论是植物新手还是资深爱好者,都能在这里找到适合自己的养护方法,让每一株植物都能茁壮成长。序号类型名称Emoji
AR植物养护助手应用
欢迎加入开源鸿蒙跨平台社区:
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图




1.1 应用简介
AR植物养护助手是一款科技探索类应用,为植物爱好者和新手提供专业的植物识别与养护指导服务。应用以绿色为主色调,象征自然与生命。界面设计采用清新自然的风格,让用户能够轻松掌握植物养护知识。
应用通过AR扫描识别植物种类,提供个性化的养护方案,包括浇水频率、光照需求、施肥提醒等功能。无论是植物新手还是资深爱好者,都能在这里找到适合自己的养护方法,让每一株植物都能茁壮成长。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| AR识别 | 模拟扫描识别植物 | CustomPaint绘制 |
| 植物管理 | 我的植物列表管理 | 数据模型存储 |
| 养护任务 | 浇水施肥提醒系统 | 任务调度管理 |
| 养护指南 | 植物养护知识库 | 分类展示 |
| 个性化方案 | 根据植物类型推荐 | 智能匹配 |
| 浇水提醒 | 智能浇水周期计算 | 日期计算 |
1.3 植物类型定义
| 序号 | 类型名称 | Emoji | 描述 |
|---|---|---|---|
| 1 | 多肉植物 | 🌵 | 耐旱易养 |
| 2 | 观叶植物 | 🌿 | 净化空气 |
| 3 | 开花植物 | 🌸 | 美丽芬芳 |
| 4 | 仙人掌 | 🌵 | 极耐旱 |
| 5 | 香草植物 | 🌱 | 实用美味 |
| 6 | 蕨类植物 | 🌿 | 喜阴湿 |
| 7 | 兰花 | 🌺 | 高雅精致 |
| 8 | 盆景 | 🌳 | 艺术造型 |
1.4 养护难度定义
| 序号 | 难度名称 | Emoji | 颜色 | 说明 |
|---|---|---|---|---|
| 1 | 简单 | ⭐ | 绿色 | 新手友好 |
| 2 | 中等 | ⭐⭐ | 黄色 | 需要关注 |
| 3 | 困难 | ⭐⭐⭐ | 红色 | 经验要求 |
1.5 浇水频率定义
| 序号 | 频率名称 | 天数 | Emoji | 颜色 |
|---|---|---|---|---|
| 1 | 每天 | 1 | 💧 | 深蓝 |
| 2 | 每3天 | 3 | 💧 | 中蓝 |
| 3 | 每周 | 7 | 💧 | 浅蓝 |
| 4 | 每两周 | 14 | 💧 | 淡蓝 |
| 5 | 每月 | 30 | 💧 | 极淡蓝 |
1.6 光照需求定义
| 序号 | 需求名称 | Emoji | 颜色 | 说明 |
|---|---|---|---|---|
| 1 | 全日照 | ☀️ | 黄色 | 6小时以上 |
| 2 | 半日照 | 🌤️ | 浅黄 | 3-6小时 |
| 3 | 耐阴 | ☁️ | 灰色 | 散射光即可 |
| 4 | 低光 | 🌙 | 深灰 | 少量光照 |
1.7 养护任务类型定义
| 序号 | 任务名称 | Emoji | 颜色 |
|---|---|---|---|
| 1 | 浇水 | 💧 | 蓝色 |
| 2 | 施肥 | 🌾 | 绿色 |
| 3 | 修剪 | ✂️ | 橙色 |
| 4 | 换盆 | 🏡 | 棕色 |
| 5 | 喷雾 | 💨 | 青色 |
| 6 | 转盆 | 🔄 | 紫色 |
1.8 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 自定义绘制 | CustomPainter | - |
| 动画系统 | AnimationController | - |
| 目标平台 | 鸿蒙OS / Web | API 21+ |
1.9 项目结构
lib/
└── main_plant_care.dart
├── PlantCareApp # 应用入口
├── PlantType # 植物类型枚举
├── CareDifficulty # 养护难度枚举
├── WaterFrequency # 浇水频率枚举
├── LightRequirement # 光照需求枚举
├── CareTaskType # 养护任务类型枚举
├── Plant # 植物模型
├── CareTask # 养护任务模型
├── PlantRecognitionResult # 识别结果模型
├── PlantCareHomePage # 主页面(底部导航)
├── _buildScanPage # 识别页面
├── _buildPlantsPage # 植物页面
├── _buildTasksPage # 任务页面
├── _buildGuidePage # 指南页面
├── PlantScannerPainter # 扫描器绘制器
└── ScanLinePainter # 扫描线绘制器
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 页面导航流程
2.4 植物识别流程
三、核心模块设计
3.1 数据模型设计
3.1.1 植物类型枚举 (PlantType)
enum PlantType {
succulent('多肉植物', Icons.eco, Color(0xFF81C784), '耐旱易养'),
foliage('观叶植物', Icons.nature, Color(0xFF66BB6A), '净化空气'),
flowering('开花植物', Icons.local_florist, Color(0xFFF06292), '美丽芬芳'),
cactus('仙人掌', Icons.grass, Color(0xFF4DB6AC), '极耐旱'),
herb('香草植物', Icons.spa, Color(0xFFAED581), '实用美味'),
fern('蕨类植物', Icons.forest, Color(0xFF81C784), '喜阴湿'),
orchid('兰花', Icons.local_florist_outlined, Color(0xFFBA68C8), '高雅精致'),
bonsai('盆景', Icons.park, Color(0xFF8D6E63), '艺术造型');
final String label;
final IconData icon;
final Color color;
final String description;
}
3.1.2 浇水频率枚举 (WaterFrequency)
enum WaterFrequency {
daily('每天', 1, Icons.water_drop, Color(0xFF2196F3)),
every3days('每3天', 3, Icons.water_drop, Color(0xFF42A5F5)),
weekly('每周', 7, Icons.water_drop, Color(0xFF64B5F6)),
every2weeks('每两周', 14, Icons.water_drop, Color(0xFF90CAF9)),
monthly('每月', 30, Icons.water_drop, Color(0xFFBBDEFB));
final String label;
final int days;
final IconData icon;
final Color color;
}
3.1.3 植物模型 (Plant)
class Plant {
final String id; // 植物ID
final String name; // 植物名称
final String scientificName; // 学名
final PlantType type; // 植物类型
final CareDifficulty difficulty; // 养护难度
final WaterFrequency waterFrequency;// 浇水频率
final LightRequirement lightRequirement; // 光照需求
final String description; // 描述
final List<String> careTips; // 养护提示
final DateTime addedDate; // 添加日期
final DateTime? lastWatered; // 最后浇水时间
final DateTime? lastFertilized; // 最后施肥时间
bool get needsWater; // 是否需要浇水
int get daysUntilWater; // 距离下次浇水天数
}
3.1.4 养护任务模型 (CareTask)
class CareTask {
final String id; // 任务ID
final Plant plant; // 关联植物
final CareTaskType type; // 任务类型
final DateTime scheduledDate; // 计划日期
final bool isCompleted; // 是否完成
final String? note; // 备注
}
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 | 导航、主题元素 |
| 辅助色 | #81C784 | 渐变、背景 |
| 浇水色 | #2196F3 | 浇水相关 |
| 施肥色 | #8BC34A | 施肥相关 |
| 警告色 | #FF5722 | 需要注意 |
| 简单色 | #4CAF50 | 简单难度 |
4.2 植物类型颜色
| 植物类型 | 色值 | 视觉效果 |
|---|---|---|
| 多肉植物 | #81C784 | 清新绿色 |
| 观叶植物 | #66BB6A | 自然绿色 |
| 开花植物 | #F06292 | 粉色花朵 |
| 仙人掌 | #4DB6AC | 青绿色 |
| 香草植物 | #AED581 | 浅绿色 |
| 兰花 | #BA68C8 | 紫色优雅 |
4.3 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 页面标题 | 24px | Bold | 主色 |
| 植物名称 | 15px | SemiBold | #000000 |
| 学名 | 11px | Italic | #757575 |
| 状态标签 | 10px | Regular | 状态颜色 |
| 统计数字 | 20px | Bold | 白色 |
4.4 组件规范
4.4.1 AR扫描器界面
┌─────────────────────────────────────┐
│ [AR模拟] │
├─────────────────────────────────────┤
│ ┌───┐ ┌───┐│
│ │ │ │ ││
│ └───┘ └───┘│
│ │
│ 🌿 │
│ │
│ ┌───┐ ┌───┐│
│ │ │ │ ││
│ └───┘ └───┘│
│ │
│ [ 📷 扫描植物 ] │
└─────────────────────────────────────┘
4.4.2 植物卡片
┌─────────────────────────────────────┐
│ [🌿] 绿萝 [简单] [💧] │
│ Epipremnum aureum │
│ 💧 需要浇水 │
└─────────────────────────────────────┘
4.4.3 识别结果卡片
┌─────────────────────────────────────┐
│ [🌿] 绿萝 │
│ Epipremnum aureum │
│ [观叶植物] │
│ │
│ 常见的室内观叶植物,易于养护 │
│ │
│ [ ➕ 添加到我的植物 ] │
└─────────────────────────────────────┘
4.4.4 任务卡片
┌─────────────────────────────────────┐
│ [💧] 绿萝 - 浇水 [完成] │
│ 今天 │
└─────────────────────────────────────┘
五、核心功能实现
5.1 植物识别实现
void _startScan() {
setState(() {
_isScanning = true;
_recognitionResult = null;
});
_scanController.forward(from: 0);
_scanTimer = Timer(const Duration(seconds: 3), () {
setState(() {
_isScanning = false;
_recognitionResult = _generateRandomRecognition();
});
});
}
PlantRecognitionResult _generateRandomRecognition() {
final random = Random();
final plants = [
('绿萝', 'Epipremnum aureum', PlantType.foliage, '常见的室内观叶植物'),
('虎皮兰', 'Sansevieria', PlantType.foliage, '净化空气能力强'),
('仙人掌', 'Cactaceae', PlantType.cactus, '极耐旱,适合新手'),
];
final plant = plants[random.nextInt(plants.length)];
return PlantRecognitionResult(
name: plant.$1,
scientificName: plant.$2,
type: plant.$3,
confidence: 0.75 + random.nextDouble() * 0.2,
description: plant.$4,
);
}
5.2 浇水提醒实现
bool get needsWater {
if (lastWatered == null) return true;
final daysSinceWater = DateTime.now().difference(lastWatered!).inDays;
return daysSinceWater >= waterFrequency.days;
}
int get daysUntilWater {
if (lastWatered == null) return 0;
final daysSinceWater = DateTime.now().difference(lastWatered!).inDays;
return (waterFrequency.days - daysSinceWater).clamp(0, waterFrequency.days);
}
5.3 浇水操作实现
void _waterPlant(Plant plant) {
setState(() {
final index = _plants.indexOf(plant);
if (index != -1) {
_plants[index] = Plant(
id: plant.id,
name: plant.name,
scientificName: plant.scientificName,
type: plant.type,
difficulty: plant.difficulty,
waterFrequency: plant.waterFrequency,
lightRequirement: plant.lightRequirement,
imagePath: plant.imagePath,
description: plant.description,
careTips: plant.careTips,
addedDate: plant.addedDate,
lastWatered: DateTime.now(),
lastFertilized: plant.lastFertilized,
);
}
});
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('${plant.name} 已浇水'),
backgroundColor: const Color(0xFF2196F3),
),
);
}
5.4 任务完成实现
void _completeTask(CareTask task) {
setState(() {
final index = _tasks.indexOf(task);
if (index != -1) {
_tasks[index] = CareTask(
id: task.id,
plant: task.plant,
type: task.type,
scheduledDate: task.scheduledDate,
isCompleted: true,
note: '已完成',
);
}
});
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('${task.plant.name} ${task.type.label}完成'),
backgroundColor: task.type.color,
),
);
}
5.5 扫描器绘制实现
class PlantScannerPainter extends CustomPainter {
void paint(Canvas canvas, Size size) {
// 绘制装饰性叶子
final leafPaint = Paint()
..color = Colors.white.withOpacity(0.15)
..style = PaintingStyle.fill;
final leafPath = Path();
leafPath.moveTo(size.width * 0.3, size.height * 0.6);
leafPath.quadraticBezierTo(
size.width * 0.35, size.height * 0.4,
size.width * 0.4, size.height * 0.35,
);
// ... 更多绘制代码
canvas.drawPath(leafPath, leafPaint);
// 绘制扫描框角标
final cornerPaint = Paint()
..color = Colors.white.withOpacity(0.5)
..style = PaintingStyle.stroke
..strokeWidth = 2;
// ... 角标绘制代码
}
}
六、交互设计
6.1 识别流程
6.2 植物管理流程
6.3 任务处理流程
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 真实AR识别
识别功能:
- 设备摄像头接入
- 图像识别API
- 实时植物检测
- 多角度识别
7.2.2 AI诊断系统
诊断功能:
- 病虫害识别
- 营养缺乏诊断
- 生长状态评估
- 治疗建议
7.2.3 植物社区
社区功能:
- 养护经验分享
- 问题求助
- 植物展示
- 互动交流
八、注意事项
8.1 开发注意事项
-
动画控制:扫描动画需要正确管理AnimationController
-
状态同步:浇水后需要同步更新植物状态和任务列表
-
日期计算:浇水提醒需要准确计算日期差
-
定时器管理:扫描定时器需要在dispose时取消
-
内存优化:植物列表较多时注意性能优化
8.2 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 扫描无结果 | Timer未启动 | 检查_startScan |
| 浇水状态不更新 | 状态未刷新 | 调用setState |
| 任务不显示 | 列表为空 | 检查_tasks数据 |
| 识别结果异常 | 随机数据问题 | 检查_generateRandomRecognition |
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_plant_care.dart --web-port 8141
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_plant_care.dart
# 代码分析
flutter analyze lib/main_plant_care.dart
十、总结
AR植物养护助手应用通过植物识别、植物管理、养护任务、养护指南四大模块,为用户提供了一个全方位的植物养护辅助平台。应用支持8种植物类型、3级养护难度、5种浇水频率、4种光照需求,让植物新手也能轻松养好花。
核心功能涵盖AR识别、浇水提醒、任务管理、养护指南四大模块。植物类型包括多肉、观叶、开花、仙人掌、香草、蕨类、兰花、盆景等,覆盖常见室内植物;养护难度分为简单、中等、困难三级,便于用户选择适合的植物;浇水提醒智能计算浇水周期,确保植物不会缺水或过水。
应用采用 Material Design 3 设计规范,以绿色为主色调,象征自然与生命。通过本应用,希望能够帮助用户掌握植物养护知识,让每一株植物都能茁壮成长。
AR植物养护助手——让植物新手也能养好花
更多推荐



所有评论(0)