2048 游戏

一个基于 uni-app x 开发的经典2048益智游戏，完美适配鸿蒙HarmonyOS 6。

📱 项目简介

这是一个使用 uni-app x 框架开发的2048游戏应用，灵感来源于 gabrielecirulli/2048。游戏采用简体中文界面，提供流畅的游戏体验和精美的视觉设计。

✨ 特性

核心功能

• 🎮 经典玩法 - 4x4网格，通过滑动合并相同数字的方块
• 📊 分数系统 - 实时显示当前分数和历史最高分
• 💾 数据持久化 - 最高分自动保存到本地存储
• 🎯 胜利检测 - 达到2048时显示胜利提示，可选择继续挑战
• 🎲 随机生成 - 每次移动后智能生成新方块（90%概率生成2，10%概率生成4）
• 🔄 新游戏 - 随时重新开始游戏

界面设计

• 🎨 原版配色 - 完全遵循原版2048的经典配色方案
• 🌓 深色模式 - 自动适配系统深色模式，护眼舒适
• ✨ 平滑动画 - 方块出现和合并都有精美的动画效果
• 📱 响应式布局 - 适配不同屏幕尺寸，完美显示
• 🎯 触摸优化 - 流畅的滑动手势控制

方块颜色

支持从 2 到 8192 的完整方块：

• 2, 4 → 灰色系
• 8, 16, 32, 64 → 橙色系
• 128, 256, 512 → 金色系
• 1024, 2048 → 亮金色
• 4096, 8192 → 深色系

🎯 游戏规则

1. 使用手指在屏幕上上下左右滑动来移动所有方块
2. 当两个相同数字的方块碰撞时，它们会合并成一个
3. 每次移动后会在空位随机生成一个新的 2 或 4
4. 目标是达到 2048 方块！
5. 达到2048后可以选择继续游戏，挑战更高分数
6. 当网格填满且无法移动时，游戏结束

📋 系统要求

• HarmonyOS 6 - 完美支持鸿蒙6
• Android - 支持 Android 5.0+
• iOS - 支持 iOS 10.0+
• Web - 支持现代浏览器

🚀 快速开始

安装依赖

# 使用 HBuilderX 打开项目
# 或使用命令行
npm install

📁 项目结构

2048/
├── pages/
│   └── index/
│       └── index.uvue          # 游戏主页面
├── static/
│   └── logo.png                # 应用图标
├── App.uvue                    # 应用入口
├── main.uts                    # 主入口文件
├── pages.json                  # 页面配置
├── manifest.json               # 应用配置
├── LICENSE                     # MIT 开源协议（英文）
├── LICENSE_CN.md               # MIT 开源协议（中文）
├── README.md                   # 项目说明
└── BLOG.md                     # 技术博客

🎨 技术栈

• uni-app x - 跨平台应用开发框架
• UTS - TypeScript 的超集，提供原生性能
• uvue - uni-app x 的页面文件格式

🔧 核心算法

移动逻辑

游戏实现了四个方向的移动算法：

• moveLeft() - 向左移动和合并
• moveRight() - 向右移动和合并
• moveUp() - 向上移动和合并
• moveDown() - 向下移动和合并

合并规则

• 每次移动只能合并一次
• 合并后的方块在本次移动中不能再次合并
• 使用 merged 数组标记已合并的位置

游戏状态检测

• hasWon() - 检测是否达到2048
• isGameOver() - 检测游戏是否结束
  • 检查是否有空格
  • 检查是否可以合并

🌓 深色模式

应用支持自动适配系统深色模式：

• 自动检测系统主题设置
• 应用切换回前台时重新检测
• 深色模式下的优化配色方案
• 保持良好的对比度和可读性

📝 开发说明

状态管理

使用 Vue 3 Composition API 进行状态管理：

• grid - 游戏网格数据（4x4二维数组）
• tiles - 方块显示数据
• score - 当前分数
• bestScore - 最高分
• gameOver - 游戏结束状态
• gameWon - 游戏获胜状态
• isDarkMode - 深色模式状态

触摸手势

使用原生触摸事件实现滑动检测：

• @touchstart - 记录触摸起点
• @touchend - 计算滑动方向
• 最小滑动距离：30px
• 根据 X/Y 轴位移判断方向

🎯 未来计划

• 撤销功能
• 游戏历史记录
• 自定义网格大小（3x3, 5x5）
• 音效和震动反馈
• 排行榜功能
• 分享功能
• 更多主题选择

📄 开源协议

本项目基于 MIT 协议 开源（中文版说明）。

这意味着你可以：

• ✅ 商业使用
• ✅ 修改源代码
• ✅ 分发
• ✅ 私人使用

但需要：

• 📋 保留版权声明和许可声明
• ⚠️ 软件按"原样"提供，不提供任何形式的担保

👤 作者

坚果

🙏 致谢

• 原版2048游戏：gabrielecirulli/2048
• uni-app x 框架：DCloud
• HarmonyOS 平台支持

📝 技术博客

想了解项目的详细开发过程？查看完整的技术博客：

👉 《使用 uni-app x 开发2048游戏：从零到上架鸿蒙应用市场》

博客内容包括：

• 🏗️ 架构设计思路
• 💻 核心算法详解
• 🎨 界面设计与动画实现
• 🌓 深色模式适配方案
• 🐛 常见问题与解决方案
• 🚀 性能优化技巧

📮 反馈与建议

如果你有任何问题或建议，欢迎提交 Issue 或 Pull Request。

---

⭐ 如果这个项目对你有帮助，欢迎给个 Star！