一个动态的霓虹迷宫游戏,使用Next.js 14框架和现代Web技术构建。
项目特点
- 动态生成的迷宫:每次都是随机生成的新迷宫
- 霓虹灯效果:使用CSS动画和Tailwind实现的炫酷霓虹效果
- 多种难度级别:简单、中等和困难三种难度选择
- 响应式设计:适配桌面和移动设备
- 键盘和触摸控制:支持键盘(WASD/方向键)和触摸屏操作
- 动画效果:使用Framer Motion实现流畅的动画过渡
如何玩
- 使用键盘的方向键或WASD键移动玩家(黄色圆点)
- 从绿色起点移动到粉色终点
- 墙壁不能穿过,移动轨迹会留下紫色痕迹
- 在移动设备上,可以使用屏幕上的方向按钮控制
- 可以随时切换难度或重新生成迷宫
项目结构
- 迷宫生成算法:src/components/maze/maze-generator.ts
- 迷宫渲染组件:src/components/maze/maze.tsx
- 控制界面组件:src/components/maze/maze-controls.tsx
- 主页面:src/app/page.tsx
