欢迎加入开源鸿蒙跨平台社区:
https://openharmonycrossplatform.csdn.net

一、项目概述

运行效果图

image-20260408220000272

image-20260408220006674

image-20260408220012367

image-20260408220016919

image-20260408220021036

1.1 应用简介

恐惧清单是一款心理成长类应用,帮助用户列出所有恐惧,并逐一面对克服。通过系统化的恐惧管理,用户可以逐步挑战自己的恐惧,记录面对过程,最终实现个人成长。

应用核心理念:直面恐惧,成就更强大的自己。

恐惧是人类最原始的情感之一,它保护我们远离危险,但也可能限制我们的成长。恐惧清单应用帮助用户正视恐惧,通过科学的方法逐步克服,让每一次面对都成为成长的机会。

1.2 核心功能

功能模块功能描述实现方式
恐惧管理添加、编辑、删除恐惧CRUD操作
分类管理按类型分类恐惧枚举分类
程度评估评估恐惧严重程度四级评估
步骤追踪追踪面对恐惧的进度步骤列表
状态更新更新恐惧面对状态状态枚举
统计分析统计恐惧克服情况数据统计
成就系统解锁克服恐惧成就成就列表

1.3 恐惧分类

序号类型Emoji描述示例
1社交恐惧👥与人交往相关的恐惧公开演讲、社交拒绝
2自然恐惧🌪️自然现象相关的恐惧高空、雷电、水
3动物恐惧🐍动物相关的恐惧蜘蛛、蛇、狗
4情境恐惧🏢特定情境相关的恐惧密闭空间、电梯
5健康恐惧🏥健康相关的恐惧疾病、医疗
6失败恐惧📉失败相关的恐惧尝试新事物、冒险
7未知恐惧未知事物相关的恐惧黑暗、未来
8其他恐惧📝其他类型的恐惧个人特殊恐惧

1.4 恐惧程度

程度Emoji等级描述建议
轻微🌱1可以轻松面对自行克服
中等🌿2需要一些勇气逐步面对
严重🌳3需要很大勇气系统训练
极度🏔️4需要专业帮助寻求专业支持

1.5 恐惧状态

状态Emoji颜色描述
待面对灰色尚未开始面对
面对中🔥橙色正在积极面对
已克服🏆绿色成功克服恐惧
暂缓⏸️蓝灰暂时搁置

1.6 技术栈

技术领域技术选型版本要求
开发框架Flutter>= 3.0.0
编程语言Dart>= 2.17.0
设计规范Material Design 3-
状态管理setState-
导航控制TabController-
目标平台鸿蒙OS / WebAPI 21+

二、项目结构

lib/
├── main_fear_list.dart    # 应用主入口(~1050行)
│   ├── FearListApp        # 根应用组件
│   ├── FearCategory       # 恐惧分类枚举
│   ├── FearLevel          # 恐惧程度枚举
│   ├── FearStatus         # 恐惧状态枚举
│   ├── Fear               # 恐惧模型
│   ├── FacingStep         # 面对步骤模型
│   ├── Achievement        # 成就模型
│   └── FearListHomePage   # 主页面

三、数据模型

3.1 恐惧分类枚举 (FearCategory)

enum FearCategory {
  social('社交恐惧', '👥', '与人交往相关的恐惧'),
  nature('自然恐惧', '🌪️', '自然现象相关的恐惧'),
  animal('动物恐惧', '🐍', '动物相关的恐惧'),
  situation('情境恐惧', '🏢', '特定情境相关的恐惧'),
  health('健康恐惧', '🏥', '健康相关的恐惧'),
  failure('失败恐惧', '📉', '失败相关的恐惧'),
  unknown('未知恐惧', '❓', '未知事物相关的恐惧'),
  other('其他恐惧', '📝', '其他类型的恐惧');

  final String label;       // 类型名称
  final String icon;        // 代表图标
  final String description; // 类型描述
}

3.2 恐惧程度枚举 (FearLevel)

enum FearLevel {
  mild('轻微', '🌱', 1, '可以轻松面对'),
  moderate('中等', '🌿', 2, '需要一些勇气'),
  severe('严重', '🌳', 3, '需要很大勇气'),
  extreme('极度', '🏔️', 4, '需要专业帮助');

