Cocos—大作業：簡單H5小遊戲

• 2022 年 5 月 21 日
• 筆記
• cocos, Cocos學習, 監聽時間碰撞組件及回調, 資源池

Cocos大作業：傳統美食分分類

知識點清單：
場景切換，監聽時間，碰撞組件及回調，拖動角色移動，分數記錄，隨機數和定時器，背景音樂控制,資源池控制，預製體，進度條…
源碼+q:1431448323

效果圖展示

遊戲玩法如圖所示

製作流程

場景切換

在按鈕事件上

	cc.director.loadScene('Play');

拖動物體

掛載美食上即可

	start () {
        this.node.on('touchmove',this.func1,this);
    }
    func1(t){
        let p = this.node.parent.convertToNodeSpaceAR(t.getLocation());
 
            this.node.position=p;
    }

音樂管理

先構建如下

開關下面是兩張圖片

掛載腳本在『開關』上

flag是用於檢測開關的狀態

 @property(cc.Node)
    kaiguan: cc.Node = null;
    
    @property(cc.AudioClip)
     bgAudio:cc.AudioClip=null;

    audioID:number=0;
    flag =false ;
    
    protected onLoad(): void {
        this.audioID=cc.audioEngine.play(this.bgAudio,true,0.5);
    }
  

   
    click(){
        this.flag=!this.flag;
        if(this.flag){
            cc.audioEngine.pause(this.audioID);
            this.kaiguan.getChildByName("關閉").active=true;
        }
        else {
            cc.audioEngine.resume(this.audioID);
            this.kaiguan.getChildByName("關閉").active=false;
        }
        
    }

碰撞檢測

必須先開啟檢測
需要提前輸入目標名字

  @property(String)
    TargetName:string="1111";
    // @property(cc.AudioClip)
    // rightAudio:cc.AudioClip=null;
        // dfs:string="dfasdf";
    protected start(): void {
        let manager = cc.director.getCollisionManager();
        // 開啟碰撞檢測系統
        manager.enabled = true;

    }
     onCollisionStay(other,self){
      
        let b = other.world.aabb;
        let a = self.world.aabb;//b中是否包含a
        if(b.containsRect(a)&&other.node.name == this.TargetName){
            console.log('ok');
            MAIN.fenshu++;
        //   this.playRight();
            this.node.destroy();
        }
     }

資源池

預製體

cc.Prefab 資源池：cc.NodePool

	MAIN.pool2.put(newlibao);
	bao=MAIN.pool2.get();

cc.NodePool API: 放入put(),獲得get()

隨機數：

//介於1-3秒之間的隨機數，發禮包的隨機事件
        // Math.floor(Math.random()*(max-min+1)+min);
       if(this.rongqi.childrenCount>8)return ;

監聽時間

// 每0.5秒執行this.Food()函數
   this.schedule(this.Food,0.5);
        //10秒後執行over函數
        this.scheduleOnce(this.over,11);

隨機獲取食物顯示在盤子中

  Food(){
        //介於1-3秒之間的隨機數，發禮包的隨機事件
        // Math.floor(Math.random()*(max-min+1)+min);
       if(this.rongqi.childrenCount>8)return ;
       
        let suiji = Math.floor(Math.random()*(4-0+1)+0);
        
        let bao = null;

        if(suiji<1&&MAIN.pool1.size()>0)bao=MAIN.pool1.get();
        else if(suiji<2&&MAIN.pool2.size()>0)bao=MAIN.pool2.get();
        else if(suiji<3&&MAIN.pool3.size()>0)bao=MAIN.pool3.get();
        else if(suiji<4&&MAIN.pool4.size()>0)bao=MAIN.pool4.get();
        else return ;

        if(MAIN.pool4.size()==0){
            bao = cc.instantiate(this.yuebing);
        }

        //x坐標在-180到180之間隨機
        let randomX = Math.floor(Math.random()*(110+110+1)-110);
        bao.position = cc.v3(randomX,-160,0);
    
        
        

        this.rongqi.addChild(bao);
        
    }

結束

over(){
        this.replay.active = true;
        this.rongqi.destroy();  
        this.unscheduleAllCallbacks();   //取消所有定時器  
    }

更改分數

  update(t){
        if(this.txt.string == MAIN.fenshu.toString())
            return ;
        else  {
            this.txt.string = MAIN.fenshu.toString();
            cc.audioEngine.play( this.rightAudio,false,1);    
        
        }   
    }