亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

HTML5小游戲---愛心魚(上)

難度中級
時長 2小時34分
學習人數
綜合評分9.50
139人評價 查看評價
9.6 內容實用
9.5 簡潔易懂
9.4 邏輯清晰
圖片資源不全 小魚尾巴少7張圖片 ,故意的吧老師
背景出不來啊
我只想要一個編譯器一樣的主題
老師講的不錯,跟著做覺得挺有意思的,雖然有時候出現和教程的不一樣效果,但是通過自己思考,自己改,還是有收獲的,階段一代碼歡迎fork,適合谷歌瀏覽器,順便給個star啦
https://github.com/zhongshanxian/SUM/tree/master/fish
老師,你的代碼前后對不上啊喂
可否用hbuilder編譯器
如果在寫的時候,發現有問題的,可以參考我的代碼,在gitHub上??梢栽谶@里找到https://github.com/cj96248/tinyHeart,圖片和js代碼都有,可以完美運行。
繪制果實偏移的原因是因為lineWidth和lineCap兩個屬性,指定lineWidth,canvas繪制邏輯是是指定x坐標左右各8px的寬度這樣繪制,lineCap屬性會增加8px的高度 所以果實的位置x和y各偏移了8px
要是這個也能實現彈幕就好了,走神的遇到走心的就變得值得了
ctx1.drawImage(this.bigBody,-this.bigBody.width*0.5,-this.bigBody.height*0.5);
ctx1.drawImage(this.bigTail,-this.bigTail.width*0.5+30,-this.bigTail.height*0.5);
ctx1.restore();
}
大魚:
momObj.prototype.draw = function(){
ctx1.save();
ctx1.translate(this.x,this.y);/*方法轉換畫布的用戶坐標系統。平移,將畫布的坐標原點向左右方向移動x,向上下方向移動y.canvas的默認位置是在(0,0)*/
ctx1.drawImage(this.bigEye,-this.bigEye.width*0.5,-this.bigEye.height*0.5);
老師好厲害,之前背景一直出不來,又看了一遍發現少漏了一個點,老師棒棒的
為什么果實出不來喃?求大神解答
原background.js:
function drawBackground(){

bgPic.onload=function(){

ctx2.drawImage(bgPic,0,0,canWidth,canHeight);

}

}
修改后的:
function drawBackground(){

ctx2.drawImage(bgPic,0,0,canWidth,canHeight);
}
解決了海葵透明度問題和漂浮直線問題
我的js之間不能跨用,要加上var new_element=document.createElement("script");
new_element.setAttribute("type","text/javascript");
new_element.setAttribute("src","js/background.js");
document.body.appendChild(new_element);
課程須知
1、對html、css基礎知識已經掌握。 2、對JavaScript的基礎知識掌握,如數組、類、對象。
老師告訴你能學到什么?
1、html5 canvas制作游戲理念 2、html5 canvas 繪圖API 3、游戲中的碰撞檢測 4、認識幾個數學函數 5、物體池概念 6、序列幀動畫的控制

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!

本次提問將花費2個積分

你的積分不足,無法發表

為什么扣積分?

本次提問將花費2個積分

繼續發表請點擊 "確定"

為什么扣積分?

舉報

0/150
提交
取消