  final String label;       // 程度名称
  final String icon;        // 代表图标
  final int value;          // 数值等级
  final String description; // 程度描述
}

3.3 恐惧状态枚举 (FearStatus)

enum FearStatus {
  pending('待面对', '⏳', Color(0xFF9E9E9E)),
  inProgress('面对中', '🔥', Color(0xFFFF9800)),
  conquered('已克服', '🏆', Color(0xFF4CAF50)),
  postponed('暂缓', '⏸️', Color(0xFF607D8B));

  final String label; // 状态名称
  final String icon;  // 状态图标
  final Color color;  // 状态颜色
}

3.4 恐惧模型 (Fear)

class Fear {
  final String id;              // 唯一标识
  final String title;           // 恐惧名称
  final String description;     // 恐惧描述
  final FearCategory category;  // 恐惧分类
  final FearLevel level;        // 恐惧程度
  final FearStatus status;      // 恐惧状态
  final DateTime createdAt;     // 创建时间
  final DateTime? conqueredAt;  // 克服时间
  final List<FacingStep> steps; // 面对步骤
  final int completedSteps;     // 已完成步骤数
  final String? notes;          // 备注
}

3.5 面对步骤模型 (FacingStep)

class FacingStep {
  final String id;           // 唯一标识
  final String title;        // 步骤标题
  final String description;  // 步骤描述
  final bool isCompleted;    // 是否完成
  final DateTime? completedAt; // 完成时间
}

3.6 成就模型 (Achievement)

class Achievement {
  final String id;            // 唯一标识
  final String title;         // 成就名称
  final String description;   // 成就描述
  final String icon;          // 成就图标
  final bool isUnlocked;      // 是否解锁
  final DateTime? unlockedAt; // 解锁时间
}

3.7 数据流转图

添加恐惧

选择分类

评估程度

生成步骤

开始面对

完成步骤

全部完成?

标记克服

解锁成就


四、核心功能实现

4.1 添加恐惧

void _addFear() {
  if (_fearTitleController.text.isEmpty) return;

  setState(() {
    _fears.insert(
      0,
      Fear(
        id: DateTime.now().millisecondsSinceEpoch.toString(),
        title: _fearTitleController.text,
        description: _fearDescController.text.isEmpty
            ? '暂无描述'
            : _fearDescController.text,
        category: _selectedCategory,
        level: _selectedLevel,
        status: FearStatus.pending,
        createdAt: DateTime.now(),
        steps: _generateDefaultSteps(_selectedCategory),
        completedSteps: 0,
      ),
    );
  });
}

4.2 生成默认步骤

根据恐惧类型自动生成面对步骤:

List<FacingStep> _generateDefaultSteps(FearCategory category) {
  switch (category) {
    case FearCategory.social:
      return [
        FacingStep(id: '1', title: '了解恐惧来源', description: '思考为什么害怕'),
        FacingStep(id: '2', title: '小范围尝试', description: '在安全环境中练习'),
        FacingStep(id: '3', title: '逐步扩大范围', description: '挑战更大的场合'),
      ];
    case FearCategory.animal:
      return [
        FacingStep(id: '1', title: '看图片或视频', description: '从视觉开始脱敏'),
        FacingStep(id: '2', title: '远距离观察', description: '保持安全距离'),
        FacingStep(id: '3', title: '近距离接触', description: '在专业人士指导下'),
      ];
    // ... 其他类型
  }
}

4.3 完成步骤

void _completeStep(Fear fear, int stepIndex) {
  setState(() {
    final index = _fears.indexWhere((f) => f.id == fear.id);
    if (index != -1) {
      final steps = List<FacingStep>.from(fear.steps);
      steps[stepIndex] = FacingStep(
        id: steps[stepIndex].id,
        title: steps[stepIndex].title,
        description: steps[stepIndex].description,
        isCompleted: true,
        completedAt: DateTime.now(),
      );

      int completedCount = steps.where((s) => s.isCompleted).length;

      FearStatus newStatus = fear.status;
      if (completedCount == steps.length) {
        newStatus = FearStatus.conquered;
      } else if (fear.status == FearStatus.pending) {
        newStatus = FearStatus.inProgress;
      }

      _fears[index] = Fear(
        id: fear.id,
        // ... 更新其他字段
        status: newStatus,
        steps: steps,
        completedSteps: completedCount,
      );
    }
  });
}

