Flutter 框架跨平台鸿蒙开发 - 儿童成长记录应用
·
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图
1.1 应用简介
儿童成长记录是一款专业的儿童成长发育记录和分析应用，核心理念是"科学育儿助手"。在孩子的成长过程中，家长需要关注身高、体重、头围等多项发育指标，同时还要关注孩子的运动、语言、认知、社交等发育里程碑。本应用帮助家长科学记录和分析孩子的成长数据，提供专业的发育评估和育儿建议。
儿童期是人生最关键的发育阶段，0-6岁是儿童生长发育的黄金时期。通过科学的记录和分析，家长可以及时发现孩子的发育问题，采取针对性的干预措施。本应用结合世界卫生组织(WHO)儿童生长标准和发育里程碑，为家长提供专业的育儿指导。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 儿童信息 | 管理儿童基本信息 | 表单输入 + 数据模型 |
| 成长记录 | 记录身高、体重、头围等 | 表单输入 + 数据存储 |
| 成长曲线 | 可视化展示成长趋势 | CustomPainter图表 |
| 发育评估 | 评估发育里程碑完成情况 | 进度计算 + 等级评定 |
| 育儿建议 | 提供科学育儿指导 | 年龄段匹配 + 建议生成 |
| 里程碑管理 | 记录发育里程碑达成 | 列表展示 + 状态切换 |
1.3 发育评估等级
| 序号 | 等级 | Emoji | 颜色 | 说明 |
|---|---|---|---|---|
| 1 | 优秀 | 🌟 | #4CAF50 | 发育里程碑完成度≥80% |
| 2 | 良好 | 😊 | #8BC34A | 发育里程碑完成度≥60% |
| 3 | 正常 | 🙂 | #FFC107 | 发育里程碑完成度≥40% |
| 4 | 需关注 | ⚠️ | #FF9800 | 发育里程碑完成度≥20% |
| 5 | 建议咨询 | 👨⚕️ | #F44336 | 发育里程碑完成度<20% |
1.4 发育里程碑分类
| 序号 | 类别 | 描述 | 典型里程碑 |
|---|---|---|---|
| 1 | 运动 | 大运动和精细动作 | 坐、爬、走、跑 |
| 2 | 语言 | 语言理解和表达 | 发音、说话、句子 |
| 3 | 认知 | 思维和认知能力 | 认物、解决问题 |
| 4 | 社交 | 社交和情感发展 | 互动、分享、合作 |
1.5 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 状态管理 | setState | - |
| 动画控制 | AnimationController | - |
| 图表绘制 | CustomPainter | - |
| 目标平台 | 鸿蒙OS / Web | API 21+ |
二、项目结构
lib/
├── main_child_growth.dart # 应用主入口
│ ├── ChildGrowthApp # 根应用组件
│ ├── Gender # 性别枚举
│ ├── GrowthIndicator # 成长指标枚举
│ ├── DevelopmentLevel # 发育等级枚举
│ ├── Child # 儿童模型
│ ├── GrowthRecord # 成长记录模型
│ ├── Milestone # 里程碑模型
│ ├── ChildGrowthHomePage # 主页面
│ ├── ProgressPainter # 进度圆绘制器
│ └── GrowthChartPainter # 成长曲线绘制器
三、数据模型
3.1 Gender 枚举
enum Gender {
boy('男孩', '👦', Color(0xFF2196F3)),
girl('女孩', '👧', Color(0xFFE91E63));
final String label;
final String emoji;
final Color color;
}
3.2 DevelopmentLevel 枚举
enum DevelopmentLevel {
excellent('优秀', '🌟', Color(0xFF4CAF50)),
good('良好', '😊', Color(0xFF8BC34A)),
normal('正常', '🙂', Color(0xFFFFC107)),
attention('需关注', '⚠️', Color(0xFFFF9800)),
consult('建议咨询', '👨⚕️', Color(0xFFF44336));
final String label;
final String emoji;
final Color color;
}
3.3 Child 模型
class Child {
final String id; // 儿童唯一标识
final String name; // 姓名
final Gender gender; // 性别
final DateTime birthDate; // 出生日期
final String? avatar; // 头像emoji
int get ageInMonths {
final now = DateTime.now();
return (now.year - birthDate.year) * 12 + (now.month - birthDate.month);
}
String get ageDisplay {
final months = ageInMonths;
if (months < 12) {
return '$months个月';
} else {
final years = months ~/ 12;
final remainingMonths = months % 12;
return '$years岁$remainingMonths个月';
}
}
}
3.4 GrowthRecord 模型
class GrowthRecord {
final String id; // 记录唯一标识
final DateTime date; // 记录日期
final double height; // 身高(cm)
final double weight; // 体重(kg)
final double? headCircumference; // 头围(cm)
final String? notes; // 备注
double get bmi => weight / ((height / 100) * (height / 100));
}
3.5 Milestone 模型
class Milestone {
final String id; // 里程碑唯一标识
final String category; // 类别
final String description; // 描述
final int typicalAgeMonths; // 典型达成年龄(月)
final DateTime? achievedDate; // 达成日期
final bool isAchieved; // 是否已达成
}
四、核心功能实现
4.1 成长记录流程
4.2 年龄计算逻辑
int get ageInMonths {
final now = DateTime.now();
return (now.year - birthDate.year) * 12 + (now.month - birthDate.month);
}
String get ageDisplay {
final months = ageInMonths;
if (months < 12) {
return '$months个月';
} else {
final years = months ~/ 12;
final remainingMonths = months % 12;
if (remainingMonths == 0) {
return '$years岁';
}
return '$years岁$remainingMonths个月';
}
}
4.3 BMI计算
double get bmi => weight / ((height / 100) * (height / 100));
BMI计算公式：
B M I = 体重 ( k g ) 身高 ( m ) 2 BMI = \frac{体重(kg)}{身高(m)^2} BMI=身高(m)2体重(kg)
4.4 发育评估算法
DevelopmentLevel _assessDevelopment() {
final progress = _milestones.where((m) => m.isAchieved).length / _milestones.length;
if (progress >= 0.8) return DevelopmentLevel.excellent;
if (progress >= 0.6) return DevelopmentLevel.good;
if (progress >= 0.4) return DevelopmentLevel.normal;
if (progress >= 0.2) return DevelopmentLevel.attention;
return DevelopmentLevel.consult;
}
4.5 成长曲线绘制
class GrowthChartPainter extends CustomPainter {
final List<GrowthRecord> records;
final Color color;
void paint(Canvas canvas, Size size) {
// 计算数据范围
final minHeight = records.map((r) => r.height).reduce(min);
final maxHeight = records.map((r) => r.height).reduce(max);
// 绘制身高曲线
final heightPath = Path();
for (var i = 0; i < records.length; i++) {
final x = padding + (i / (records.length - 1)) * chartWidth;
final y = padding + (1 - (records[i].height - minHeight) / (maxHeight - minHeight)) * chartHeight;
if (i == 0) {
heightPath.moveTo(x, y);
} else {
heightPath.lineTo(x, y);
}
canvas.drawCircle(Offset(x, y), 4, dotPaint);
}
canvas.drawPath(heightPath, heightPaint);
}
}
4.6 育儿建议生成
五、界面设计
5.1 主页面布局
┌─────────────────────────────────────┐
│ 👶 儿童成长记录 │
│ 科学育儿助手 │
├─────────────────────────────────────┤
│ ┌─────────────────────────────┐ │
│ │ 👦 小明 │ │
│ │ 男孩 · 1岁6个月 │ │
│ │ ───────────────────────── │ │
│ │ 身高 体重 BMI │ │
│ │ 82.0cm 11.0kg 16.4 │ │
│ └─────────────────────────────┘ │
├─────────────────────────────────────┤
│ 成长变化 │
│ ┌─────┐┌─────┐┌─────┐ │
│ │ 📏 ││ ⚖️ ││ 📅 │ │
│ │+2cm ││+0.5kg││ 4次 │ │
│ │身高增长││体重增长││记录次数│ │
│ └─────┘└─────┘└─────┘ │
├─────────────────────────────────────┤
│ 发育评估 🌟 优秀 │
│ ┌─────────┐ 运动 ████████ 100% │
│ │ 4/7 │ 语言 ██████ 50% │
│ │ 里程碑 │ 认知 ████████ 100% │
│ └─────────┘ 社交 ████ 0% │
├─────────────────────────────────────┤
│ 💡 育儿建议 │
│ ┌─────────────────────────────┐ │
│ │ 🥗 均衡营养 │ │
│ │ 提供多样化食物... │ │
│ └─────────────────────────────┘ │
└─────────────────────────────────────┘
5.2 成长页面布局
┌─────────────────────────────────────┐
│ 成长曲线 │
│ ┌─────────────────────────────┐ │
│ │ │ │
│ │ 📈 成长趋势图 │ │
│ │ │ │
│ │ ● 身高 ● 体重 │ │
│ └─────────────────────────────┘ │
├─────────────────────────────────────┤
│ 成长记录 4条记录│
│ ┌─────────────────────────────┐ │
│ │ 📊 2024年4月8日 │ │
│ │ 📏82.0cm ⚖️11.0kg 📊BMI16.4│ │
│ └─────────────────────────────┘ │
│ ┌─────────────────────────────┐ │
│ │ 📊 2024年3月8日 │ │
│ │ 📏80.0cm ⚖️10.5kg 📊BMI16.4│ │
│ └─────────────────────────────┘ │
│ │
│ [添加记录] │
└─────────────────────────────────────┘
5.3 发育页面布局
┌─────────────────────────────────────┐
│ 发育里程碑 4/7已完成│
├─────────────────────────────────────┤
│ 运动 │
│ ┌─────────────────────────────┐ │
│ │ ✓ 能够独立坐稳 │ │
│ │ 典型年龄: 6个月 │ │
│ │ ✓ 能够爬行 │ │
│ │ 典型年龄: 8个月 │ │
│ │ ✓ 能够独立行走 │ │
│ │ 典型年龄: 12个月 │ │
│ └─────────────────────────────┘ │
│ 语言 │
│ ┌─────────────────────────────┐ │
│ │ ✓ 会说简单的词语 │ │
│ │ 典型年龄: 12个月 │ │
│ │ ○ 会说简单句子 │ │
│ │ 典型年龄: 24个月 │ │
│ └─────────────────────────────┘ │
└─────────────────────────────────────┘
六、动画效果
6.1 图标脉冲动画
_pulseController = AnimationController(
vsync: this,
duration: const Duration(milliseconds: 1500),
)..repeat(reverse: true);
AnimatedBuilder(
animation: _pulseController,
builder: (context, child) {
return Container(
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: Colors.green.withValues(
alpha: 0.3 + _pulseController.value * 0.2
),
blurRadius: 10 + _pulseController.value * 5,
),
],
),
);
},
)
七、运行与调试
7.1 运行命令
# 运行到鸿蒙设备
flutter run -d harmony lib/main_child_growth.dart
# 运行到Web服务器
flutter run -d web-server -t lib/main_child_growth.dart --web-port 8131
# 运行到Windows
flutter run -d windows -t lib/main_child_growth.dart
# 代码分析
flutter analyze lib/main_child_growth.dart
7.2 功能测试清单
| 测试项 | 测试内容 | 预期结果 |
|---|---|---|
| 添加儿童 | 创建儿童信息 | 信息正确保存 |
| 成长记录 | 添加成长数据 | 数据正确计算 |
| 成长曲线 | 查看成长趋势 | 图表正确绘制 |
| 发育评估 | 查看发育等级 | 评估准确合理 |
| 里程碑 | 切换里程碑状态 | 状态正确更新 |
| 育儿建议 | 查看育儿建议 | 建议匹配年龄 |
八、扩展方向
8.1 后端集成
┌─────────────┐ HTTPS ┌─────────────┐
│ 客户端 │ ←─────────────→ │ 服务器 │
└─────────────┘ └─────────────┘
│ │
│ 成长数据同步 │
│ 用户认证 │
│ WHO标准对比 │
│ 专业咨询 │
↓ ↓
┌─────────────┐ ┌─────────────┐
│ 本地存储 │ │ 云端数据库 │
└─────────────┘ └─────────────┘
8.2 功能扩展计划
| 版本 | 功能 | 描述 |
|---|---|---|
| v1.1 | 数据持久化 | 本地数据库存储 |
| v1.2 | WHO标准对比 | 与世界卫生组织标准对比 |
| v1.3 | 疫苗记录 | 疫苗接种记录和提醒 |
| v1.4 | 多儿童管理 | 支持多个儿童信息 |
| v1.5 | 专业咨询 | 对接儿科医生咨询 |
8.3 高级功能
九、使用场景
9.1 典型使用场景
👶 儿童成长记录使用场景 👶
| 场景 | 描述 | 使用频率 |
|---|---|---|
| 定期体检 | 记录体检数据 | 每月1次 |
| 日常观察 | 记录发育里程碑 | 不定期 |
| 成长分析 | 分析成长趋势 | 每季度 |
| 育儿指导 | 获取育儿建议 | 每周 |
| 健康评估 | 评估发育状况 | 每月 |
9.2 使用建议
┌─────────────────────────────────────────────────────────┐
│ 使用建议 │
├─────────────────────────────────────────────────────────┤
│ │
│ 📏 测量建议 │
│ • 定期测量身高体重，建议每月一次 │
│ • 使用标准测量工具，确保数据准确 │
│ • 固定测量时间，避免误差 │
│ • 记录测量时的年龄和状态 │
│ │
│ 📊 记录建议 │
│ • 及时记录发育里程碑 │
│ • 拍照或视频记录重要时刻 │
│ • 添加备注描述具体情况 │
│ • 定期回顾和分析数据 │
│ │
│ 👨⚕️ 咨询建议 │
│ • 发现异常及时咨询医生 │
│ • 定期进行儿童保健检查 │
│ • 参考WHO儿童生长标准 │
│ • 不要过度焦虑，保持理性 │
│ │
└─────────────────────────────────────────────────────────┘
十、科学依据
10.1 WHO儿童生长标准
| 指标 | 测量方法 | 参考标准 |
|---|---|---|
| 身高 | 身长/身长测量 | WHO生长曲线 |
| 体重 | 体重秤测量 | WHO生长曲线 |
| 头围 | 软尺测量 | WHO生长曲线 |
| BMI | 计算得出 | WHO BMI标准 |
10.2 发育里程碑参考
📋 儿童发育里程碑 📋
运动发育
- 2个月：抬头
- 6个月：独立坐
- 8个月：爬行
- 12个月：独立行走
- 18个月：跑步
- 24个月：跳跃
语言发育
- 3个月：发出咕咕声
- 6个月：牙牙学语
- 12个月：说简单词语
- 18个月：说简单句子
- 24个月：会说更多词汇
认知发育
- 4个月：认识主要照顾者
- 8个月：理解物体恒存
- 12个月：模仿动作
- 18个月：认识常见物品
- 24个月：简单分类
十一、育儿知识
11.1 各年龄段育儿要点
┌─────────────────────────────────────────────────────────┐
│ 各年龄段育儿要点 │
├─────────────────────────────────────────────────────────┤
│ │
│ 👶 婴儿期 (0-12个月) │
│ • 纯母乳喂养至6个月 │
│ • 6个月后逐步添加辅食 │
│ • 保证充足睡眠(14-17小时) │
│ • 多进行亲子互动 │
│ │
│ 👦 幼儿期 (12-24个月) │
│ • 提供均衡营养 │
│ • 培养良好饮食习惯 │
│ • 鼓励运动和探索 │
│ • 开始语言启蒙 │
│ │
│ 🧒 学龄前期 (24-72个月) │
│ • 培养自理能力 │
│ • 发展社交技能 │
│ • 激发创造力和想象力 │
│ • 建立规则意识 │
│ │
└─────────────────────────────────────────────────────────┘
11.2 常见问题解答
| 问题 | 建议 |
|---|---|
| 身高体重不达标 | 咨询儿科医生，评估营养状况 |
| 发育里程碑延迟 | 观察并咨询专业医生 |
| 食欲不振 | 检查是否生病，调整饮食 |
| 睡眠问题 | 建立规律作息，检查环境 |
十二、总结
儿童成长记录应用通过"科学育儿助手"的核心理念，为家长提供了一款专业的儿童成长发育管理工具。应用涵盖儿童信息管理、成长记录、成长曲线、发育评估、育儿建议、里程碑管理六大核心功能，帮助家长科学记录和分析孩子的成长数据。
应用采用绿色主题，象征生命与成长。主页面清晰展示儿童信息卡片、成长变化统计、发育评估和育儿建议。成长页面展示成长曲线图表和记录列表，让家长直观了解孩子的成长趋势。发育页面展示各发育里程碑的完成情况，帮助家长关注孩子的全面发展。
成长曲线采用CustomPainter绘制，支持身高和体重双曲线展示，让家长直观看到孩子的成长轨迹。发育评估基于里程碑完成度进行等级评定，从优秀到建议咨询五个等级，帮助家长了解孩子的发育状况。
育儿建议根据儿童年龄段智能匹配，为不同阶段的家长提供针对性的育儿指导。从婴儿期的母乳喂养、睡眠管理，到幼儿期的均衡营养、运动发展，再到学龄前期的创造力培养、社交能力，覆盖了儿童成长的关键领域。
应用采用Material Design 3设计规范，遵循Flutter最佳实践，代码结构清晰，易于维护和扩展。后续版本计划增加数据持久化、WHO标准对比、疫苗记录、多儿童管理、专业咨询等功能，为家长提供更完整的儿童成长管理体验。
通过儿童成长记录应用，家长可以科学记录孩子的成长历程，及时发现发育问题，获得专业的育儿指导，陪伴孩子健康成长。
记录成长，陪伴未来 👶
开源鸿蒙跨平台开发社区汇聚开发者与厂商，共建“一次开发，多端部署”的开源生态，致力于降低跨端开发门槛，推动万物智联创新。
更多推荐
7
0- 0
已为社区贡献20条内容
所有评论(0)