canvas不用說html5帶來的好東西，游戲什么的，么么噠

記得有一天玩手機(jī)游戲，就是一個(gè)跳躍過柱子那種，其實(shí)元素很簡(jiǎn)單啊，app能開發(fā)，借助html5 canvas也可以啊，于是就開始了。

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------

游戲的全部

1. 一個(gè)會(huì)動(dòng)的程序員,用一張圖片，夠省事

　　程序員的動(dòng)作，跳躍

　　程序猿的狀態(tài)，活著or死亡

2. 背景，理論背景和柱子們應(yīng)該分開，分開可以采用分層的canvas來實(shí)現(xiàn)

3. 聲音，跳躍，死亡，開始，死亡等等，借用audio來實(shí)現(xiàn)，這里我就實(shí)現(xiàn)了跳躍的聲音

4. 記分牌

5. 消息板

代碼行數(shù) 600行左右。

如圖一個(gè)簡(jiǎn)單的游戲就出來了，當(dāng)然，這個(gè)只是demo

碰撞計(jì)算，復(fù)雜重力計(jì)算，矩形柱子生成規(guī)則，水平速度，連續(xù)跳躍流程度等等我想到的，哈哈，都沒很好的實(shí)現(xiàn)，

為什么呢，因?yàn)?#xff0c;能力不足，哈哈。

?

代碼摘要：

baseDraw.js: 繪圖的基類，提供繪制圖片，文本，矩形的方法

main.js：入口文件，初始化游戲

Messager.js：顯示消息，包含記分和屏幕中心的提示

rectFactory.js：柱子矩形的生成和擦除，核心

runnner.js：主角，重置，狀態(tài)檢查等

sounder.js ：聲音

utils.js?：輔助類，復(fù)制和顏色隨機(jī)

?

源碼：快跑程序員

?

轉(zhuǎn)載于:https://www.cnblogs.com/cloud-/p/6347820.html

總結(jié)

以上是生活随笔為你收集整理的canvas小程序-快跑程序员的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。