4.4 更新恐惧状态

void _updateFearStatus(Fear fear, FearStatus newStatus) {
  setState(() {
    final index = _fears.indexWhere((f) => f.id == fear.id);
    if (index != -1) {
      _fears[index] = Fear(
        id: fear.id,
        title: fear.title,
        description: fear.description,
        category: fear.category,
        level: fear.level,
        status: newStatus,
        createdAt: fear.createdAt,
        conqueredAt: newStatus == FearStatus.conquered ? DateTime.now() : null,
        steps: fear.steps,
        completedSteps: fear.completedSteps,
        notes: fear.notes,
      );
    }
  });
}

五、恐惧分类详解

5.1 社交恐惧 👥

属性描述
定义与人交往时产生的恐惧和焦虑
常见表现公开演讲、社交拒绝、被评价
面对策略渐进式暴露、认知重构
推荐步骤了解来源→小范围尝试→逐步扩大

典型恐惧示例:

恐惧程度面对步骤
公开演讲严重镜前练习→家人面前→小组发言→演讲俱乐部
社交拒绝中等陌生人打招呼→邀请朋友→表达真实想法
被评价中等接受小批评→主动寻求反馈→公开分享

5.2 自然恐惧 🌪️

属性描述
定义对自然现象产生的恐惧
常见表现高空、雷电、水、火
面对策略知识学习、渐进式接触
推荐步骤了解现象→渐进接触→安全体验

5.3 动物恐惧 🐍

属性描述
定义对特定动物产生的恐惧
常见表现蜘蛛、蛇、狗、昆虫
面对策略系统脱敏疗法
推荐步骤图片→视频→远距离→近距离

5.4 失败恐惧 📉

属性描述
定义害怕尝试新事物因为担心失败
常见表现不敢冒险、完美主义、拖延
面对策略重构失败认知、小风险尝试
推荐步骤列出结果→小失败尝试→学习成长

六、UI设计

6.1 色彩系统

应用以蓝灰色为主色调,营造沉稳内敛的氛围:

颜色类型色值用途
背景渐变1#263238深蓝灰
背景渐变2#37474F中蓝灰
背景渐变3#455A64浅蓝灰
主色调#37474F蓝灰
强调色#78909C浅蓝灰
文字主色#FFFFFF白色

6.2 状态配色

状态颜色色值意象
待面对灰色#9E9E9E静止等待
面对中橙色#FF9800积极行动
已克服绿色#4CAF50成功达成
暂缓蓝灰#607D8B暂时搁置

6.3 页面结构

┌─────────────────────────────────────┐
│  🦁 恐惧清单                        │  ← 标题栏
│  列出所有恐惧,逐一面对             │
├─────────────────────────────────────┤
│  [⏳待面对:2] [🔥面对中:1] [🏆已克服:2]│  ← 统计卡片
├─────────────────────────────────────┤
│  [恐惧清单] [统计] [成就]          │  ← Tab栏
├─────────────────────────────────────┤
│  🔥 正在面对  1                     │
│  ┌─────────────────────────────┐  │
│  │ 👥 公开演讲        [🔥面对中]│  │
│  │ 在众人面前讲话时感到紧张...  │  ← 恐惧卡片
│  │ 🌳 严重  ████░░░░ 2/4       │  │
│  └─────────────────────────────┘  │
│  ⏳ 待面对  2                       │
│  ┌─────────────────────────────┐  │
│  │ 🌪️ 高空恐惧        [⏳待面对]│  │
│  │ 站在高处时感到眩晕和恐惧     │  │
│  │ 🌿 中等  ░░░░░░░░ 0/3       │  │
│  └─────────────────────────────┘  │
└─────────────────────────────────────┘

