cocos creator 做乙個塗鴉跳躍

問題1：如何實現主角跟隨

問題2：如何實現向上跳動時，所有跳板都能穿透，向下掉落時，所有跳板都能彈起

問題3：如果實現不同跳板有不同的彈跳高度

問題4：如何實現背景滾動

問題5：新增怪物

問題6：新增子彈

實現主角跟隨

cocos 有乙個攝像機的概念，在攝像機裡面的東西，就能看到，在這之外的就看不到，所以，只需要把攝像機一直跟著主角，就能實現主角跟隨的效果了

**其實就一點點：

cc.class 
lateupdate: (dt) ->
targetpos = this.player.converttoworldspacear(cc.vec2.zero)
pos = this.node.parent.converttonodespacear(targetpos)
this.node.position = cc.v2(this.node.position.x, pos.y)
return
}

因為主角在遊戲過程中，一直在移動，所以要先獲取主角的世界座標

之後為了讓攝像機和跟隨主角，需要把攝像機的座標設定成主角的座標

主角的世界座標算出來後，再把它換算成攝像機的模型座標，這樣就可以直接 setposition了

跳躍過程彈板狀態

嘗試過程很複雜，嘗試過上公升過程設定所有彈板為sensor，發現無效，嘗試過隱藏collider，也無效，最後把rigidbody隱藏就好了

於是，有了下面的步驟：

1、根據角色當前位置和上一次位置的正負，判斷角色是在上公升還是在下落

_getplayerdir: ->
@_lastplayery ?= 0
playerpos = this.player.converttoworldspacear(cc.vec2.zero)
dir = "up"
if playerpos.y > @_lastplayery
dir = "up"
else
dir = "down"
@_lastplayery = playerpos.y
return dir

2、上公升時隱藏所有彈板的rigidbody

3、下降時顯示所有彈板的rigidbody

_changerigidbodyactive: (dt) ->
return unless @_istimeok()
playerdir = @_getplayerdir()
for platform, index in @_platformlist
rigidbody = platform.getcomponent(cc.rigidbody)
rigidbody.active = playerdir is "down"
return

實現不同跳板有不同的彈跳高度

先生成三個預製體，每個預製體掛同乙個指令碼檔案

然後在指令碼屬性裡，設定不同的引數即可

cc.class 
onload: ->
this.node.getcomponent(cc.physicsboxcollider).name = "impulse_platform"
@_createaction() if math.random() > 0.8
_createaction: ->
ac1 = cc.moveby(1, 200, 0)
ac2 = cc.moveby(1, -200, 0)
this.node.runaction(cc.repeatforever(cc.sequence(ac1, ac2)))
onbegincontact: (contact, selfcollider, othercollider) ->
manifold = contact.getworldmanifold()
return if manifold.normal.y isnt 1
body = othercollider.body
body.linearvelocity = cc.v2()
return
}

實現背景滾動

遊戲中攝像機是跟隨角色移動的，所以很多書上講的那種背景移動，即迴圈減乙個數，減到小於一定值後，再重置回去的方法，就無效了。因為這種方法是要保證攝像機不動的情況下才有用的。所以，得想另一種方法來滿足這個背景滾動

之前做過乙個動態scrollview的外掛程式，其實這個就和背景滾動的原理是一樣的。當角色往上移動時，如果最高的背景到當前位置的距離小於一定值，則把最低位置的背景移動到最高背景的上方，當角色往下降落時，如果最低位置的背景與當前位置的距離小於一定值時，則把最高位置的背景移動下最低背影的下方。

步驟為：

1、將所有layer放在乙個陣列中，這個遊戲中用到了4個

2、在update中呼叫

3、對layer按y座標按從小到大排序

4、如果要比較最遠距離的，則取陣列中最大索引值對應的layer,反之取0

cc.class 
onload: ->
@speed = 5
_filluplayer: ->
playerpos = @player.converttoworldspacear(cc.vec2.zero)
maxy = @bglayertable[@bglayertable.length - 1].getboundingbox().ymax
if maxy - playerpos.y < cc.winsize.height
@bglayertable[0].setposition(cc.v2(0, maxy + cc.winsize.height / 2))
return
_filldownlayer: ->
playerpos = @player.converttoworldspacear(cc.vec2.zero)
miny = @bglayertable[0].getboundingbox().ymin
if playerpos.y - miny < cc.winsize.height
pos = cc.v2(0, miny - cc.winsize.height / 2)
@bglayertable[@bglayertable.length - 1].setposition(pos)
return
_updatebackgroundlayer: (dt) ->
@_orderlayertable()
@_filluplayer()
@_filldownlayer()
_orderlayertable: ->
this.bglayertable.sort( (a, b) -> a.y - b.y)
update: (dt) ->
@_updatebackgroundlayer(dt)
}

新增怪物

1、建立預製體

2、寫乙個指令碼

cc.class 
onload: ->
this.node.getcomponent(cc.physicsboxcollider).name = "monster"
@_createaction()
_createaction: ->
ac1 = cc.moveby(1, 200, 0)
ac2 = cc.moveby(1, -200, 0)
this.node.runaction(cc.repeatforever(cc.sequence(ac1, ac2)))
update: (dt) ->
# do your update here
onbegincontact: (contact, selfcollider, othercollider) ->
if othercollider.name is "player"
cc.director.emit("game_over")
return
}

新增子彈

_createbullet: ->
bullet = cc.instantiate(this.bulletprefab)
this.platformrootnode.addchild(bullet)
bullet.setposition(this.player.x, this.player.y + this.player.height * 1.5)
body = bullet.getcomponent(cc.rigidbody)
body.linearvelocity = cc.v2()
speedy = this.player.getcomponent(cc.rigidbody).linearvelocity.y / 3
@_bulletlist.push bullet

cocos creator 做乙個塗鴉跳躍

做乙個programmer，而不做乙個coder

做乙個心靈富翁

做乙個正直的人

cocos creator 做乙個塗鴉跳躍

做乙個programmer，而不做乙個coder

做乙個心靈富翁

做乙個正直的人

相關推薦