助力高校计算机教育 —— 码云为老师推出免费高校版,高达 200 人的协作团队
Watch Star Fork

ryanpenn / Double-TetrisJavaScriptMIT

加入码云
与超过 200 万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
Double-Tetris 是一款双人俄罗斯方块游戏,在传统的俄罗斯方块游戏基础上增加了双人配合的玩法,增添了一些游戏技巧和乐趣。客户端(requireJS+jQuery+socket.io+PixiJS)+ 服务端(SpringBoot+Netty-SocketIO)。
ryanpenn 最后提交于 Update README.md
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README.md 4.27 KB

Double-Tetris (记得Star哦)

Double-Tetris 是一款双人俄罗斯方块游戏,我在传统的俄罗斯方块游戏基础上增加了双人配合玩法,增添了一些游戏技巧和乐趣。技术选型 客户端(requireJS+jQuery+socket.io+PixiJS)+ 服务端(SpringBoot+Netty-SocketIO)。

截图

PC

手机

功能说明

  • 游戏在经典版俄罗斯方块上进行改变,加入双人游戏的玩法,支持局域网游戏(目前只支持2个客户端连接)
  • 先接入的客户端为P1, 使用绿色方块, 出现在屏幕左侧; 后接入的客户端为P2, 使用红色方块,出现在屏幕右侧
  • 客户端对屏幕分辨率做了自适应处理,支持不同分辨率的设备.
  • 同时支持 键盘(PC端) 和 触屏(移动端) 操作
  • 键盘: W/A/S/D(或方向键 ↑ ← ↓ →)分别为 旋转/左移/下移/右移, 空格键 为直接下落
  • 触屏: 左/右/下 滑手势 分别对应 左移/右移/下移, 上滑手势 为旋转, 触屏暂未支持直接下落

运行说明

  • 配置服务端:resources/application.properties, 将server.host改为 本机IP(不要使用localhost或127.0.0.1)
  • 运行服务端: cn.ryanpenn.game.tetris.Application.main
  • 客户端代码在: webapp/tetris-client 目录中
  • 客户端配置: js/main.js 中的连接地址IP、端口保持和服务器一致即可(不要使用localhost或127.0.0.1)
  • 客户端需要运行多个,建议采用 browsersync 工具运行,方便在移动端看效果
    • 打开命令行, cd 到 tetris-client 目录中
    • 运行 browser-sync start --server --files "js/*.js"
    • 在浏览器中打开 http://本机IP:3000/tetris-client.html (服务端应该会输出日志: P1已连接)
    • 在 另一台电脑或手机 的浏览器中打开上面的地址,游戏就自动开始了
    • 如果需要查看在微信中的显示效果,可以使用 草料二维码生成器 将地址生成二维码,然后通过微信扫一扫就可以了
  • 注意:所有设备必须和服务端在同一网段中
  • 游戏难度可以在 js/tetris.js 中调整

技术说明

  • 基于WebSocket实现通信,使用 netty-socketio(服务端) + socket.io.js(客户端) 实现.
  • 服务端是基于 Maven 的Java Application,依赖 spring boot, 可以直接运行,不需要部署到Web容器.
  • 客户端使用了 require.js 实现模块化,使用 jquery 来简化编码(其实很少用到...)
  • 客户端使用了 pixi.js 游戏引擎. 由于本人对这个游戏引擎还不熟悉,只用很少一部分功能,界面是通过该引擎绘制的.

版本

参考资料

实用工具

备注

  • 本项目是在 对战版俄罗斯方块 项目基础上修改的,基本游戏实现原理可参考该项目.
  • 项目还不完善,Bug肯定也不少,但希望能给大家一些参考,欢迎Star和Fork

项目点评 ( 1 )

你可以在登录后,发表评论

10_float_left_people 10_float_left_close