canvas寫乙個貪吃蛇小遊戲

2021-09-02 04:05:59 字數 1736 閱讀 7397

截圖

開始

js
// ./snake.js

function snake (canvas)

this.ctx = canvas.getcontext('2d')

this.state = ,

score: 0, // 分數

}this.getpoint()

this.init(this.state.startx, this.state.starty)

this.getscore()

}snake.prototype =

this.state.body[i] = snake

}this.create(this.state.body)

},// 建立乙個貪吃蛇

create (body)

ctx.fillrect(snake.x, snake.y, this.state.size, this.state.size)

this.state.body[i] = snake}},

// 開始

start () ,

// 讓蛇運動起來

run () , speed)

},// 控制

control ()

// 呼叫判斷方向合法的函式

settimeout(() => , 10)}},

// 判斷方向是否合法

// 判斷按下按鍵之前和按下按鍵之後的方向,如果這倆個方向相反則遊戲結束

checkdirection (rules) }},

// 方向

direction (direction)

switch (direction)

},// 向上移動

movetop ()

this.move(head)

},// 向下移動

movebottom ()

this.move(head)

},// 向左移動

moveleft ()

this.move(head)

},// 向右移動

moveright ()

this.move(head)

},// 移動

// 先儲存蛇頭座標,然後再讓蛇頭向前移動一次,然後從蛇的第二節身體開始遍歷,讓後一節身體的座標等於前一節身體的座標

move (head)

},// 清除畫布

clear () ,

// 獲取食物座標

getpoint ()

},// 繪製食物

food () ,

// 吃食物

eat ()

},// 新增一節身體

add ()

// 新增

this.state.body.push(n)

},// 邊界檢測

bordertest ()

if (snake.x > border.x || snake.x < 1 || snake.y > border.y || snake.y < 1)

},// gameover

gameover () ,

// 繪製分數

getscore ()

}

貪吃蛇小遊戲

1 doctype html 2 html 3 head 4 title snake title 5head 6 body style text align center margih 100px background color aaaaaa 7 canvas id canv width 400 ...

乙個簡單的「貪吃蛇」小遊戲

乙個簡單的 貪吃蛇 小遊戲 分享人 鄭漲 頁面結構 簡單的21x21的方塊,頁面結構 id為container的div包含所21個class名為row的div,每個row代表貪吃蛇的一整行,每個row中又包含21個div,代表這一行的每乙個div方格,如果這個方格是空的話,div的類名為blank,...

用python pygame寫貪吃蛇小遊戲

因為python語法簡單好上手,前兩天在想能不能用python寫個小遊戲出來,就上網搜了一下發現了pygame這個寫2d遊戲的庫。了解了兩天再參考了一些資料就開始寫貪吃蛇這個小遊戲。畢竟最開始的練手專案好像都是這個emmmmpython推薦廖雪峰的python3教程,pygame推薦目光部落格的py...