🐍🧩 双人对战俄罗斯方块+贪吃蛇游戏

一个创新的双人实时对战游戏，将经典的俄罗斯方块和贪吃蛇游戏完美结合！

💻 由 CSDN InCode 强力驱动 - 让AI编程更简单！

🌐 立即体验游戏 - 在CSDN InCode平台上运行

• 实时对战：一人控制贪吃蛇，一人控制俄罗斯方块
• 策略互动：两种游戏机制相互影响，增加策略性
• 房间系统：支持创建房间和好友对战

• WASD控制：使用WASD键控制蛇的移动
• 双倍速度：移动速度是俄罗斯方块下落的2倍
• 吃方块得分：吃掉下落中的方块获得20分，尾部增长1像素
• 金币机制：吃金币可以缩短尾部1像素（最小保持5像素）
• 死亡条件：碰到边界、自身或被下落的方块砸中会死亡
• 特殊限制：只能吃正在下落的方块，不能吃已落地的方块

• 方向键控制：←→移动，↑旋转，↓加速下落
• 经典玩法：标准俄罗斯方块消除机制
• 消除得分：消除一层获得100分
• 攻击机制：可以用下键加速来"砸"贪吃蛇
• 死亡条件：方块堆积触达游戏区域顶部

• 自动生成：每30秒判断一次，如果场地金币少于2个则生成1个
• 智能位置：不会在已下落的俄罗斯方块占据的格子上生成
• 战略价值：被贪吃蛇吃掉后，蛇身缩短1像素

1. 双人匹配：创建房间或加入房间开始对战
2. 角色选择：一人选择贪吃蛇，一人选择俄罗斯方块
3. 准备开始：双方都准备后即可开始游戏
4. 胜负判定：
   • 贪吃蛇死亡 → 俄罗斯方块玩家获胜
   • 俄罗斯方块触顶 → 贪吃蛇玩家获胜

• 贪吃蛇：WASD键控制移动方向
• 俄罗斯方块：方向键控制（←→移动，↑旋转，↓加速）
• 暂停游戏：点击暂停按钮或按ESC键

• 🤖 AI辅助编程：智能代码生成和优化
• ☁️ 云端开发环境：无需本地配置，即开即用
• 🔧 一键部署：快速发布到生产环境
• 📚 丰富模板库：快速启动各类项目

• React 18 + TypeScript - 现代化前端框架
• Vite - 快速构建工具
• Tailwind CSS - 现代化样式框架
• Lucide React - 精美图标库
• React Hotkeys Hook - 键盘控制
• Sonner - 消息通知系统

• 自定义游戏引擎：基于Canvas的高性能渲染
• 60FPS游戏循环：流畅的游戏体验
• 精确碰撞检测：准确的游戏物理
• 状态管理：完整的游戏状态同步

• 组件化设计：模块化的代码组织
• 类型安全：完整的TypeScript类型定义
• 响应式设计：完美适配桌面和移动端
• 实时同步：为后续网络对战预留接口

dual-battle-tetris-snake/
├── src/
│   ├── components/          # React组件
│   │   ├── ui/             # 基础UI组件
│   │   ├── GameRoom.tsx    # 游戏房间组件
│   │   ├── GameCanvas.tsx  # 游戏画布组件
│   │   └── BattleGame.tsx  # 对战游戏组件
│   ├── hooks/              # 自定义Hooks
│   │   └── useGameRoom.ts  # 房间管理Hook
│   ├── lib/                # 核心库
│   │   ├── gameEngine.ts   # 游戏引擎
│   │   ├── supabase.ts     # 数据库配置
│   │   └── utils.ts        # 工具函数
│   ├── types/              # 类型定义
│   │   └── game.ts         # 游戏类型
│   ├── App.tsx             # 主应用组件
│   └── main.tsx            # 入口文件
├── old_version/            # 原版单人游戏备份
└── dist/                   # 构建输出

• 暗色主题：现代化的深色界面设计
• 渐变背景：美观的视觉效果
• 像素化渲染：复古游戏风格
• 流畅动画：丰富的交互反馈

• 直观界面：清晰的游戏状态显示
• 即时反馈：实时的操作响应
• 错误处理：完善的异常处理机制
• 移动优化：触控按钮适配移动设备

• ✅ AI智能编程：利用CSDN InCode的AI助手快速开发复杂游戏逻辑
• ✅ 云端协作：多人协作开发，实时同步代码变更
• ✅ 一键部署：直接从开发环境部署到生产环境
• ✅ 丰富插件：海量开发插件和模板加速开发

• ✅ 代码保护：原有单人游戏代码完整备份到old_version/目录
• ✅ 双人实时对战：一人控制贪吃蛇，一人控制俄罗斯方块
• ✅ 完整游戏规则：严格按照需求实现所有游戏机制
• ✅ 操作方式：贪吃蛇WASD控制，俄罗斯方块方向键控制
• ✅ 得分系统：贪吃蛇吃方块20分，俄罗斯方块消除100分
• ✅ 金币机制：30秒间隔生成，缩短蛇身效果
• ✅ 死亡条件：完整的游戏结束判定
• ✅ 移动适配：完美支持移动端操作
• ✅ 现代技术栈：React + TypeScript + Tailwind CSS
• ✅ 云端部署：基于CSDN InCode平台一键上线

• 高性能渲染：自定义Canvas游戏引擎
• 模块化架构：清晰的代码组织结构
• 类型安全：完整的TypeScript类型系统
• 响应式设计：桌面和移动端完美适配

1. 访问平台：进入 CSDN InCode
2. 导入项目：将此代码库导入到InCode工作空间
3. 一键运行：使用InCode的一键运行功能启动游戏
4. 开始游戏：
   • 创建房间：选择角色并创建房间
   • 加入房间：输入房间号加入现有房间
   • 开始对战：双方准备后点击"开始游戏"
   • 享受游戏：使用对应按键控制你的角色

# 克隆项目
git clone <repository-url>

# 安装依赖
pnpm install

# 启动开发服务器
pnpm dev

• 🤖 AI编程助手：智能代码补全和错误修复
• ☁️ 云端开发：随时随地，无需配置本地环境
• 📚 海量模板：游戏开发、Web应用、移动应用模板丰富
• 🚀 快速部署：一键部署到云端，分享给全世界
• 👥 团队协作：支持多人实时协作开发
• 📊 项目管理：集成任务管理和版本控制

• 创新游戏玩法：将两个经典游戏完美融合
• AI辅助开发：展示CSDN InCode平台的强大能力
• 完整双人系统：房间匹配和对战机制
• 现代化技术：使用最新的前端技术栈
• 优秀用户体验：流畅的游戏操作和美观的界面
• 云端部署：基于InCode平台的便捷部署

🌟 立即访问 CSDN InCode 体验AI编程的魅力！