6.4 详情页面结构

┌─────────────────────────────────────┐
│  👥 公开演讲                  🗑️   │  ← 标题和删除
│  [🔥 面对中]                        │
│  在众人面前讲话时感到紧张和恐惧     │  ← 描述
├─────────────────────────────────────┤
│  [🌳严重] [📅30天前] [🏆已克服]    │  ← 信息标签
├─────────────────────────────────────┤
│  面对步骤                           │
│  ✓ ① 在镜子前练习演讲              │  ← 步骤列表
│  ✓ ② 在家人面前演讲                │
│  ○ ③ 在小组会议上发言              │
│  ○ ④ 参加演讲俱乐部                │
├─────────────────────────────────────┤
│  状态更新                           │
│  [⏳待面对] [🔥面对中] [🏆已克服] [⏸️暂缓]│
└─────────────────────────────────────┘

6.5 交互设计

交互元素触发方式响应行为
恐惧卡片点击显示详情弹窗
步骤圆圈点击标记步骤完成
状态按钮点击更新恐惧状态
添加按钮点击打开添加弹窗
删除按钮点击删除恐惧

七、状态管理

7.1 状态分类

状态类型状态名称说明
恐惧列表_fears所有恐惧数据
成就列表_achievements所有成就数据
选中的恐惧_selectedFear当前查看的恐惧
输入控制器_fearTitleController恐惧名称输入
输入控制器_fearDescController恐惧描述输入
选中分类_selectedCategory当前选择的分类
选中程度_selectedLevel当前选择的程度

7.2 状态流转

添加恐惧

开始面对

全部完成

暂时搁置

继续面对

完成克服

待面对

面对中

已克服

暂缓

7.3 面对流程图

步骤系统 应用 用户 步骤系统 应用 用户 alt [全部完成] [未全部完成] 添加恐惧 生成默认步骤 返回步骤列表 显示恐惧卡片 点击步骤完成 更新步骤状态 检查是否全部完成 更新状态为已克服 显示祝贺消息 更新进度

八、心理学原理

8.1 暴露疗法

恐惧清单应用基于心理学中的暴露疗法原理:

暴露疗法

核心原理

系统脱敏

渐进式暴露

习惯化

实施步骤

建立恐惧层级

学习放松技巧

逐步暴露

效果机制

减少焦虑反应

建立新认知

增强自我效能

8.2 恐惧层级

应用通过步骤系统建立恐惧层级:

F e a r L e v e l = ∑ i = 1 n S t e p i × D i f f i c u l t y i FearLevel = \sum_{i=1}^{n} Step_i \times Difficulty_i FearLevel=i=1nStepi×Difficultyi

其中:

  • S t e p i Step_i Stepi 为第i个步骤
  • D i f f i c u l t y i Difficulty_i Difficultyi 为该步骤的难度系数
  • n n n 为总步骤数

8.3 成长曲线

克服恐惧的成长曲线:

P r o g r e s s ( t ) = P 0 + ( P m a x − P 0 ) × ( 1 − e − k t ) Progress(t) = P_0 + (P_{max} - P_0) \times (1 - e^{-kt}) Progress(t)=P0+(PmaxP0)×(1ekt)

其中:

  • P 0 P_0 P0 为初始恐惧程度
  • P m a x P_{max} Pmax 为最大克服程度
  • k k k 为学习速率
  • t t t 为时间

8.4 心理学价值

价值维度描述
自我认知帮助用户认识自己的恐惧
行为改变通过步骤系统促进行为改变
成长记录记录克服恐惧的成长过程
成就激励通过成就系统激励用户

九、成就系统

9.1 成就列表

成就图标条件难度
勇敢起步🌱添加第一个恐惧简单
直面恐惧🔥开始面对一个恐惧简单
小有成就克服第一个恐惧中等
勇者之路🏆克服5个恐惧困难
无畏战士👑克服10个恐惧极难
社交达人👥克服所有社交恐惧困难
自然之子🌍克服所有自然恐惧困难
极限挑战🏔️克服一个极度恐惧极难

9.2 成就解锁逻辑

