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 整体架构图

Business Logic
Data Layer
Presentation Layer
首页

概览
记录页
放松页
统计页
StressRecord

压力记录模型
RelaxationSession

放松会话模型
MoodType

心情类型枚举
RelaxationType

放松方式枚举
压力记录管理
呼吸动画控制
数据统计分析
放松练习引导
AnimationController
Timer

2.2 类图设计

manages
manages
has
has
contains
StressManagementApp
+Widget build()
HomePage
-int _currentIndex
-List<StressRecord> _records
-List<RelaxationSession> _sessions
-int _currentStressLevel
-MoodType _currentMood
-AnimationController _breathingController
-bool _isBreathing
+Widget build()
-void _addRecord()
-void _startBreathing()
-void _stopBreathing()
StressRecord
+String id
+int stressLevel
+MoodType mood
+String? note
+List<String> triggers
+DateTime createdAt
RelaxationSession
+String id
+RelaxationType type
+int durationMinutes
+DateTime createdAt
<<enumeration>>
MoodType
veryHappy
happy
neutral
sad
verySad
+String moodName
+String moodEmoji
+Color moodColor
<<enumeration>>
RelaxationType
breathing
meditation
muscle
music
exercise
+String typeName
+String typeDescription
+IconData typeIcon
+Color typeColor

2.3 呼吸练习流程

点击开始
4秒后
7秒后
8秒后
立即
点击停止
点击停止
点击停止
点击停止
待开始
吸气
屏息1
呼气
屏息2

2.4 数据流程图

记录压力
开始放松
查看统计
用户操作
操作类型
创建StressRecord
创建RelaxationSession
计算统计数据
更新记录列表
更新会话列表
渲染图表
刷新UI

三、核心模块设计

3.1 数据模型设计

3.1.1 压力记录模型 (StressRecord)

dart 复制代码

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)

dart 复制代码

class RelaxationSession {
  final String id;                 // 唯一标识
  final RelaxationType type;       // 放松方式
  final int durationMinutes;       // 时长(分钟)
  final DateTime createdAt;        // 创建时间
}

3.1.3 心情类型枚举 (MoodType)

30% 25% 20% 15% 10% 心情分布示例非常开心 😄 开心 😊 一般 😐 难过 😢 非常难过 😭

dart 复制代码

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 首页模块

首页 _buildHomePage
头部卡片
快捷操作
今日状态
本周趋势图
应用标题
统计数据
记录压力
开始放松
压力等级
心情状态
记录时间
CustomPaint图表

3.2.2 压力记录弹窗

复制代码

┌─────────────────────────────────────────────────┐
│                  ─────                          │
│                                                 │
│   记录当前状态                                   │
│                                                 │
│   压力等级                                       │
│   低 ━━━━━━━━━━━●━━━━━━ 高                      │
│              5 / 10                             │
│                                                 │
│   心情状态                                       │
│   [😄]  [😊]  [😐]  [😢]  [😭]                  │
│  非常   开心   一般   难过  非常                  │
│  开心                     难过                   │
│                                                 │
│   ┌─────────────────────────────────────────┐   │
│   │           保存记录                       │   │
│   └─────────────────────────────────────────┘   │
└─────────────────────────────────────────────────┘

3.2.3 呼吸练习界面

复制代码

┌─────────────────────────────────────────────────┐
│              4-7-8 呼吸法                        │
│        吸气4秒 → 屏息7秒 → 呼气8秒               │
│                                                 │
│                   ┌───────┐                     │
│                   │       │                     │
│                   │  🌬️   │ ← 动画缩放          │
│                   │ 吸气  │                     │
│                   │       │                     │
│                   └───────┘                     │
│                                                 │
│           ┌──────────────────┐                  │
│           │   开始呼吸练习    │                  │
│           └──────────────────┘                  │
└─────────────────────────────────────────────────┘

3.3 核心功能实现

3.3.1 呼吸动画控制

dart 复制代码

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 压力等级颜色映射

dart 复制代码

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 统计数据计算

dart 复制代码

// 平均压力等级
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	主要文字

心情颜色映射：

dart 复制代码

// 非常开心 - 绿色
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 统计进度条

dart 复制代码

LinearProgressIndicator(
  value: percentage,
  backgroundColor: Colors.grey.shade200,
  valueColor: AlwaysStoppedAnimation<Color>(mood.moodColor),
  minHeight: 6,
  borderRadius: BorderRadius.circular(3),
)

五、图表绘制

5.1 压力趋势图

使用 CustomPainter 绘制本周压力趋势：

dart 复制代码

class StressChartPainter extends CustomPainter {
  final List<StressRecord> records;

  @override
  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秒
屏息0秒

原理说明：

吸气4秒：充分吸入氧气
屏息7秒：让氧气充分进入血液
呼气8秒：缓慢释放，激活副交感神经
循环4次：达到放松效果

6.2 压力等级评估

等级	描述	建议
1-3	低压力	保持当前状态
4-5	中等压力	适当放松
6-7	较高压力	需要关注
8-10	高压力	建议寻求帮助

七、扩展功能规划

7.1 后续版本规划

2024-01-07 2024-01-14 2024-01-21 2024-01-28 2024-02-04 2024-02-11 2024-02-18 2024-02-25 2024-03-03 2024-03-10 2024-03-17 2024-03-24 2024-03-31 压力记录功能呼吸练习功能数据统计功能提醒功能心理测评数据导出社区分享专业建议 AI助手 V1.0 基础版本 V1.1 增强版本 V1.2 进阶版本压力管理助手开发计划

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 运行命令

bash 复制代码

# 查看可用设备
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等多平台运行，具有良好的跨平台兼容性。

核心功能包括压力记录、呼吸练习、放松指导、数据统计等，满足了压力管理的基本需求。后续版本将陆续推出定时提醒、心理测评、专业资源等增强功能，进一步提升用户体验。

通过本应用，希望能够帮助更多人关注心理健康，学会正确管理压力，保持身心健康平衡。