今日三件事应用

---

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

一、项目概述

运行效果图

1.1 应用简介

今日三件事是一款极简主义的时间管理应用，核心理念是"每天只做三件最重要的事"。这款应用源于一个简单却深刻的时间管理哲学：当我们试图做太多事情时，往往会一事无成；而当我们专注于少数几件重要的事情时，反而能取得更好的成果。

应用强制限制用户每天只能记录3件事，通过这种"约束"帮助用户学会取舍，聚焦真正重要的事项。界面简洁优雅，操作流畅自然，让用户能够快速记录、轻松完成、持续追踪。支持历史记录查看、完成率统计、成就解锁等功能，激励用户养成高效的时间管理习惯。

1.2 核心功能

功能模块	功能描述	实现方式
今日记录	每天最多3件事	列表长度限制
完成标记	点击切换完成状态	动画过渡效果
历史记录	按日期查看过去记录	日期分组展示
统计分析	完成率、连续天数	数据聚合计算
成就系统	4个解锁成就	条件判断解锁
每日提醒	定时提醒记录	系统通知

1.3 设计理念

理念	说明
约束创造价值	限制数量迫使思考优先级
简单即是力量	极简界面减少认知负担
习惯养成	每日提醒+成就激励
数据驱动	统计数据帮助反思改进

1.4 技术栈

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

1.5 项目结构

lib/
└── main_three_things.dart
    ├── ThreeThingsApp           # 应用入口
    ├── MainScreen               # 主屏幕（底部导航）
    ├── TodayPage                # 今日页面
    ├── HistoryPage              # 历史页面
    ├── StatsPage                # 统计页面
    ├── SettingsPage             # 设置页面
    ├── ThingCard                # 事项卡片组件
    ├── DayCard                  # 日期卡片组件
    ├── Thing                    # 事项数据模型
    ├── DayEntry                 # 日期条目模型
    ├── Stats                    # 统计数据模型
    └── ThingStorage             # 存储管理器

---

二、系统架构

2.1 整体架构图

2.2 类图设计

2.3 日期切换流程

---

三、核心模块设计

3.1 数据模型设计

3.1.1 事项模型 (Thing)

class Thing {
  final String id;              // 唯一标识
  final String content;         // 事项内容
  final bool isCompleted;       // 是否完成
  final DateTime createdAt;     // 创建时间

  Thing copyWith({
    String? id,
    String? content,
    bool? isCompleted,
    DateTime? createdAt,
  });
}

3.1.2 日期条目模型 (DayEntry)

class DayEntry {
  final DateTime date;          // 日期
  final List<Thing> things;     // 当日事项列表
}

3.1.3 统计数据模型 (Stats)

class Stats {
  final int totalDays;          // 总记录天数
  final int totalThings;        // 总事项数
  final int completedThings;    // 已完成事项数
  final double completionRate;  // 完成率
  final int streak;             // 连续天数
  final int perfectDays;        // 完美天数（3/3完成）
  final List<int> weeklyData;   // 本周数据（7天）
}

3.2 存储管理器

3.2.1 日期检查机制

static void _checkDate() {
  final now = DateTime.now();
  final today = DateTime(now.year, now.month, now.day);
  final currentDate = DateTime(_currentDate.year, _currentDate.month, _currentDate.day);

  // 如果日期变更且今日有事，保存到历史
  if (today != currentDate && _todayThings.isNotEmpty) {
    _history.insert(0, DayEntry(
      date: currentDate,
      things: List.from(_todayThings),
    ));
    _todayThings.clear();
  }
  _currentDate = now;
}

3.2.2 事项操作

// 添加事项（最多3个）
static void addThing(String content) {
  if (_todayThings.length >= 3) return;
  _checkDate();
  _todayThings.add(Thing(
    id: DateTime.now().millisecondsSinceEpoch.toString(),
    content: content,
    createdAt: DateTime.now(),
  ));
}

// 切换完成状态
static void toggleComplete(int index) {
  if (index < 0 || index >= _todayThings.length) return;
  _todayThings[index] = _todayThings[index].copyWith(
    isCompleted: !_todayThings[index].isCompleted,
  );
}

// 删除事项
static void deleteThing(int index) {
  if (index < 0 || index >= _todayThings.length) return;
  _todayThings.removeAt(index);
}

3.3 统计计算

3.3.1 完成率计算

double completionRate = totalThings > 0 
    ? completedThings / totalThings 
    : 0;

3.3.2 连续天数计算

