，希望能对还未涉及游戏开发的小伙伴有所启发。由于技术栈很浅，希望大佬勿喷。话不多说，直接开撸。
打开HBuilder,新建项目，给项目命名snake_eat_worm(蛇吃虫子)，我给它起了个高大上的名字：蛇战群蠕。名字满分，给自己加个鸡腿。选择默认模板，勾选启用uniCloud(默认使用阿里云)，点击创建。
在绘制之前，我们思考下用div如何在不同的格子里画上不同的图案（蛇和虫子或者是土地）。我们不妨把这100个格子看成一个数组。每个格子对应数组的下标0-99。我们把数组初始化为100个0，我们用数字0代表土地。用数字1代表虫子，用数字2代表蛇。我们将上面的代码稍加改动：
可以看到在黄色土地里有3个格子的数字是1，其他是0。这样就好办了，我们只需把数字是1的格子的背景图变成一只小虫子就好了：
至此，虫子的绘制就完成了，接下来我们开始绘制蛇，蛇的绘制可是有点难度哦，各位看官做好准备了吗，只会div的朋友，恐怕你真的要告辞了，哈哈啊哈
从游戏资源中，我们可以看到我们的蛇是有头有尾的，咱们先不管，咱们先把蛇的身子怼上去，去头去尾拿去炖汤~
哈哈，现在我们可以看到一个无头无尾蛇，拿去炖汤。其实啊，完整的蛇更美味呢，接下来我们把蛇头蛇尾补上。这里我们需要记录当前格子的下标，因为我们定义蛇的数组是记录了蛇所处格子的下标的：
欧耶，看着正常了！emmmm...貌似哪里不对劲，啊呀，虫子怎么倒了~，加个判断,是蛇才旋转90度：
要让蛇动，肯定要加个定时器了。我们刚开始是在的时候渲染一次界面，要让蛇动起来，我们需要将绘制蛇的方法封装起来，这样才能在定时器中循环执行：
蛇是动起来了，但是好像有点呆，不会拐弯，并且我们发现它会穿过边界，这不是我们想要的效果。我们需要在界面上添加四个按钮，用来操控我们可爱的蛇蛇，绑定上各自的事件：
妈耶！蛇头方向不对啊。之前粗暴的固定旋转90度是不对的，这个背景图的旋转需要具体问题具体分析呢，新增一个计算旋转的方法，此方法需要好好思考：
看，它变得像那么回事了，我们的蛇现在还不会死，我们需要设置它撞到边界，或者自身会死，也就是游戏结束。
目前我们的虫子是写死了三只，实际上我们的虫子是随机产生的，并且吃完一只会产生另外一只，虫子不会在蛇的位置上出现：
到目前为止，贪吃蛇的基本功能就完成了，恭喜只会div的同学也学废了。如果还没学废，可以在码上掘金在线体验，后面还会陆续更新，欢迎点赞关注