void _checkAchievements() {
  int conquered = _fears.where((f) => f.status == FearStatus.conquered).length;

  // 检查"勇者之路"成就
  if (conquered >= 5) {
    _unlockAchievement('4');
  }

  // 检查"无畏战士"成就
  if (conquered >= 10) {
    _unlockAchievement('5');
  }

  // 检查"极限挑战"成就
  bool hasExtremeConquered = _fears.any(
    (f) => f.level == FearLevel.extreme && f.status == FearStatus.conquered
  );
  if (hasExtremeConquered) {
    _unlockAchievement('8');
  }
}

十、性能优化

10.1 渲染优化

优化点实现方式效果
列表渲染ListView.builder按需渲染
Tab切换TabController平滑切换
状态更新setState局部减少重绘
弹窗管理showModalBottomSheet按需创建

10.2 内存管理


void dispose() {
  _tabController.dispose();
  _fearTitleController.dispose();
  _fearDescController.dispose();
  super.dispose();
}

10.3 性能指标

指标目标值实测值
列表滚动60fps60fps
内存占用< 50MB待测试
启动时间< 2s待测试
CPU占用< 15%待测试

十一、常见问题

11.1 问题排查

问题原因解决方案
恐惧不显示列表为空检查_fears列表
步骤无法完成索引错误检查stepIndex
状态不更新setState未调用检查状态更新逻辑
成就不解锁条件未满足检查成就条件

11.2 调试技巧

// 打印恐惧状态
debugPrint('Total fears: ${_fears.length}');
debugPrint('Conquered: ${_fears.where((f) => f.status == FearStatus.conquered).length}');
debugPrint('In progress: ${_fears.where((f) => f.status == FearStatus.inProgress).length}');

// 打印步骤进度
for (var fear in _fears) {
  debugPrint('${fear.title}: ${fear.completedSteps}/${fear.steps.length}');
}

十二、运行说明

12.1 环境要求

环境版本要求
Flutter SDK>= 3.0.0
Dart SDK>= 2.17.0
鸿蒙OSAPI 21+

12.2 运行命令

# 查看可用设备
flutter devices

# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_fear_list.dart

# 运行到Web服务器
flutter run -d web-server -t lib/main_fear_list.dart --web-port 8132

# 运行到Windows
flutter run -d windows -t lib/main_fear_list.dart

# 代码分析
flutter analyze lib/main_fear_list.dart

十三、扩展建议

13.1 功能扩展

功能优先级实现思路
数据持久化本地存储恐惧数据
提醒功能定期提醒面对恐惧
分享功能分享克服经历
社区功能与他人分享经验
专业指导接入心理咨询服务

13.2 设计扩展

方向描述
主题切换多种配色主题
动画效果克服恐惧动画
音效反馈操作音效
振动反馈触觉反馈

13.3 技术扩展

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 恐惧管理 步骤系统 成就系统 数据持久化 提醒功能 分享功能 社区功能 专业指导 高级统计 V1.0 基础版本 V1.1 增强版本 V1.2 社交版本 恐惧清单应用开发计划

十四、总结

恐惧清单应用通过系统化的恐惧管理,帮助用户直面恐惧、逐步克服。应用核心亮点包括:

14.1 核心特色

  1. 8种恐惧分类:全面覆盖各类恐惧类型
  2. 4级程度评估:科学评估恐惧严重程度
  3. 步骤追踪系统:记录面对恐惧的每一步
  4. 状态管理:清晰追踪恐惧面对进度
  5. 成就激励:通过成就系统激励用户

14.2 技术亮点

  • 枚举类型设计:分类、程度、状态使用枚举,代码清晰
  • 步骤系统:灵活的面对步骤管理
  • 进度追踪:实时显示克服进度
  • 成就系统:激励用户持续面对恐惧
  • 统计分析:全面的数据统计展示

14.3 心理学价值

恐惧清单不仅是一个工具应用,更是一个心理成长平台。它基于暴露疗法原理,帮助用户系统化地面对恐惧,记录成长过程,最终实现自我突破。

**直面恐惧,成就更强大的自己!**

愿每一次面对都成为成长的机会 🦁

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