static int _calculateStreak() {
  int streak = 0;
  final today = DateTime.now();
  
  // 今日有记录则从1开始
  if (_todayThings.isNotEmpty) {
    streak = 1;
  }

  // 遍历历史，检查是否连续
  for (int i = 0; i < _history.length; i++) {
    final entryDate = _history[i].date;
    final expectedDate = today.subtract(Duration(days: i + 1));
    
    if (entryDate.year == expectedDate.year &&
        entryDate.month == expectedDate.month &&
        entryDate.day == expectedDate.day) {
      streak++;
    } else {
      break;
    }
  }

  return streak;
}

3.4 事项卡片

3.4.1 滑动删除

Dismissible(
  key: Key(thing.id),
  direction: DismissDirection.endToStart,
  background: Container(
    alignment: Alignment.centerRight,
    decoration: BoxDecoration(
      color: colorScheme.errorContainer,
      borderRadius: BorderRadius.circular(16),
    ),
    child: Icon(Icons.delete),
  ),
  confirmDismiss: (direction) async {
    onDelete();
    return false;
  },
  child: Card(...),
)

3.4.2 完成动画

AnimatedContainer(
  duration: const Duration(milliseconds: 300),
  decoration: BoxDecoration(
    color: thing.isCompleted
        ? colorScheme.primaryContainer.withValues(alpha: 0.3)
        : null,
    borderRadius: BorderRadius.circular(16),
  ),
  child: Row(
    children: [
      AnimatedContainer(
        duration: const Duration(milliseconds: 300),
        decoration: BoxDecoration(
          shape: BoxShape.circle,
          color: thing.isCompleted
              ? colorScheme.primary
              : colorScheme.surfaceContainerHighest,
        ),
        child: thing.isCompleted
            ? Icon(Icons.check)
            : Text('$index'),
      ),
      AnimatedDefaultTextStyle(
        duration: const Duration(milliseconds: 300),
        style: TextStyle(
          decoration: thing.isCompleted
              ? TextDecoration.lineThrough
              : null,
        ),
        child: Text(thing.content),
      ),
    ],
  ),
)

---

四、UI设计规范

4.1 配色方案

应用采用浅色主题配合橙色主色调，营造温暖活力的氛围：

颜色类型	色值	用途
主色	#FF7043	AppBar、强调、按钮
背景色	#FFFFFF	纯白背景
表面色	#F5F5F5	浅灰卡片背景
主容器色	#FFCCBC	浅橙选中状态
次容器色	#FFE0B2	浅橙辅助色

4.2 字体规范

层级	字号	字重	用途
显示大字	displayLarge	Bold	完成率展示
标题大字	headlineSmall	Bold	页面主标题
卡片标题	titleMedium	Bold	日期标题
正文	bodyLarge	Regular	事项内容
辅助文字	bodySmall	Regular	标签、时间

4.3 组件规范

4.3.1 今日页面布局

┌─────────────────────────────────┐
│  ━━━━━━━━━━━━━━━━━━━━━━━━━━━    │  ← 可折叠AppBar
│        📅 今日三件事             │
├─────────────────────────────────┤
│  ┌─────────────────────────┐   │
│  │    2024年1月15日         │   │  ← 日期卡片
│  │      星期一              │   │
│  │    ○ ○ ●  1/3 已完成     │   │
│  └─────────────────────────┘   │
│                                 │
│  今天最重要的三件事              │
│  ┌─────────────────────────┐   │
│  │ ① 完成项目报告    ✓      │   │  ← 已完成卡片
│  └─────────────────────────┘   │
│  ┌─────────────────────────┐   │
│  │ ② 学习Flutter      →    │   │  ← 进行中卡片
│  └─────────────────────────┘   │
│  ┌─────────────────────────┐   │
│  │ ③ 待添加...              │   │  ← 空槽位
│  └─────────────────────────┘   │
│                                 │
│  ┌─────────────────────┐ ┌─┐  │
│  │ 添加第3件事...      │ │+│  │  ← 输入框
│  └─────────────────────┘ └─┘  │
└─────────────────────────────────┘

4.3.2 事项卡片状态

未完成状态：
┌─────────────────────────────────┐
│  ①  完成项目报告               │
└─────────────────────────────────┘

已完成状态：
┌─────────────────────────────────┐
│  ✓  完成项目报告          ✓    │  ← 删除线+背景色
└─────────────────────────────────┘

4.4 交互设计

4.4.1 操作方式

操作	手势	效果
完成事项	点击卡片	切换完成状态
编辑事项	长按卡片	进入编辑模式
删除事项	左滑卡片	弹出确认对话框
添加事项	点击按钮	添加到列表末尾

