Flutter 框架跨平台鸿蒙开发 - 心理健康测试应用开发文档
摘要: 心理健康测试应用是一款基于Flutter框架开发的跨平台工具,提供6种专业心理评估(焦虑、抑郁、压力等),每项测试包含7道标准化题目。用户完成测试后,系统自动计算得分并生成四个等级(正常至重度)的评估报告,附带个性化建议。应用采用Material Design 3设计规范,包含测试列表、答题进度、历史记录三大功能模块,技术栈包括Dart语言和鸿蒙OS兼容支持。项目结构清晰分层,通过状态管理
欢迎加入开源鸿蒙跨平台社区:
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图




1.1 应用简介
心理健康测试是一款专注于心理健康评估与自我认知的移动应用,为用户提供科学、便捷的心理健康自测工具。随着现代社会生活节奏加快,心理健康问题日益受到关注。本应用帮助用户了解自身心理状态,及时发现潜在问题,为心理健康管理提供参考依据。
应用涵盖六大心理测试类型:焦虑自评、抑郁自评、压力感知、睡眠质量、自尊水平、社交焦虑,每种测试都经过专业量表改编,包含多道标准化题目。测试结果根据得分自动评估严重程度,并提供个性化的建议措施,帮助用户科学认识自身心理状态。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 测试列表 | 展示六大心理测试类型 | ListView + Card |
| 测试答题 | 逐题答题,进度显示 | PageView + 状态管理 |
| 结果评估 | 自动计算得分与等级 | 算法计算 |
| 建议生成 | 根据结果提供个性化建议 | 预设规则 |
| 历史记录 | 保存测试历史,支持查看 | 本地列表 |
| 结果详情 | 完整展示测试结果分析 | 详情页面 |
1.3 测试类型
| 测试类型 | 中文名称 | 题目数量 | 评估维度 |
|---|---|---|---|
| anxiety | 焦虑自评量表 | 7题 | 焦虑程度 |
| depression | 抑郁自评量表 | 7题 | 抑郁倾向 |
| stress | 压力感知量表 | 7题 | 压力水平 |
| sleep | 睡眠质量评估 | 7题 | 睡眠状况 |
| selfEsteem | 自尊水平测试 | 7题 | 自我认知 |
| socialAnxiety | 社交焦虑测试 | 7题 | 社交状态 |
1.4 严重程度分级
| 等级 | 中文名称 | 分数范围 | 说明 |
|---|---|---|---|
| normal | 正常 | 0-25% | 心理状态良好 |
| mild | 轻度 | 26-50% | 轻微心理困扰 |
| moderate | 中度 | 51-75% | 中度心理困扰 |
| severe | 重度 | 76-100% | 较严重心理困扰 |
1.5 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 状态管理 | setState | - |
| 目标平台 | 鸿蒙OS | API 21+ |
1.6 项目结构
lib/
└── main_mental_health.dart
├── MentalHealthApp # 应用入口
├── TestType # 测试类型枚举
├── SeverityLevel # 严重程度枚举
├── TestQuestion # 测试题目模型
├── TestDefinition # 测试定义模型
├── TestResult # 测试结果模型
├── MentalHealthPage # 主页面
│ ├── _buildTestsPage() # 测试列表页
│ ├── _buildHistoryPage() # 历史记录页
│ ├── _buildTestCard() # 测试卡片
│ └── _buildHistoryCard() # 历史卡片
├── TestTakingPage # 答题页面
│ ├── _buildProgressIndicator() # 进度指示器
│ ├── _buildQuestionPage() # 题目页面
│ └── _buildNavigationButtons() # 导航按钮
└── TestResultPage # 结果页面
├── _buildResultHeader() # 结果头部
├── _buildScoreCard() # 得分卡片
├── _buildInterpretationCard() # 解读卡片
└── _buildSuggestionsCard() # 建议卡片
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 数据流程图
2.4 测试评分流程
三、核心模块设计
3.1 数据模型设计
3.1.1 测试类型枚举 (TestType)
enum TestType {
anxiety, // 焦虑测试
depression, // 抑郁测试
stress, // 压力测试
sleep, // 睡眠质量
selfEsteem, // 自尊测试
socialAnxiety,// 社交焦虑
}
3.1.2 测试类型属性映射
| 类型 | 中文名称 | 表情符号 | 主题颜色 |
|---|---|---|---|
| anxiety | 焦虑测试 | 😰 | 橙色 |
| depression | 抑郁测试 | 😔 | 蓝色 |
| stress | 压力测试 | 😫 | 红色 |
| sleep | 睡眠质量 | 😴 | 靛蓝色 |
| selfEsteem | 自尊测试 | 💪 | 紫色 |
| socialAnxiety | 社交焦虑 | 🤝 | 青色 |
3.1.3 严重程度枚举 (SeverityLevel)
enum SeverityLevel {
normal, // 正常
mild, // 轻度
moderate, // 中度
severe, // 重度
}
3.1.4 测试题目模型 (TestQuestion)
class TestQuestion {
final String id; // 题目ID
final String question; // 题目内容
final List<String> options; // 选项列表
final List<int> scores; // 各选项得分
}
3.1.5 测试定义模型 (TestDefinition)
class TestDefinition {
final String id; // 测试ID
final String name; // 测试名称
final TestType type; // 测试类型
final String description; // 测试描述
final int questionCount; // 题目数量
final List<TestQuestion> questions; // 题目列表
final String emoji; // 表情符号
String get typeName; // 类型中文名
Color get typeColor; // 类型主题色
}
3.1.6 测试结果模型 (TestResult)
class TestResult {
final String id; // 结果ID
final TestDefinition test; // 关联测试
final int totalScore; // 总得分
final int maxScore; // 满分
final SeverityLevel severity; // 严重程度
final String interpretation; // 结果解读
final List<String> suggestions; // 建议措施
final DateTime completedAt; // 完成时间
String get severityText; // 程度中文名
Color get severityColor; // 程度主题色
double get percentage; // 得分百分比
}
3.2 评分算法
3.2.1 得分计算流程
3.2.2 得分计算实现
void _submitTest() {
int totalScore = 0;
for (int i = 0; i < widget.test.questions.length; i++) {
final question = widget.test.questions[i];
final answerIndex = _answers[i] ?? 0;
totalScore += question.scores[answerIndex];
}
final maxScore = widget.test.questions.length * 3;
final percentage = totalScore / maxScore;
// 根据百分比判断严重程度
SeverityLevel severity;
if (percentage <= 0.25) {
severity = SeverityLevel.normal;
} else if (percentage <= 0.5) {
severity = SeverityLevel.mild;
} else if (percentage <= 0.75) {
severity = SeverityLevel.moderate;
} else {
severity = SeverityLevel.severe;
}
}
3.2.3 严重程度判断规则
| 百分比范围 | 严重程度 | 说明 |
|---|---|---|
| 0-25% | 正常 | 心理状态良好 |
| 26-50% | 轻度 | 轻微心理困扰 |
| 51-75% | 中度 | 中度心理困扰 |
| 76-100% | 重度 | 较严重心理困扰 |
3.3 答题页面设计
3.3.1 页面结构
3.3.2 答题状态管理
class _TestTakingPageState extends State<TestTakingPage> {
int _currentQuestionIndex = 0; // 当前题目索引
final Map<int, int> _answers = {}; // 答案记录(题目索引 -> 选项索引)
late PageController _pageController; // 页面控制器
void _selectAnswer(int questionIndex, int optionIndex) {
setState(() {
_answers[questionIndex] = optionIndex;
});
}
void _nextQuestion() {
if (_currentQuestionIndex < widget.test.questions.length - 1) {
_pageController.nextPage(...);
setState(() {
_currentQuestionIndex++;
});
}
}
}
3.4 页面结构设计
3.4.1 主页面布局
3.5 状态管理
3.5.1 核心状态变量
class _MentalHealthPageState extends State<MentalHealthPage> {
final List<TestDefinition> _tests = []; // 所有测试
final List<TestResult> _history = []; // 测试历史
int _currentIndex = 0; // 当前Tab索引
}
class _TestTakingPageState extends State<TestTakingPage> {
int _currentQuestionIndex = 0; // 当前题目索引
final Map<int, int> _answers = {}; // 答案记录
late PageController _pageController; // 页面控制器
}
四、UI设计规范
4.1 配色方案
应用采用青色主题风格,体现心理健康的平静与关怀:
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | Teal | AppBar、按钮、强调 |
| 正常 | Green | 正常状态标识 |
| 轻度 | LightGreen | 轻度状态标识 |
| 中度 | Orange | 中度状态标识 |
| 重度 | Red | 重度状态标识 |
4.2 测试类型样式
4.2.1 测试卡片
┌─────────────────────────────────────────────────────────────┐
│ ┌────┐ 焦虑自评量表 > │
│ │ 😰 │ 评估您近期的焦虑程度,帮助了解焦虑状态。 │
│ └────┘ │
│ 📋 7道题目 ⏱️ 约210秒 │
└─────────────────────────────────────────────────────────────┘
4.2.2 严重程度标签
| 等级 | 颜色 | 说明 |
|---|---|---|
| 正常 | 绿色 | 心理状态良好 |
| 轻度 | 浅绿色 | 需要关注 |
| 中度 | 橙色 | 建议咨询 |
| 重度 | 红色 | 强烈建议咨询 |
4.3 组件规范
4.3.1 答题选项
┌─────────────────────────────────────────────────────────────┐
│ ○ A 没有或很少 │
├─────────────────────────────────────────────────────────────┤
│ ○ B 有时 │
├─────────────────────────────────────────────────────────────┤
│ ● C 经常 ← 选中状态 │
├─────────────────────────────────────────────────────────────┤
│ ○ D 总是 │
└─────────────────────────────────────────────────────────────┘
4.3.2 结果页面
┌─────────────────────────────────────────────────────────────┐
│ 😰 │
│ 焦虑自评量表 │
│ [轻度] │
├─────────────────────────────────────────────────────────────┤
│ 得分: 10/21 百分比: 48% 等级: 轻度 │
│ ████████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ │
├─────────────────────────────────────────────────────────────┤
│ 🧠 结果解读 │
│ 您有轻微的心理困扰,建议关注自身情绪变化。 │
├─────────────────────────────────────────────────────────────┤
│ 💡 建议措施 │
│ ① 尝试放松练习,如深呼吸、冥想 │
│ ② 保证充足的睡眠 │
│ ③ 适当减少压力源 │
│ ④ 如持续不适,建议咨询专业人士 │
├─────────────────────────────────────────────────────────────┤
│ ⚠️ 本测试仅供参考,不能替代专业诊断。 │
└─────────────────────────────────────────────────────────────┘
4.4 交互设计
4.4.1 操作方式
| 操作 | 手势 | 效果 |
|---|---|---|
| 开始测试 | 点击测试卡片 | 跳转答题页面 |
| 选择答案 | 点击选项 | 记录答案,高亮选项 |
| 下一题 | 点击按钮 | 翻页到下一题 |
| 上一题 | 点击按钮 | 翻页到上一题 |
| 提交测试 | 点击按钮 | 计算结果,跳转结果页 |
| 查看历史 | 点击历史卡片 | 跳转结果页面 |
五、核心功能实现
5.1 主页面构建
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('心理健康测试'),
),
body: _currentIndex == 0 ? _buildTestsPage() : _buildHistoryPage(),
bottomNavigationBar: BottomNavigationBar(
currentIndex: _currentIndex,
onTap: (index) {
setState(() {
_currentIndex = index;
});
},
items: const [
BottomNavigationBarItem(icon: Icon(Icons.psychology), label: '测试'),
BottomNavigationBarItem(icon: Icon(Icons.history), label: '记录'),
],
),
);
}
5.2 答题页面
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(widget.test.name)),
body: Column(
children: [
_buildProgressIndicator(),
Expanded(
child: PageView.builder(
controller: _pageController,
physics: const NeverScrollableScrollPhysics(),
itemCount: widget.test.questions.length,
itemBuilder: (context, index) => _buildQuestionPage(index),
),
),
_buildNavigationButtons(),
],
),
);
}
5.3 选项组件
Widget _buildOption(int questionIndex, int optionIndex, String option) {
final isSelected = _answers[questionIndex] == optionIndex;
return InkWell(
onTap: () => _selectAnswer(questionIndex, optionIndex),
child: Container(
decoration: BoxDecoration(
color: isSelected ? typeColor.withValues(alpha: 0.2) : Colors.grey.shade100,
border: Border.all(
color: isSelected ? typeColor : Colors.transparent,
width: 2,
),
borderRadius: BorderRadius.circular(12),
),
child: Row(
children: [
Container(
width: 28,
height: 28,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: isSelected ? typeColor : Colors.grey.shade300,
),
child: isSelected ? Icon(Icons.check, color: Colors.white) : Text('ABCD'),
),
Text(option),
],
),
),
);
}
5.4 结果页面
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('测试结果')),
body: SingleChildScrollView(
child: Column(
children: [
_buildResultHeader(), // 结果头部(表情、名称、等级)
_buildScoreCard(), // 得分卡片
_buildInterpretationCard(), // 解读卡片
_buildSuggestionsCard(), // 建议卡片
_buildDisclaimerCard(), // 免责声明
],
),
),
);
}
六、心理健康知识拓展
6.1 心理健康维度
6.2 常见心理问题
| 问题类型 | 主要表现 | 建议措施 |
|---|---|---|
| 焦虑症 | 过度担忧、紧张不安、心悸 | 放松训练、认知行为治疗 |
| 抑郁症 | 情绪低落、兴趣减退、疲劳 | 心理咨询、适度运动 |
| 压力过大 | 失眠、焦虑、注意力下降 | 时间管理、压力释放 |
| 睡眠障碍 | 入睡困难、早醒、多梦 | 睡眠卫生、放松技巧 |
| 社交焦虑 | 害怕社交、回避人群 | 渐进暴露、社交训练 |
6.3 心理健康维护建议
6.4 心理援助资源
| 资源类型 | 说明 |
|---|---|
| 心理援助热线 | 全国心理援助热线:400-161-9995 |
| 精神卫生中心 | 各地精神卫生中心 |
| 心理咨询机构 | 专业心理咨询机构 |
| 在线心理平台 | 专业在线心理服务平台 |
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 数据管理
| 功能 | 说明 |
|---|---|
| SQLite存储 | 本地数据库存储测试记录 |
| 用户档案 | 管理个人心理健康档案 |
| 数据导出 | 导出测试记录报告 |
7.2.2 智能功能
| 功能 | 说明 |
|---|---|
| 趋势分析 | 心理状态变化趋势图 |
| AI分析 | 智能心理健康建议 |
| 预警提醒 | 异常状态自动提醒 |
7.2.3 社交功能
| 功能 | 说明 |
|---|---|
| 社区支持 | 心理健康社区交流 |
| 专业咨询 | 对接专业心理咨询服务 |
| 危机干预 | 紧急心理危机干预 |
八、注意事项
8.1 开发注意事项
-
颜色处理:使用
withValues(alpha:)替代已废弃的withOpacity() -
PageView控制:禁用滑动手势,使用按钮控制翻页
-
答案记录:使用Map存储答案,支持回退修改
-
免责声明:结果页面必须显示免责声明
8.2 用户体验优化
💡 用户体验建议 💡
- 测试类型清晰明了
- 答题进度实时显示
- 结果解读通俗易懂
- 建议措施切实可行
8.3 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 答案未记录 | Map索引错误 | 检查_answers赋值 |
| 翻页异常 | PageController未初始化 | 检查initState |
| 结果计算错误 | 得分累加逻辑错误 | 检查评分算法 |
| 严重程度错误 | 百分比判断错误 | 检查阈值设置 |
8.4 伦理与法律声明
⚠️ 重要声明 ⚠️
本应用提供的测试仅供参考,不能替代专业心理诊断。
测试结果不构成医疗建议,如有心理困扰请咨询专业人士。
应用应明确告知用户测试的局限性,避免造成误导。
九、运行说明
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 lib/main_mental_health.dart
# 运行到Windows
flutter run -d windows -t lib/main_mental_health.dart
# 代码分析
flutter analyze lib/main_mental_health.dart
十、总结
心理健康测试应用通过科学的心理测评工具,帮助用户了解自身心理状态。应用涵盖六大心理测试类型,每种测试都经过专业量表改编,包含标准化题目和评分规则。测试结果根据得分自动评估严重程度,并提供个性化的建议措施。
答题页面采用逐题翻页设计,进度指示器实时显示答题进度,选项组件支持单选高亮。结果页面完整展示测试结果,包括得分、百分比、严重程度、结果解读和建议措施,帮助用户全面了解自身心理状态。
界面设计采用青色主题风格,体现心理健康的平静与关怀。严重程度采用四级颜色标识,正常/轻度/中度/重度分别对应绿/浅绿/橙/红色,视觉层次分明。应用采用Material Design 3设计规范,遵循Flutter最佳实践,代码结构清晰,易于维护和扩展。
关注心理健康,从自我认知开始!
更多推荐

所有评论(0)