Flutter 框架跨平台鸿蒙开发 - 压力管理助手应用
运行效果图压力管理助手是一款关注用户心理健康的自我管理工具,旨在帮助用户记录压力状态、学习放松技巧、追踪情绪变化。在快节奏的现代生活中,压力已成为影响身心健康的重要因素,本应用通过科学的方法帮助用户认识和管理压力,提升生活质量。现代社会节奏快、竞争激烈,工作压力、生活压力、学业压力无处不在。长期的压力积累会导致焦虑、抑郁、失眠等问题,严重影响身心健康。本应用通过压力记录、放松练习、数据分析等功能,
压力管理助手应用
欢迎加入开源鸿蒙跨平台社区: https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图



1.1 应用简介
压力管理助手是一款关注用户心理健康的自我管理工具,旨在帮助用户记录压力状态、学习放松技巧、追踪情绪变化。在快节奏的现代生活中,压力已成为影响身心健康的重要因素,本应用通过科学的方法帮助用户认识和管理压力,提升生活质量。
现代社会节奏快、竞争激烈,工作压力、生活压力、学业压力无处不在。长期的压力积累会导致焦虑、抑郁、失眠等问题,严重影响身心健康。本应用通过压力记录、放松练习、数据分析等功能,帮助用户建立健康的压力管理习惯,让身心得到放松和恢复。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 压力记录 | 记录当前压力等级和心情状态 | Slider + 表情选择 |
| 呼吸练习 | 4-7-8呼吸法动画引导 | AnimationController + Timer |
| 放松指导 | 多种放松方式的步骤说明 | DraggableScrollableSheet |
| 数据统计 | 压力趋势和心情分布分析 | CustomPaint + 图表 |
| 周报告 | 本周压力变化趋势图 | 自定义Canvas绘制 |
1.3 心情类型
| 心情 | 表情 | 颜色 | 描述 |
|---|---|---|---|
| 非常开心 | 😄 | 绿色 | 心情愉悦,压力很小 |
| 开心 | 😊 | 浅绿色 | 状态良好,压力可控 |
| 一般 | 😐 | 琥珀色 | 平静状态,有轻微压力 |
| 难过 | 😢 | 橙色 | 情绪低落,压力较大 |
| 非常难过 | 😭 | 红色 | 情绪很差,需要关注 |
1.4 放松方式
| 类型 | 描述 | 时长建议 |
|---|---|---|
| 深呼吸 | 4-7-8呼吸法,快速缓解紧张 | 5分钟 |
| 冥想 | 正念冥想,让心灵回归平静 | 10-15分钟 |
| 肌肉放松 | 渐进式肌肉放松,释放身体压力 | 15-20分钟 |
| 舒缓音乐 | 聆听舒缓音乐,放松身心 | 15-30分钟 |
| 轻度运动 | 简单拉伸运动,缓解身体疲劳 | 10-15分钟 |
1.5 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 状态管理 | setState | - |
| 动画 | AnimationController | - |
| 目标平台 | 鸿蒙OS | API 21+ |
1.6 项目结构
lib/
└── main_stress_management.dart
├── StressManagementApp # 应用入口
├── MoodType # 心情类型枚举
├── RelaxationType # 放松方式枚举
├── StressRecord # 压力记录模型
├── RelaxationSession # 放松会话模型
├── HomePage # 主页面
│ ├── _buildHomePage() # 首页
│ ├── _buildRecordPage() # 记录页
│ ├── _buildRelaxationPage()# 放松页
│ └── _buildStatsPage() # 统计页
├── StressChartPainter # 图表绘制
└── 辅助方法
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 呼吸练习流程
2.4 数据流程图
三、核心模块设计
3.1 数据模型设计
3.1.1 压力记录模型 (StressRecord)
class StressRecord {
final String id; // 唯一标识
final int stressLevel; // 压力等级(1-10)
final MoodType mood; // 心情类型
final String? note; // 备注
final List<String> triggers; // 压力触发因素
final DateTime createdAt; // 创建时间
}
3.1.2 放松会话模型 (RelaxationSession)
class RelaxationSession {
final String id; // 唯一标识
final RelaxationType type; // 放松方式
final int durationMinutes; // 时长(分钟)
final DateTime createdAt; // 创建时间
}
3.1.3 心情类型枚举 (MoodType)
enum MoodType {
veryHappy, // 非常开心 😄
happy, // 开心 😊
neutral, // 一般 😐
sad, // 难过 😢
verySad, // 非常难过 😭
}
extension MoodTypeExtension on MoodType {
String get moodName { /* 心情名称 */ }
String get moodEmoji { /* 表情符号 */ }
Color get moodColor { /* 对应颜色 */ }
}
3.1.4 放松方式枚举 (RelaxationType)
| 放松方式 | 英文标识 | 图标 | 颜色 | 核心效果 |
|---|---|---|---|---|
| 深呼吸 | breathing | air | 青色 | 快速缓解紧张 |
| 冥想 | meditation | self_improvement | 紫色 | 心灵平静 |
| 肌肉放松 | muscle | accessibility_new | 橙色 | 释放身体压力 |
| 舒缓音乐 | music | music_note | 粉色 | 放松身心 |
| 轻度运动 | exercise | fitness_center | 绿色 | 缓解疲劳 |
3.2 页面结构设计
3.2.1 首页模块
3.2.2 压力记录弹窗
┌─────────────────────────────────────────────────┐
│ ───── │
│ │
│ 记录当前状态 │
│ │
│ 压力等级 │
│ 低 ━━━━━━━━━━━●━━━━━━ 高 │
│ 5 / 10 │
│ │
│ 心情状态 │
│ [😄] [😊] [😐] [😢] [😭] │
│ 非常 开心 一般 难过 非常 │
│ 开心 难过 │
│ │
│ ┌─────────────────────────────────────────┐ │
│ │ 保存记录 │ │
│ └─────────────────────────────────────────┘ │
└─────────────────────────────────────────────────┘
3.2.3 呼吸练习界面
┌─────────────────────────────────────────────────┐
│ 4-7-8 呼吸法 │
│ 吸气4秒 → 屏息7秒 → 呼气8秒 │
│ │
│ ┌───────┐ │
│ │ │ │
│ │ 🌬️ │ ← 动画缩放 │
│ │ 吸气 │ │
│ │ │ │
│ └───────┘ │
│ │
│ ┌──────────────────┐ │
│ │ 开始呼吸练习 │ │
│ └──────────────────┘ │
└─────────────────────────────────────────────────┘
3.3 核心功能实现
3.3.1 呼吸动画控制
void _startBreathing() {
setState(() {
_isBreathing = true;
_breathingPhase = 0;
});
_breathingController.repeat(reverse: true);
_runBreathingCycle();
}
void _runBreathingCycle() {
const durations = [4, 7, 8, 0]; // 吸气、屏息、呼气、屏息
void nextPhase() {
if (!_isBreathing) return;
setState(() {
_breathingPhase = (_breathingPhase + 1) % 4;
});
if (durations[_breathingPhase] > 0) {
_breathingTimer = Timer(
Duration(seconds: durations[_breathingPhase]),
nextPhase
);
} else {
nextPhase();
}
}
setState(() {
_breathingPhase = 0;
});
_breathingTimer = Timer(const Duration(seconds: 4), nextPhase);
}
3.3.2 压力等级颜色映射
Color _getStressColor(int level) {
if (level <= 3) return Colors.green; // 低压力
if (level <= 5) return Colors.amber; // 中等压力
if (level <= 7) return Colors.orange; // 较高压力
return Colors.red; // 高压力
}
3.3.3 统计数据计算
// 平均压力等级
double get _averageStressLevel {
if (_records.isEmpty) return 0;
return _records.map((r) => r.stressLevel).reduce((a, b) => a + b) / _records.length;
}
// 总放松时长
int get _totalRelaxationMinutes {
return _sessions.fold(0, (sum, s) => sum + s.durationMinutes);
}
四、UI设计规范
4.1 配色方案
应用采用柔和的紫色系为主色调,营造平静舒适的氛围:
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | #7C4DFF | AppBar、按钮、强调元素 |
| 渐变起始 | #7C4DFF | 渐变背景 |
| 渐变结束 | #B388FF | 渐变背景 |
| 背景色 | #F8F6FF | 页面背景 |
| 卡片背景 | #FFFFFF | 卡片、弹窗 |
| 文字主色 | #212121 | 主要文字 |
心情颜色映射:
// 非常开心 - 绿色
Colors.green
// 开心 - 浅绿色
Colors.lightGreen
// 一般 - 琥珀色
Colors.amber
// 难过 - 橙色
Colors.orange
// 非常难过 - 红色
Colors.red
4.2 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 页面标题 | 22px | Bold | #FFFFFF |
| 卡片标题 | 18px | Bold | #212121 |
| 统计数字 | 24px | Bold | 主色/对应色 |
| 正文内容 | 14px | Regular | #424242 |
| 辅助信息 | 12px | Regular | #757575 |
4.3 组件规范
4.3.1 压力记录卡片
┌─────────────────────────────────────────────────┐
│ 😊 开心 [压力 5] │
│ 1月15日 14:30 │
│ │
│ [工作压力] [睡眠不足] │
└─────────────────────────────────────────────────┘
4.3.2 放松方式卡片
┌─────────────────────────────────────────────────┐
│ ┌────┐ 深呼吸 ──→ │
│ │ 🌬️ │ 4-7-8呼吸法,快速缓解紧张情绪 │
│ └────┘ │
└─────────────────────────────────────────────────┘
4.3.3 统计进度条
LinearProgressIndicator(
value: percentage,
backgroundColor: Colors.grey.shade200,
valueColor: AlwaysStoppedAnimation<Color>(mood.moodColor),
minHeight: 6,
borderRadius: BorderRadius.circular(3),
)
五、图表绘制
5.1 压力趋势图
使用 CustomPainter 绘制本周压力趋势:
class StressChartPainter extends CustomPainter {
final List<StressRecord> records;
void paint(Canvas canvas, Size size) {
// 绘制折线
final paint = Paint()
..color = const Color(0xFF7C4DFF)
..strokeWidth = 3
..style = PaintingStyle.stroke;
// 绘制填充区域
final fillPaint = Paint()
..color = const Color(0xFF7C4DFF).withOpacity(0.1)
..style = PaintingStyle.fill;
// 绘制数据点
final dotPaint = Paint()
..color = const Color(0xFF7C4DFF)
..style = PaintingStyle.fill;
// 绘制星期标签
final dayLabels = ['一', '二', '三', '四', '五', '六', '日'];
// ...
}
}
5.2 图表示意图
压力等级
10 │
│ ●
8 │ ● ●
│ ● ●
6 │ ●
│
4 │
│
2 │
│
0 └──────────────────
一 二 三 四 五 六 日
六、科学背景
6.1 4-7-8呼吸法
4-7-8呼吸法是由安德鲁·韦尔博士开发的呼吸技巧,基于古老的瑜伽呼吸练习:
原理说明:
- 吸气4秒:充分吸入氧气
- 屏息7秒:让氧气充分进入血液
- 呼气8秒:缓慢释放,激活副交感神经
- 循环4次:达到放松效果
6.2 压力等级评估
| 等级 | 描述 | 建议 |
|---|---|---|
| 1-3 | 低压力 | 保持当前状态 |
| 4-5 | 中等压力 | 适当放松 |
| 6-7 | 较高压力 | 需要关注 |
| 8-10 | 高压力 | 建议寻求帮助 |
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 定时提醒
- 每日记录提醒
- 放松练习提醒
- 久坐提醒
7.2.2 心理测评
- 抑郁自评量表(SDS)
- 焦虑自评量表(SAS)
- 压力感知量表(PSS)
7.2.3 专业资源
- 心理咨询热线
- 放松音乐库
- 冥想课程
八、注意事项
8.1 开发注意事项
-
动画资源释放:在 dispose 中释放 AnimationController 和 Timer
-
状态管理:使用 setState 更新UI,避免不必要的重建
-
数据持久化:后续版本需添加本地存储功能
-
隐私保护:压力数据属于敏感信息,需注意保护
8.2 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 动画不停止 | Timer未取消 | 在stop方法中取消Timer |
| 图表不显示 | 数据为空 | 添加空数据判断 |
| 状态不更新 | 未调用setState | 确保在setState中更新 |
九、运行说明
9.1 环境要求
| 环境 | 版本要求 |
|---|---|
| Flutter SDK | >= 3.0.0 |
| Dart SDK | >= 2.17.0 |
| 鸿蒙OS | API 21+ |
9.2 运行命令
# 查看可用设备
flutter devices
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 -t lib/main_stress_management.dart
# 运行到Windows
flutter run -d windows -t lib/main_stress_management.dart
# 代码分析
flutter analyze lib/main_stress_management.dart
十、总结
压力管理助手通过科学的压力记录和放松练习功能,帮助用户建立健康的压力管理习惯。应用采用Flutter框架开发,支持鸿蒙OS等多平台运行,具有良好的跨平台兼容性。
核心功能包括压力记录、呼吸练习、放松指导、数据统计等,满足了压力管理的基本需求。后续版本将陆续推出定时提醒、心理测评、专业资源等增强功能,进一步提升用户体验。
通过本应用,希望能够帮助更多人关注心理健康,学会正确管理压力,保持身心健康平衡。
更多推荐


所有评论(0)