主要介绍一款手机打蛇游戏。（仅支持移动端）这是一个临近deadline的班级项目。为了方便使用TS，我直接使用angular-cli生成TypeScript的工程结构。如果你有好用的TS项目生成器（请推荐给我），你可以使用TypeScript+ES6。不推荐使用Angular，因为体积太大。源码：https://github.com/suyingtao/...几天内开发了单人版和多人版。代码不是很漂亮，请谅解~使用node实现的多人游戏源码不忍直视，所以不开源。如果你有足够的时间和精力，欢迎扩展多人游戏版本~游戏玩法游戏的玩法与贪吃蛇大战基本相同。左摇杆控制方向，右键加速。当你控制的蛇头撞到墙壁或其他蛇时，Gameover。每次都会自动生成一个傻瓜式的AI，只会随机转弯和躲墙。Demo使用了触摸事件，不支持PC端。请使用移动设备访问http://verysao.com/dragon游戏截图本地运行npm//安装依赖ngserve-p0//本地启动Buildng构建--prod--aot--env=prod文件结构Maincode都位于src/app.以下是src/app文件夹中的目录结构和文件说明。.|____app.component.html|____gameover||____gameover.component.scss||____gameover.component.html||____gameover.component.ts游戏结束弹出窗口||____gameover.component.spec.ts|____room||____room.component.scss||____room.component.ts多人房间（未开发）||____room.component.html||____room.component.spec.ts|____app.component.scss|____app.component.spec.ts|____app.module.ts|____app.component.ts游戏核心逻辑，渲染主屏|____提速||____speed-up.component.html||____speed-up.component.scss||____speed-up.component.ts加速按钮||____speed-up.component.spec.ts|____menu||____menu.component.ts主菜单||____menu.component.spec.ts||____menu.component.html||____menu.component.scss|____操纵杆||____joystick.component.spec.ts||____joystick.component.scss||____joystick.component.html||____joystick.component.ts操纵杆按钮|____rank||____rank.component.html||____rank.component.spec.ts||____rank.component.scss||____rank.component.ts排名|____工厂类||____speedUp.ts加速类||____food.ts食品类||____joystick.ts操纵杆类||____dragon.ts贪吃蛇|____ws|)游戏逻辑贪吃蛇是由一系列的位置坐标和半径来描述的。主要游戏逻辑包括：蛇的走位、碰撞检测（蛇碰撞、撞墙、吃食物）、AI。蛇的移动距离由方向+速度+时间计算，方向由摇杆方向+角速度+时间计算。碰撞检测就是循环遍历贪吃蛇和食物。逻辑比较简单，就不细说了。渲染原理使用canvas绘制游戏画面。在app.component.ts的ngOnInit中渲染摇杆和加速按钮，因为这两部分是常量，不需要经常重绘。渲染的主要功能是app.component.ts中的render函数，依次绘制地图、食物、蛇。重叠时，第一个绘制的将在底部。在render函数中，通过clearRect(0,0,this.width,this.height)和requestAnimationFrame(this.render.bind(this))不断的clear,draw,clearanddraw，达到动态的效果。Q&A贪吃蛇怎么一直在屏幕中央？原理是在蛇移动的时候，让地图向蛇的相反方向移动，让蛇一直在屏幕中央。蛇的身体如何跟随它的头部？需要分为两种情况，蛇在单位时间内移动一个单位长度和蛇移动多个单位长度。一个单位长度比较简单，只需要将旧head的左边unshift到body数组中，将body数组中的最后一个pop出来，然后给head赋一个新值即可。当长度为多个单位时，需要计算旧头移动到新头的可能坐标，然后依次unshift到body数组中，然后pop多余的body坐标。如何计算蛇出生时的孔径大小和位置？蛇的头部和身体各有一个点，孔径可以随着蛇的形状而变化。这实际上是一个最小覆盖圆算法。TypeScript实现最小覆盖圆增量算法Thanks有收获请点个赞~https://github.com/suyingtao/...
