Flutter 框架跨平台鸿蒙开发 - 电子宠物复刻应用
运行效果图电子宠物复刻应用是一款致敬经典电子鸡（Tamagotchi）和拓麻歌子的养成类游戏应用。应用完美还原了90年代风靡全球的电子宠物玩法，以像素风格和复古界面设计唤起用户的童年回忆。玩家需要照顾一只虚拟宠物，通过喂食、玩耍、清洁、医疗等互动方式维持宠物的各项状态指标，见证宠物从蛋到成年的完整成长历程。应用采用经典粉红色调的外壳设计，模拟真实电子宠物机的LCD屏幕效果。涵盖宠物养成、状态管理、
·
电子宠物复刻应用
欢迎加入开源鸿蒙跨平台社区：
https://openharmonycrossplatform.csdn.net
一、项目概述
运行效果图
1.1 应用简介
电子宠物复刻应用是一款致敬经典电子鸡（Tamagotchi）和拓麻歌子的养成类游戏应用。应用完美还原了90年代风靡全球的电子宠物玩法，以像素风格和复古界面设计唤起用户的童年回忆。玩家需要照顾一只虚拟宠物，通过喂食、玩耍、清洁、医疗等互动方式维持宠物的各项状态指标，见证宠物从蛋到成年的完整成长历程。
应用采用经典粉红色调的外壳设计，模拟真实电子宠物机的LCD屏幕效果。涵盖宠物养成、状态管理、迷你游戏、事件日志四大模块，支持6种互动动作和3种迷你游戏，通过时间流逝系统模拟真实的养成体验。
1.2 核心功能
| 功能模块 | 功能描述 | 实现方式 |
|---|---|---|
| 宠物养成 | 喂食、玩耍、清洁等互动 | 状态更新系统 |
| 状态管理 | 饥饿、快乐、健康等指标 | Timer定时衰减 |
| 成长进化 | 从蛋到成年的5个阶段 | 时间累积判定 |
| 迷你游戏 | 猜拳、接物、记忆游戏 | 弹窗交互 |
| 事件日志 | 记录宠物成长历程 | 列表存储 |
| 随机事件 | 拉臭臭、生病、发现金币 | 随机触发 |
1.3 宠物成长阶段
| 序号 | 阶段名称 | 所需时间 | 特点描述 |
|---|---|---|---|
| 1 | 蛋 | 0小时 | 初始状态，等待孵化 |
| 2 | 幼年期 | 24小时 | 刚孵化的小宝宝 |
| 3 | 成长期 | 72小时 | 活泼好动的少年 |
| 4 | 青春期 | 168小时 | 叛逆的青少年 |
| 5 | 成年期 | 336小时 | 成熟稳重的大人 |
| 6 | 老年期 | 720小时 | 慈祥的老者 |
1.4 宠物情绪状态
| 序号 | 情绪类型 | 表情符号 | 触发条件 |
|---|---|---|---|
| 1 | 开心 | (▽) | 快乐值>70且健康值>70 |
| 2 | 普通 | (・ω・) | 默认状态 |
| 3 | 难过 | (╥﹏╥) | 快乐值<30 |
| 4 | 饥饿 | (o_O) | 饥饿值<20 |
| 5 | 生病 | (>_<) | 健康值<30 |
| 6 | 困倦 | (-_-)zzZ | 精力值<20 |
1.5 互动动作
| 序号 | 动作名称 | Emoji | 效果描述 | 消耗金币 |
|---|---|---|---|---|
| 1 | 喂食 | 🍖 | 饥饿+30，体重+1 | 5 |
| 2 | 玩耍 | ⚽ | 快乐+20，精力-15 | 0 |
| 3 | 清洁 | 🛁 | 清洁度=100 | 0 |
| 4 | 睡觉 | 💤 | 精力=100，健康+10 | 0 |
| 5 | 医疗 | 💊 | 健康+30，快乐-10 | 20 |
| 6 | 抚摸 | 🤚 | 快乐+10，纪律-5 | 0 |
1.6 技术栈
| 技术领域 | 技术选型 | 版本要求 |
|---|---|---|
| 开发框架 | Flutter | >= 3.0.0 |
| 编程语言 | Dart | >= 2.17.0 |
| 设计规范 | Material Design 3 | - |
| 定时器 | Timer.periodic | - |
| 动画控制 | AnimationController | - |
| 状态管理 | setState | - |
| 目标平台 | 鸆蒙OS / Web | API 21+ |
1.7 项目结构
lib/
└── main_tamagotchi.dart
├── TamagotchiApp # 应用入口
├── PetStage # 成长阶段枚举
├── PetMood # 情绪状态枚举
├── PetAction # 互动动作枚举
├── MiniGame # 迷你游戏枚举
├── PetStatus # 宠物状态数据模型
├── TamagotchiHomePage # 主页面
├── _buildDeviceFrame # 设备外壳
├── _buildScreen # LCD屏幕
├── _buildPet # 宠物显示
└── PixelGridPainter # 像素网格绘制器
二、系统架构
2.1 整体架构图
2.2 类图设计
2.3 游戏循环流程
2.4 互动流程图
三、核心模块设计
3.1 数据模型设计
3.1.1 成长阶段枚举 (PetStage)
enum PetStage {
egg('蛋', 0, 0),
baby('幼年期', 1, 24),
child('成长期', 2, 72),
teen('青春期', 3, 168),
adult('成年期', 4, 336),
senior('老年期', 5, 720);
final String label; // 阶段名称
final int level; // 阶段等级
final int hoursRequired; // 所需小时数
}
3.1.2 情绪状态枚举 (PetMood)
enum PetMood {
happy('开心', '(*^▽^*)', Color(0xFFFFEB3B)),
normal('普通', '(・ω・)', Color(0xFF9E9E9E)),
sad('难过', '(╥﹏╥)', Color(0xFF64B5F6)),
hungry('饥饿', '(o_O)', Color(0xFFFF9800)),
sick('生病', '(_>_<)', Color(0xFFF44336)),
sleepy('困倦', '(-_-)zzZ', Color(0xFF9C27B0));
final String label; // 情绪名称
final String face; // 颜文字表情
final Color color; // 主题颜色
}
3.1.3 互动动作枚举 (PetAction)
enum PetAction {
feed('喂食', '🍖', Color(0xFFFF7043)),
play('玩耍', '⚽', Color(0xFF42A5F5)),
clean('清洁', '🛁', Color(0xFF26C6DA)),
sleep('睡觉', '💤', Color(0xFFAB47BC)),
heal('医疗', '💊', Color(0xFF66BB6A)),
pet('抚摸', '🤚', Color(0xFFFFCA28));
final String label; // 动作名称
final String emoji; // 代表表情
final Color color; // 按钮颜色
}
3.1.4 宠物状态模型 (PetStatus)
class PetStatus {
int hunger; // 饥饿度 (0-100)
int happiness; // 快乐值 (0-100)
int health; // 健康值 (0-100)
int cleanliness; // 清洁度 (0-100)
int energy; // 精力值 (0-100)
int age; // 年龄（分钟）
int weight; // 体重
int discipline; // 纪律值 (0-100)
int coins; // 金币数量
PetMood get mood; // 计算当前情绪
PetStage get stage; // 计算成长阶段
bool get isAlive; // 判断是否存活
void decay(); // 状态衰减
void feed(); // 喂食效果
void play(); // 玩耍效果
void clean(); // 清洁效果
void sleep(); // 睡觉效果
void heal(); // 医疗效果
void pet(); // 抚摸效果
}
3.1.5 状态属性分布
3.2 页面结构设计
3.2.1 主页面布局
3.2.2 LCD屏幕结构
3.2.3 状态界面结构
3.2.4 游戏界面结构
3.3 状态衰减机制
四、UI设计规范
4.1 配色方案
应用采用经典电子宠物机的粉红色调，营造复古怀旧氛围：
| 颜色类型 | 色值 | 用途 |
|---|---|---|
| 主色 | #E91E63 (Pink) | 设备外壳、强调元素 |
| 主色深 | #C2185B | 渐变过渡 |
| 屏幕背景 | #C5E1A5 | LCD绿色屏幕 |
| 屏幕边框 | #000000 | 黑色边框 |
| 背景浅粉 | #FFE0E0 | 外壳渐变 |
4.2 状态颜色
| 状态类型 | 色值 | 情感表达 |
|---|---|---|
| 喂食 | #FF7043 | 温暖食欲 |
| 玩耍 | #42A5F5 | 活力运动 |
| 清洁 | #26C6DA | 清新洁净 |
| 睡觉 | #AB47BC | 宁静安详 |
| 医疗 | #66BB6A | 健康恢复 |
| 抚摸 | #FFCA28 | 温馨亲密 |
4.3 情绪颜色
| 情绪类型 | 色值 | 视觉效果 |
|---|---|---|
| 开心 | #FFEB3B | 明亮黄色 |
| 普通 | #9E9E9E | 中性灰色 |
| 难过 | #64B5F6 | 忧郁蓝色 |
| 饥饿 | #FF9800 | 警示橙色 |
| 生病 | #F44336 | 危险红色 |
| 困倦 | #9C27B0 | 梦幻紫色 |
4.4 字体规范
| 元素 | 字号 | 字重 | 颜色 |
|---|---|---|---|
| 设备标题 | 16px | Bold | #FFFFFF |
| 状态数值 | 24px | Bold | 主题色 |
| 情绪标签 | 12px | Bold | #FFFFFF |
| 动作标签 | 9px | Medium | #FFFFFF |
| 日志文本 | 11px | Regular | #000000 |
| 游戏标题 | 16px | Medium | #000000 |
4.5 组件规范
4.5.1 设备外壳
┌─────────────────────────────────────┐
│ ╔═══════════════════════════════╗ │
│ ║ 🐾 小鸡 ║ │
│ ╠═══════════════════════════════╣ │
│ ║ ┌───────────────────────────┐ ║ │
│ ║ │ 🍖85 ❤️72 💚95 ⚡88 💰120 │ ║ │
│ ║ │ │ ║ │
│ ║ │ ┌─────┐ │ ║ │
│ ║ │ │ 🐣 │ │ ║ │
│ ║ │ │(*^▽^*) │ ║ │
│ ║ │ │[幼年期] │ ║ │
│ ║ │ └─────┘ │ ║ │
│ ║ │ │ ║ │
│ ║ │ [ 开心 ] │ ║ │
│ ║ └───────────────────────────┘ ║ │
│ ║ ○ ○ ○ ○ ║ │
│ ╚═══════════════════════════════╝ │
└─────────────────────────────────────┘
4.5.2 状态卡片
┌─────────────────┐
│ 🍖 饥饿度 │
│ │
│ ████████░░ 85% │
│ 85 / 100 │
└─────────────────┘
4.5.3 动作按钮
┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐
│ 🍖 │ │ ⚽ │ │ 🛁 │ │ 💤 │ │ 💊 │ │ 🤚 │
│ 喂食 │ │ 玩耍 │ │ 清洁 │ │ 睡觉 │ │ 医疗 │ │ 抚摸 │
└──────┘ └──────┘ └──────┘ └──────┘ └──────┘ └──────┘
4.5.4 迷你游戏卡片
┌─────────────────────────────────────┐
│ ✊ 猜拳 ▶ │
├─────────────────────────────────────┤
│ 🎯 接物 ▶ │
├─────────────────────────────────────┤
│ 🧠 记忆 ▶ │
└─────────────────────────────────────┘
五、核心功能实现
5.1 游戏循环实现
void _startGameLoop() {
_gameTimer = Timer.periodic(const Duration(seconds: 3), (timer) {
if (_pet.isAlive && !_isSleeping) {
setState(() {
_pet.decay(); // 状态衰减
_checkRandomEvents(); // 检查随机事件
});
}
});
}
void _checkRandomEvents() {
final random = Random();
// 10%概率拉臭臭
if (random.nextDouble() < 0.1 && _poops.length < 3) {
_poops.add(Offset(
random.nextDouble() * 0.6 + 0.2,
random.nextDouble() * 0.3 + 0.5,
));
_addEvent('$_petName拉臭臭了，快清理！');
}
// 5%概率生病
if (random.nextDouble() < 0.05 && _pet.cleanliness < 50) {
_pet.health = (_pet.health - 10).clamp(0, 100);
_addEvent('$_petName生病了！');
}
// 3%概率发现金币
if (random.nextDouble() < 0.03) {
final coins = random.nextInt(10) + 5;
_pet.coins += coins;
_addEvent('发现$coins金币！');
}
}
5.2 状态衰减实现
void decay() {
hunger = (hunger - 2).clamp(0, 100);
happiness = (happiness - 1).clamp(0, 100);
cleanliness = (cleanliness - 1).clamp(0, 100);
energy = (energy - 1).clamp(0, 100);
age += 1;
// 低饥饿度影响健康
if (hunger < 20 || cleanliness < 20) {
health = (health - 2).clamp(0, 100);
}
if (hunger < 10) {
health = (health - 5).clamp(0, 100);
}
}
5.3 情绪计算实现
PetMood get mood {
if (health < 30) return PetMood.sick; // 生病优先
if (hunger < 20) return PetMood.hungry; // 饥饿次之
if (energy < 20) return PetMood.sleepy; // 困倦
if (happiness < 30) return PetMood.sad; // 难过
if (happiness > 70 && health > 70) return PetMood.happy; // 开心
return PetMood.normal; // 普通
}
5.4 成长阶段计算
PetStage get stage {
final hours = age ~/ 60;
if (hours < PetStage.baby.hoursRequired) return PetStage.egg;
if (hours < PetStage.child.hoursRequired) return PetStage.baby;
if (hours < PetStage.teen.hoursRequired) return PetStage.child;
if (hours < PetStage.adult.hoursRequired) return PetStage.teen;
if (hours < PetStage.senior.hoursRequired) return PetStage.adult;
return PetStage.senior;
}
5.5 宠物动画实现
AnimatedBuilder(
animation: _bounceController,
builder: (context, child) {
return Transform.translate(
offset: Offset(0, sin(_bounceController.value * pi) * 8),
child: Container(
width: 120,
height: 120,
decoration: BoxDecoration(
color: _pet.mood.color.withValues(alpha: 0.3),
shape: BoxShape.circle,
border: Border.all(color: _pet.mood.color, width: 3),
),
child: _buildPetBody(),
),
);
},
)
5.6 像素网格背景
class PixelGridPainter extends CustomPainter {
void paint(Canvas canvas, Size size) {
final paint = Paint()
..color = Colors.black.withValues(alpha: 0.03)
..strokeWidth = 1;
const gridSize = 16.0;
for (double x = 0; x < size.width; x += gridSize) {
canvas.drawLine(Offset(x, 0), Offset(x, size.height), paint);
}
for (double y = 0; y < size.height; y += gridSize) {
canvas.drawLine(Offset(0, y), Offset(size.width, y), paint);
}
}
}
六、迷你游戏设计
6.1 猜拳游戏
6.2 接物游戏
6.3 记忆游戏
七、交互设计
7.1 喂食流程
7.2 睡觉流程
7.3 死亡与重生
八、扩展功能规划
8.1 后续版本规划
8.2 功能扩展建议
8.2.1 多种宠物选择
宠物种类扩展：
- 经典小鸡（默认）
- 可爱小狗
- 萌萌小猫
- 神秘小龙
- 每种宠物独特进化路线
8.2.2 宠物进化分支
进化系统设计：
- 根据照顾方式影响进化
- 好好照顾→天使形态
- 忽视照顾→恶魔形态
- 平衡照顾→普通形态
8.2.3 成就系统
成就类型：
- 养成成就（存活时间）
- 互动成就（互动次数）
- 游戏成就（游戏胜利）
- 隐藏成就（特殊条件）
九、注意事项
9.1 开发注意事项
-
状态边界：所有状态值需要clamp到0-100范围
-
Timer管理：需要在dispose时取消Timer
-
动画释放：AnimationController需要在dispose时释放
-
随机种子：使用固定种子保证测试可重复
-
金币消耗：喂食和医疗需要检查金币是否足够
9.2 常见问题
| 问题 | 原因 | 解决方案 |
|---|---|---|
| 宠物突然死亡 | 健康值归零 | 检查状态衰减逻辑 |
| 状态值溢出 | 未做边界处理 | 使用clamp方法 |
| 动画卡顿 | Controller未释放 | 在dispose中释放 |
| 便便不显示 | 坐标计算错误 | 检查Positioned参数 |
9.3 设计理念
🎮 设计理念 🎮
每一个电子宠物都承载着我们的童年回忆，
那些在课桌下偷偷照顾宠物的时光，
那些看着宠物成长、离去的感动。
通过复刻经典电子鸡，
我们希望唤起那份纯真的快乐，
让新一代玩家也能体验养成的乐趣。
用心照顾，见证成长。
十、运行说明
10.1 环境要求
| 环境 | 版本要求 |
|---|---|
| Flutter SDK | >= 3.0.0 |
| Dart SDK | >= 2.17.0 |
| 鸆蒙OS | API 21+ |
10.2 运行命令
# 查看可用设备
flutter devices
# 运行到Web服务器
flutter run -d web-server -t lib/main_tamagotchi.dart --web-port 8110
# 运行到鸿蒙设备
flutter run -d 127.0.0.1:5555 lib/main_tamagotchi.dart
# 运行到Edge浏览器
flutter run -d edge lib/main_tamagotchi.dart
# 代码分析
flutter analyze lib/main_tamagotchi.dart
十一、总结
电子宠物复刻应用通过养成系统、状态管理、迷你游戏、事件日志四大模块，完美还原了经典电子鸡（Tamagotchi）的养成体验。应用支持6种互动动作和3种迷你游戏，通过时间流逝系统模拟真实的养成过程。
核心功能涵盖宠物养成、状态衰减、成长进化、迷你游戏、随机事件五大模块。养成系统支持喂食、玩耍、清洁、睡觉、医疗、抚摸六种互动方式；状态系统包含饥饿、快乐、健康、清洁、精力、纪律六项指标；成长系统实现从蛋到老年的六个阶段；迷你游戏提供猜拳、接物、记忆三种玩法。
应用采用Material Design 3设计规范，以经典粉红色调模拟电子宠物机外壳，LCD绿色屏幕营造复古氛围。通过本应用，希望能够唤起用户的童年回忆，让新一代玩家也能体验养成的乐趣。
用心照顾，见证成长
作为“人工智能6S店”的官方数字引擎，为AI开发者与企业提供一个覆盖软硬件全栈、一站式门户。
更多推荐
4
0- 0
已为社区贡献10条内容
所有评论(0)