蛋计划贪吃蛇。手起刀落-一起来写经典的贪吃蛇游戏。

蛋计划贪吃蛇简介

蛋计划贪吃蛇是一模一样缓缓新式的轻竞技吞噬游戏,玩家当玩乐被以会操控小蛇不断的吃少对手,变得足够好执政整个赛场,还有各种丰富的特点玩法来袭,让你感触及满的趣味性!

多少提示:推荐在盒子或者电视及安沙发管家:http://www.shafa.com,可同等键下载更新蛋计划贪吃蛇!

回味

时候玩的藏贪吃蛇游戏我们记忆还是深刻,谋划了几乎上,小时候喜打的游玩,长大了算生出能力把他做下(从来都没有合格过,不晓得好写的顺序,是不是会过得去了…),好了,闲话不多道,先来拘禁一下效应吧!!

图片 1

力量以及时候玩的贪吃蛇一样,

1、选择速度 
    slow
    normal
    fast
2、选择是否有墙作为障碍物
    on
    off

扣押罢效果就优先附上地址了:大山深处修炼的小龙虾,欢迎fork.

结构讲

要构建一个简短的经贪吃蛇游戏呢?我们根据面板可以解释产生如下结构:

图片 2

盖任何面板比较简单,我们着重来拘禁一下打面板

打闹面板

游戏面板是核心,在戏面板中,我们来说明一下游乐面板我们得之素:

图片 3

场景、snake、食物

首先我们需要一个玩耍场景、snake、食物这些基础设备
此地以canvas作为咱们的全方位娱乐的状况:

<canvas class="wrap" id="snake" width="400" height="400" tabindex="1"></canvas>

用平等单纯snake,后面初始化他的职位

var activeDot = function (x, y) {
    ctx.fillStyle = "#eee";
    ctx.fillRect(x * 10, y * 10, 10, 10);
}

待食品作为目标(关于食物我们需要定义有规则,如食品的起)

var food = {
    x: 0,
    y: 0
};

规则

规则是耍之骨干

1、关于游戏的规则

snake的大势决定:(使用键盘的左右左右键控制蛇的来头)

 // changer dir
    var changeDir = function (key) {
        if (key == 38 && snake_dir != 2) {
            snake_next_dir = 0;
        } else {
            if (key == 39 && snake_dir != 3) {
                snake_next_dir = 1;
            } else {
                if (key == 40 && snake_dir != 0) {
                    snake_next_dir = 2;
                } else {
                    if (key == 37 && snake_dir != 1) {
                        snake_next_dir = 3;
                    }
                }
            }
        }
    }

至于食物,如果食品给吃少,我们即便需要发出新的食品

  // add food
    var addFood = function () {
        food.x = Math.floor(Math.random() * ((canvas.width / 10) - 1));
        food.y = Math.floor(Math.random() * ((canvas.height / 10) - 1));
        for (var i = 0; i < snake.length; i++) {
            // 如果食物被吃就增加食物
            if (checkBlock(food.x, food.y, snake[i].x, snake[i].y)) {
                addFood();
            }
        }
    }

    var checkBlock = function (x, y, _x, _y) {
        return (x == _x && y == _y) ? true : false;
    }

属下去是中心之函数,根据选择的快慢以及是否有墙体作为障碍物的安装,让蛇运动起来,并且实现

1、根据选择slow、norma、fast决定蛇运动速度快慢
2、如果蛇碰到自己==自杀,游戏结束
3、有墙模式碰到墙体,游戏结束
4、无墙模式蛇穿过墙体,从外一侧出现
5、使蛇碰到食物就是在自己身体的均等有些,执行长食物函数

 var mainLoop = function () {
        var _x = snake[0].x;
        var _y = snake[0].y;
        snake_dir = snake_next_dir;
        //  0 — up  1 — right   2 — down  3 — left
        switch (snake_dir) {
            case 0:
                _y--;
                break;
            case 1:
                _x++;
                break;
            case 2:
                _y++;
                break;
            case 3:
                _x--;
                break;
        }
        snake.pop();
        snake.unshift({
            x: _x,
            y: _y
        })

        // --wall
        if (wall == 1) {
            if (snake[0].x < 0 || snake[0].x == canvas.width / 10 || snake[0].y < 0 || snake[0].y == canvas.height / 10) {
                showScreen(3);
                return;
            }
        } else {
            //  off 无墙
            for (var i = 0, x = snake.length; i < x; i++) {
                if (snake[i].x < 0) {
                    snake[i].x = snake[i].x + (canvas.width / 10);
                }
                if (snake[i].x == canvas.width / 10) {
                    snake[i].x = snake[i].x - (canvas.width / 10);
                }
                if (snake[i].y < 0) {
                    snake[i].y = snake[i].y + (canvas.height / 10);
                }
                if (snake[i].y == canvas.height / 10) {
                    snake[i].y = snake[i].y - (canvas.height / 10);
                }
            }
        }

        //  Autophagy death
        for (var i = 1; i < snake.length; i++) {
            if (snake[0].x == snake[i].x && snake[0].y == snake[i].y) {
                showScreen(3);
                return;
            }
        }

        // Eat food
        if (checkBlock(snake[0].x, snake[0].y, food.x, food.y)) {
            snake[snake.length] = {
                x: snake[0].x,
                y: snake[0].y
            };
            score += 1;
            altScore(score);
            addFood();
            activeDot(food.x, food.y);
        }

        // --------------------

        ctx.beginPath();
        ctx.fillStyle = "#111";
        ctx.fillRect(0, 0, canvas.width, canvas.height);

        // --------------------

        for (var i = 0; i < snake.length; i++) {
            activeDot(snake[i].x, snake[i].y);
        }

        // --------------------

        activeDot(food.x, food.y);

        setTimeout(mainLoop, snake_speed);
    }

ok以上展示出一些主干组成部分,构建起一个舞台受到一律单单小蛇的故事.

幼时爸妈手机里产生平等磨蹭小打叫贪吃蛇。就是平漫长小蛇,不鸣金收兵地在屏幕上游走,吃各个方向出现的卵,越吃越长。只要蛇头碰到屏幕四周,或者遇到自己之人体,小蛇就立毙命。方寸的戏台中,亦生极端美好;PS:到今吧没过关过..现在无了解会无克过关了…

终极以巴次源码,欢迎fork交流:okaychen…
因为自己测试用底服务器被占据,目前只有做的作用图供大家参考喽.
掘金地址:手起刀落-一起来形容经典的贪吃蛇游戏