javascript - 如何為大量的sprite添加碰撞檢測(cè)框?
問(wèn)題描述
我有一張精靈表,里面的每幀都有不同的尺寸,如下圖:
現(xiàn)在我想為它們添加碰撞檢測(cè)框,但圖片較多,而且碰撞的位置不限于圖片邊框,請(qǐng)問(wèn)這種情況如何添加檢測(cè)框,是否需要給每幀按需求添加?添加完成后又如何獲取碰撞框的位置?有沒(méi)有工具可以實(shí)現(xiàn)?非常感謝~
問(wèn)題解答
回答1:基本上游戲開(kāi)發(fā)最難的部分之一就是碰撞檢測(cè)了,你如何選擇碰撞檢測(cè)請(qǐng)務(wù)必根據(jù)你項(xiàng)目的需求來(lái)決定,一般對(duì)于多邊形用得比較多的是分離軸定理(SAT),像你這種如果要求不是特別高的話用正常等大的矩形檢測(cè)就好了,如果非要變化的話就為每個(gè)狀態(tài)保存一個(gè)碰撞檢測(cè)框用于碰撞檢測(cè),比如說(shuō):
var monster = { steps : {'walk' : { 'width' : '', //碰撞檢測(cè)時(shí)用于計(jì)算的寬度 'height' : '', //高度 'imgs' : [] //精靈,可能'walk'這個(gè)動(dòng)作中包含了多幀,進(jìn)行游戲循環(huán)的時(shí)候需要逐步變化 'idx' : 0 //用于判斷imgs當(dāng)前到哪個(gè)步驟的下標(biāo)索引},'jump' : { //同樣的},'run' : { //等等}//........ }, //保存不同狀態(tài)下的顯示效果和碰撞邊框 'currentStatus' : 'walk', //當(dāng)前的狀態(tài),方便相關(guān)功能的載入 'setup' : function(){this.x += '';this.y += ’’;//用于計(jì)算和更新位置 }, 'draw' : function(){//用于繪制 } //......};//碰撞檢測(cè)一般都在游戲循環(huán)里單獨(dú)調(diào)用一個(gè)方法,通過(guò)循環(huán)獲取活動(dòng)對(duì)象的x,y,width,height來(lái)進(jìn)行檢測(cè),這里你可以通過(guò)判斷一個(gè)矩形是否存在一個(gè)頂點(diǎn)在另一個(gè)矩形內(nèi)部來(lái)得知是否碰撞,當(dāng)然用sat也是可以的,不過(guò)麻煩了點(diǎn)
當(dāng)然我這里僅僅給你參考意見(jiàn),我不是主攻游戲開(kāi)發(fā),以前有興趣的時(shí)候自學(xué)過(guò)一段時(shí)間,如果有什么地方有問(wèn)題歡迎指出來(lái),就這樣吧。
相關(guān)文章:
1. 數(shù)組按鍵值封裝!2. java - web項(xiàng)目中,用戶(hù)登陸信息存儲(chǔ)在session中好 還是cookie中好,取決于什么?3. angular.js - webpack build后的angularjs路由跳轉(zhuǎn)問(wèn)題4. pdo - mysql 簡(jiǎn)單注入疑問(wèn)5. mysql - SQL分組排序、隨機(jī)問(wèn)題?6. Mysql取下一條記錄7. 老師,怎么不講一次性添加多個(gè)數(shù)據(jù)8. mac mysql 5.7.9 編碼修改無(wú)效9. mysql 新增用戶(hù) 主機(jī)名設(shè)定 失敗10. mysql - 查詢(xún)字段做了索引為什么不起效,還有查詢(xún)一個(gè)月的時(shí)候數(shù)據(jù)都是全部出來(lái)的,如果分拆3次的話就沒(méi)問(wèn)題,為什么呢。