---

五、核心功能实现

5.1 添加事项

void _addThing() {
  if (!_canAdd) {
    _showSnackBar('每天最多只能记录3件事');
    return;
  }

  if (_thingController.text.isEmpty) {
    _showSnackBar('请输入内容');
    return;
  }

  setState(() {
    if (_editingIndex >= 0) {
      ThingStorage.updateThing(_editingIndex, _thingController.text);
      _editingIndex = -1;
    } else {
      ThingStorage.addThing(_thingController.text);
    }
    _thingController.clear();
  });
}

5.2 切换完成状态

void _toggleComplete(int index) {
  setState(() {
    ThingStorage.toggleComplete(index);
  });
}

5.3 删除确认

void _deleteThing(int index) {
  showDialog(
    context: context,
    builder: (context) => AlertDialog(
      title: const Text('删除确认'),
      content: const Text('确定要删除这件事吗？'),
      actions: [
        TextButton(
          onPressed: () => Navigator.pop(context),
          child: const Text('取消'),
        ),
        FilledButton(
          onPressed: () {
            setState(() {
              ThingStorage.deleteThing(index);
            });
            Navigator.pop(context);
          },
          child: const Text('删除'),
        ),
      ],
    ),
  );
}

---

六、时间管理知识拓展

6.1 三件事法则的由来

6.2 时间管理方法对比

方法	核心理念	适用场景
三件事法则	每天只做3件重要事	目标导向型工作
番茄工作法	25分钟专注+5分钟休息	需要高度专注的任务
GTD	收集-处理-组织-回顾-执行	复杂项目管理
时间块	预先分配时间段	日程安排
艾森豪威尔矩阵	紧急/重要四象限	优先级决策

6.3 专注力科学

6.4 习惯养成周期

阶段	天数	特点	建议
启动期	1-7	新鲜感强	设定明确目标
挣扎期	8-21	动力下降	建立提醒机制
稳定期	22-66	逐渐适应	保持一致性
自动期	67+	成为习惯	持续优化

---

七、扩展功能规划

7.1 后续版本规划

7.2 功能扩展建议

7.2.1 数据持久化

功能	说明
SharedPreferences	轻量级本地存储
SQLite	结构化数据存储
云端同步	多设备数据同步

7.2.2 提醒功能

功能	说明
每日提醒	固定时间提醒记录
未完成提醒	晚间提醒完成事项
连续打卡提醒	保持连续性

7.2.3 社交功能

功能	说明
分享成就	分享解锁的成就
好友排行	比较完成率
互相监督	好友提醒打卡

---

八、注意事项

8.1 开发注意事项

1. 日期检查：每次操作前检查日期是否变更

2. 列表限制：强制限制每日最多3件事

3. 状态同步：使用setState确保UI同步更新

4. 动画流畅：使用AnimatedContainer实现平滑过渡

5. 数据备份：定期保存到历史记录

8.2 用户体验优化

✨ 用户体验建议 ✨

• 空槽位提示引导用户添加
• 完成动画给予正向反馈
• 限制数量促使思考优先级
• 成就系统激励持续使用

8.3 常见问题

问题	原因	解决方案
无法添加事项	已达上限	提示最多3件事
历史记录丢失	内存存储	迁移至持久化存储
连续天数中断	日期判断错误	检查日期比较逻辑
完成率不准	计算公式错误	验证统计计算

---

九、运行说明

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_three_things.dart

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

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

---

十、总结

今日三件事应用通过"每天只做三件最重要的事"这一核心理念，帮助用户学会取舍，聚焦真正重要的事项。应用强制限制每日最多记录3件事，通过这种约束引导用户思考优先级，避免被琐事分散精力。

应用采用浅色主题配合橙色主色调，营造温暖活力的氛围。今日页面展示日期、完成进度和事项列表，支持添加、完成、编辑、删除操作。历史页面按日期分组展示过去记录，统计页面提供完成率、连续天数、成就系统等数据分析。

事项卡片支持滑动删除、长按编辑、点击完成等交互方式，配合动画效果提供流畅的用户体验。成就系统设计了4个解锁成就，从起步者到月度达人，激励用户持续使用并养成高效的时间管理习惯。

应用采用Material Design 3设计规范，遵循Flutter最佳实践，代码结构清晰，易于维护和扩展。后续版本计划集成本地持久化存储、每日提醒、云端同步、Widget小组件等功能，为用户提供更完善的时间管理体验。

每天只做三件事，让专注成为习惯！