Flutter 框架跨平台鸿蒙开发 - 时间黑洞探测器
运行效果图时间黑洞探测器应用是一款专注于时间追踪与分析的效率工具类应用,旨在帮助用户找出时间都浪费在哪里。应用以黑色为主色调,传递专业、深邃的品牌形象。应用涵盖了工作、学习、娱乐、社交、通勤、家务、休息、手机、其他九大活动分类,通过时间追踪、分类统计、黑洞分析、效率评分等功能模块,帮助用户科学管理时间,提升生活效率。时间黑洞手机时间娱乐时间\text{时间黑洞} = \text{手机时间} + \
时间黑洞探测器应用
欢迎加入开源鸿蒙跨平台社区:
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图




1.1 应用简介
时间黑洞探测器应用是一款专注于时间追踪与分析的效率工具类应用,旨在帮助用户找出时间都浪费在哪里。应用以黑色为主色调,传递专业、深邃的品牌形象。
应用涵盖了工作、学习、娱乐、社交、通勤、家务、休息、手机、其他九大活动分类,通过时间追踪、分类统计、黑洞分析、效率评分等功能模块,帮助用户科学管理时间,提升生活效率。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 仪表盘 | 今日时间分布概览 | 饼图+统计卡片 |
| 时间分析 | 深入分析时间使用 | 分类统计+柱状图 |
| 活动记录 | 查看所有活动记录 | 列表展示 |
| 时间建议 | 时间管理方法建议 | 卡片列表 |
| 添加活动 | 手动添加活动记录 | 底部弹窗表单 |
1.3 活动分类
| 序号 | 分类名称 | 图标 | 颜色 | 说明 |
|---|---|---|---|---|
| 1 | 工作 | work | 蓝色 | 高效产出 |
| 2 | 学习 | school | 绿色 | 自我提升 |
| 3 | 娱乐 | videogame_asset | 橙色 | 适度放松 |
| 4 | 社交 | people | 粉色 | 人际交流 |
| 5 | 通勤 | directions_car | 紫色 | 必要时间 |
| 6 | 家务 | home | 棕色 | 生活必需 |
| 7 | 休息 | bedtime | 靛蓝色 | 恢复精力 |
| 8 | 手机 | phone_android | 红色 | 潜在黑洞 |
| 9 | 其他 | more_horiz | 灰色 | 未分类 |
1.4 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 绑定方式 | CustomPainter | - |
| 目标平台 | 鸿蒙OS / Web | API 21+ |
1.5 项目结构
lib/
└── main_time_blackhole.dart
├── TimeBlackholeApp # 应用入口
├── ActivityCategory # 活动分类枚举
├── TimeActivity # 时间活动模型
├── DailyRecord # 日记录模型
├── TimeBlackholeHomePage # 主页面
└── PieChartPainter # 饼图绘制器
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 页面导航流程
2.4 数据流向图
三、核心模块设计
3.1 数据模型设计
3.1.1 活动分类枚举 (ActivityCategory)
enum ActivityCategory {
work('工作', Icons.work, Color(0xFF2196F3), '高效产出'),
study('学习', Icons.school, Color(0xFF4CAF50), '自我提升'),
entertainment('娱乐', Icons.videogame_asset, Color(0xFFFF9800), '适度放松'),
social('社交', Icons.people, Color(0xFFE91E63), '人际交流'),
commute('通勤', Icons.directions_car, Color(0xFF9C27B0), '必要时间'),
housework('家务', Icons.home, Color(0xFF795548), '生活必需'),
rest('休息', Icons.bedtime, Color(0xFF3F51B5), '恢复精力'),
phone('手机', Icons.phone_android, Color(0xFFF44336), '潜在黑洞'),
other('其他', Icons.more_horiz, Color(0xFF607D8B), '未分类');
final String label;
final IconData icon;
final Color color;
final String description;
}
3.1.2 时间活动模型 (TimeActivity)
class TimeActivity {
final String id; // 唯一标识
final String name; // 活动名称
final ActivityCategory category; // 活动分类
final DateTime startTime; // 开始时间
final DateTime endTime; // 结束时间
final String? note; // 备注
Duration get duration => endTime.difference(startTime);
int get durationInMinutes => duration.inMinutes;
}
3.1.3 日记录模型 (DailyRecord)
class DailyRecord {
final DateTime date;
final List<TimeActivity> activities;
int get totalMinutes => activities.fold(0, (sum, a) => sum + a.durationInMinutes);
Map<ActivityCategory, int> get categoryMinutes {
final map = <ActivityCategory, int>{};
for (final activity in activities) {
map[activity.category] = (map[activity.category] ?? 0) + activity.durationInMinutes;
}
return map;
}
}
3.1.4 时间黑洞定义
时间黑洞=手机时间+娱乐时间 \text{时间黑洞} = \text{手机时间} + \text{娱乐时间} 时间黑洞=手机时间+娱乐时间
黑洞占比=时间黑洞总时间×100% \text{黑洞占比} = \frac{\text{时间黑洞}}{\text{总时间}} \times 100\% 黑洞占比=总时间时间黑洞×100%
3.1.5 活动分类分布
3.2 页面结构设计
3.2.1 主页面布局
3.2.2 仪表盘页面结构
3.2.3 分析页面结构
3.3 黑洞检测算法
3.4 效率评分计算
四、UI设计规范
4.1 配色方案
应用采用黑色为主色调,传递专业、深邃的品牌形象:
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | #212121 (Black) | 导航、强调元素 |
| 工作 | #2196F3 | 工作分类 |
| 学习 | #4CAF50 | 学习分类 |
| 娱乐 | #FF9800 | 娱乐分类 |
| 社交 | #E91E63 | 社交分类 |
| 手机 | #F44336 | 手机分类(黑洞) |
| 效率良好 | #4CAF50 | 高效率标识 |
| 效率待提升 | #FF9800 | 低效率标识 |
4.2 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 页面标题 | 24px | Bold | #FFFFFF |
| 效率评分 | 48px | Bold | #FFFFFF |
| 分类标签 | 12px | Regular | 分类颜色 |
| 活动名称 | 15px | Medium | #000000 |
| 时间显示 | 14px | Bold | 分类颜色 |
4.3 组件规范
4.3.1 黑洞警告卡片
┌─────────────────────────────────────────────────┐
│ ⚠️ 时间黑洞警告 45% │
│ │
│ 以下活动消耗了大量时间 │
│ │
│ 📱 手机 3h 0m │
│ 🎮 娱乐 3h 0m │
└─────────────────────────────────────────────────┘
4.3.2 时间分布饼图
┌─────────────────┐
╱ ╲
│ ┌─────────┐ │
│ │ │ │
│ │ 饼图 │ │
│ │ │ │
│ └─────────┘ │
╲ ╱
└─────────────────┘
● 工作 ● 学习 ● 娱乐 ● 手机
4.3.3 活动卡片
┌─────────────────────────────────────────────────┐
│ ┌────┐ 刷短视频 │
│ │ 📱 │ 手机 1h 30m │
│ └────┘ ⚠️ │
└─────────────────────────────────────────────────┘
五、核心功能实现
5.1 时间计算实现
Duration get duration => endTime.difference(startTime);
int get durationInMinutes => duration.inMinutes;
String get durationText {
final hours = duration.inHours;
final minutes = duration.inMinutes % 60;
if (hours > 0) {
return '${hours}h ${minutes}min';
}
return '${minutes}min';
}
5.2 黑洞时间计算
String _calculateBlackholeTime(DailyRecord record) {
int blackholeMinutes = 0;
for (final activity in record.activities) {
if (activity.category == ActivityCategory.phone ||
activity.category == ActivityCategory.entertainment) {
blackholeMinutes += activity.durationInMinutes;
}
}
final hours = blackholeMinutes ~/ 60;
final minutes = blackholeMinutes % 60;
return '${hours}h ${minutes}m';
}
5.3 分类统计实现
Map<ActivityCategory, int> get categoryMinutes {
final map = <ActivityCategory, int>{};
for (final activity in activities) {
map[activity.category] = (map[activity.category] ?? 0) + activity.durationInMinutes;
}
return map;
}
List<MapEntry<ActivityCategory, int>> get sortedCategories {
return categoryMinutes.entries.toList()
..sort((a, b) => b.value.compareTo(a.value));
}
5.4 饼图绘制实现
class PieChartPainter extends CustomPainter {
final Map<ActivityCategory, int> data;
void paint(Canvas canvas, Size size) {
final center = Offset(size.width / 2, size.height / 2);
final radius = min(size.width, size.height) / 2 - 10;
final total = data.values.fold(0, (sum, v) => sum + v);
if (total == 0) return;
var startAngle = -pi / 2;
data.forEach((category, minutes) {
if (minutes <= 0) return;
final sweepAngle = 2 * pi * minutes / total;
final paint = Paint()
..color = category.color
..style = PaintingStyle.fill;
canvas.drawArc(
Rect.fromCircle(center: center, radius: radius),
startAngle,
sweepAngle,
true,
paint,
);
startAngle += sweepAngle;
});
// 中心空心
canvas.drawCircle(
center,
radius * 0.5,
Paint()..color = Colors.white,
);
}
}
5.5 效率评分计算
Widget _buildEfficiencyScore(DailyRecord record) {
int productiveMinutes = 0;
int wastedMinutes = 0;
for (final activity in record.activities) {
if (activity.category == ActivityCategory.work ||
activity.category == ActivityCategory.study) {
productiveMinutes += activity.durationInMinutes;
} else if (activity.category == ActivityCategory.phone ||
activity.category == ActivityCategory.entertainment) {
wastedMinutes += activity.durationInMinutes;
}
}
final efficiency = record.totalMinutes > 0
? (productiveMinutes / record.totalMinutes * 100).toInt()
: 0;
// 显示效率评分...
}
5.6 旋转动画实现
void initState() {
super.initState();
_rotationController = AnimationController(
vsync: this,
duration: const Duration(seconds: 10),
);
_rotationAnimation = Tween<double>(begin: 0, end: 1).animate(_rotationController);
_rotationController.repeat();
}
AnimatedBuilder(
animation: _rotationAnimation,
builder: (context, child) {
return Transform.rotate(
angle: _rotationAnimation.value * 2 * pi,
child: child,
);
},
child: Icon(Icons.trip_origin),
)
六、交互设计
6.1 添加活动流程
6.2 数据分析流程
6.3 黑洞检测流程
七、扩展功能规划
7.1 后续版本规划
7.2 功能扩展建议
7.2.1 实时追踪
追踪功能增强:
- 实时计时功能
- 后台持续追踪
- 自动分类识别
- 智能提醒
7.2.2 数据分析
分析能力增强:
- 周/月趋势分析
- 对比分析
- 目标达成率
- 改进建议
7.2.3 社交功能
互动体验增强:
- 分享时间报告
- 好友对比
- 排行榜
- 挑战赛
八、注意事项
8.1 开发注意事项
-
时间计算:使用Duration进行时间差计算
-
黑洞定义:手机和娱乐分类定义为时间黑洞
-
效率计算:工作和学习定义为高效时间
-
动画控制:旋转动画使用repeat()循环
8.2 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 时间计算错误 | 时区问题 | 使用本地时间 |
| 饼图不显示 | 数据为空 | 检查total是否为0 |
| 效率为0 | 没有高效活动 | 添加工作/学习活动 |
| 分类统计错误 | 遍历逻辑问题 | 检查fold函数 |
8.3 使用提示
⏱️ 时间黑洞探测器使用指南 ⏱️
添加活动:点击右下角按钮,记录你的时间使用情况。
查看分析:在仪表盘查看时间分布和黑洞警告。
效率评分:了解你的时间使用效率,发现改进空间。
时间建议:获取科学的时间管理方法。
九、运行说明
9.1 环境要求
| 环境 | 版本要求 |
|---|---|
| Flutter SDK | >= 3.0.0 |
| Dart SDK | >= 2.17.0 |
| 鸿蒙OS | API 21+ |
9.2 运行命令
# 查看可用设备
flutter devices
# 运行到Web服务器
flutter run -d web-server -t lib/main_time_blackhole.dart --web-port 8119
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_time_blackhole.dart
# 运行到Windows
flutter run -d windows -t lib/main_time_blackhole.dart
# 代码分析
flutter analyze lib/main_time_blackhole.dart
十、总结
时间黑洞探测器应用通过科学的时间追踪与分析,为用户提供了一个了解时间使用情况的平台。应用涵盖了九大活动分类,通过黑洞检测、效率评分、时间分布等功能,帮助用户发现时间浪费的问题。
核心功能涵盖仪表盘、时间分析、活动记录、时间建议四大模块。仪表盘展示今日时间分布和黑洞警告;时间分析提供分类统计和效率评分;活动记录保存所有时间使用情况;时间建议提供科学的时间管理方法。
应用采用Material Design 3设计规范,以黑色为主色调,界面专业深邃。通过本应用,希望能够帮助用户发现时间黑洞,科学管理时间,提升生活效率。
发现时间黑洞,找回流失的时间
更多推荐



所有评论(0)