cocos creator小游戏案例之趣味套牛

趣味套牛

0. 思路

• 搭建基本背景
• 奔跑的牛
• 套牛的绳子
• 套牛成功的判定
• 结算
• 重新开始
• 特效,(音效,粒子)

1. 基本背景

• 按钮
  • 添加 button 组件
  • transition: sprite

2. 牛组件cow.js

- 设置皮肤数组

// cow.js
var cow_skin_type = cc.Class({
   
    name: 'cow_skin_type',
    properties: {
   
        cow_status: {
   
            type: cc.SpriteFrame,
            default: []
        }
    }
})
cc.Class({
   
    extends: cc.Component,
    properties: {
   
        cow_skin: {
   
            type: cow_skin_type,
            default: []
        }
    }
});

- 随机生成牛

// cow.js
// 1. 随机生成牛
var cow_type = Math.random() * 3 // [0, 3)
this.cow_type = Math.floor(cow_type) // 取整
if (this.cow_type >= 3) {
   
    this.cow_type = 0
}

- 帧动画

• 添加帧动画组件

this.anim_com = this.node.addComponent('frame_anim')

• 播放

cowWalk () {
   
    this.anim_com.sprite_frames = this.cow_skin[this.cow_type].cow_status
    this.anim_com.duration = 0.5
    this.anim_com.play_loop()
}

• 移动组件

// 移动速度 this.speed_x = Math.random() * 200 + 200
update (dt) {
   
    var move_x = -(this.speed_x * dt)
    this.node.x += move_x
    if (this.node