前言：該游戲項目主要是基于前端引擎Cocos Creator開發(fa)(fa)，涉及后端聯網的(de)部分，則通過接入Matchvs SDK完(wan)成快(kuai)速開發(fa)(fa)工作。

 

《組隊小雞射擊》玩法簡介：
雙方(fang)通過控制各自(zi)小雞，通過不斷點擊(ji)(ji)屏幕進行(xing)空中飛行(xing)射擊(ji)(ji)，被擊(ji)(ji)中者將消(xiao)耗以愛心為單位的(de)生命(ming)值，游戲支持四(si)人(ren)同時實時對戰。

點擊并拖拽以移動?

實現步驟

游(you)戲(xi)實現(xian)部分可拆(chai)分為三個步驟來實現(xian)：用戶登錄、隨機匹配和(he)創建房間(jian)及同(tong)屏(ping)游(you)戲(xi)。

• 用戶登錄

?使用Cocos Creator(以下簡稱CC)創建(jian)游(you)戲(xi)登(deng)錄場景(jing)

? 使(shi)用CC 拖動控件, 還原設計稿(gao) , 依托CC的良好的工作流(liu),使(shi)得(de)這部分(fen)的工作可(ke)以由游(you)戲(xi)策(ce)劃或者UI設計者來(lai)完(wan)成,程序開發(fa)者只需要(yao)在場景中掛(gua)載(zai)相(xiang)應的游(you)戲(xi)邏輯(ji)腳(jiao)本. 舉個例子,在登錄(lu)(lu)按鈕掛(gua)在一(yi)個uiLogin.js的腳(jiao)本完(wan)成用戶(hu)登錄(lu)(lu)功能.

uilogin.fire

 

新建js腳本文件

選中場景任一控(kong)件

添加組件,選中剛新建的腳(jiao)本,

 在腳本的onLoad函數中給(gei)按(an)鈕添加點擊監聽(ting),觸發登錄操作(zuo)

uiLogin.js
?
onLoad() {

this.nodeDict["start"].on("click", this.startGame, this);

},
startGame() {

Game.GameManager.matchVsInit();

}

實現this.startGame函數. 登錄之(zhi)前(qian)需要初始化Matchvs SDK:

uiLogin.js

uiLogin.js
var uiPanel = require("uiPanel");
cc.Class({

extends: uiPanel,
properties: {},

?

onLoad() {
    this._super();
    this.nodeDict["start"].on("click", this.startGame, this);
},

?

startGame() {
    Game.GameManager.matchVsInit();
}

});
?
?
Game.GameManager.js

matchVsInit: function() {

mvs.response.initResponse = this.initResponse.bind(this);
mvs.response.errorResponse = this.errorResponse.bind(this);
// 用戶登錄之后的回調
mvs.response.loginResponse = this.loginResponse.bind(this); 

?

var result = mvs.engine.init(mvs.response, GLB.channel, GLB.platform, GLB.gameId);
if (result !== 0) {
    console.log('初始化失敗,錯誤碼:' + result);
}

}
 

channel: 'MatchVS',
platform: 'alpha',
gameId: 201330,
gameVersion: 1,
appKey: '7c7b185482d8444bb98bc93c7a65daaa',
secret: 'f469fb05eee9488bb32adfd85e4ca370',

注冊成功后,登(deng)錄Matchvs游戲云,返回UserID,登(deng)錄成功.

gameManager.js
?
registerUserResponse: function(userInfo) {

var deviceId = 'abcdef';
var gatewayId = 0;
GLB.userInfo = userInfo;

?

console.log('開始登錄,用戶Id:' + userInfo.id)

?

var result = mvs.engine.login(
    userInfo.id, userInfo.token,
    GLB.gameId, GLB.gameVersion,
    GLB.appKey, GLB.secret,
    deviceId, gatewayId
);
if (result !== 0) {
    console.log('登錄失敗,錯誤碼:' + result);
}

},
?
loginResponse: function(info) {

if (info.status !== 200) {
    console.log('登錄失敗,異步回調錯誤碼:' + info.status);
} else {
    console.log('登錄成功');
    this.lobbyShow();
}

},

• 隨機匹配和創建房間

使用(yong)CC創建大(da)廳(ting)場景(jing)(uiLobbyPanel.fire)給用(yong)戶選擇匹配方式(shi),創建匹配場景(jing)(uiMatching1v1.fire) 給用(yong)戶反(fan)饋比配進度

 

 

和登錄(lu)功能的(de)實現步驟類似:寫一個(ge) uiMatching1v1.js腳本掛(gua)在到場景中的(de)控件(jian)上.

uiMatching1v1.js

joinRandomRoom: function() {

var result = mvs.engine.joinRandomRoom(GLB.MAX_PLAYER_COUNT, '');
if (result !== 0) {
    console.log('進入房間失敗,錯誤碼:' + result);
}

},
 通過監聽joinRoomResponse和joinRoomNotify匹配(pei)結(jie)果

gameManager.js

joinRoomResponse: function(status, roomUserInfoList, roomInfo) {

if (status !== 200) {
    console.log("失敗 joinRoomResponse:" + status);
    return;
}
var data = {
    status: status,
    roomUserInfoList: roomUserInfoList,
    roomInfo: roomInfo
}
// 把事件發給關心這個事件的節點腳本
clientEvent.dispatch(clientEvent.eventType.joinRoomResponse, data);

},
?
joinRoomNotify: function(roomUserInfo) {

var data = {
    roomUserInfo: roomUserInfo
}
clientEvent.dispatch(clientEvent.eventType.joinRoomNotify, data);

},

• 同屏游戲 , 實現游戲同步

還是按照(zhao)上面的套路,新(xin)建場景(uiGamePanel.fire),在playerManager.js中,加載了(le)player.js.在player.js中,攻擊的動作(zuo)使(shi)用(yong)Matchvs 的 sendEventEx發出,

 

player.js

hurt: function(murderId) {

var msg = {
    action: GLB.PLAYER_HURT_EVENT,
    playerId: this.userId,
    murderId: murderId
};
Game.GameManager.sendEventEx(msg);

}
另一方的客戶端收到后(hou)處(chu)理事情(qing);

gameManager.js
?
// 玩家行為通知--
sendEventNotify: function(info) {

if (info.cpProto.indexOf(GLB.PLAYER_HURT_EVENT) >= 0) {
    if (Game.GameManager.gameState !== GameState.Over) {
        player = Game.PlayerManager.getPlayerByUserId(cpProto.playerId);
        if (player) {
            player.hurtNotify(cpProto.murderId);
        }
        // 檢查回合結束--
        var loseCamp = Game.PlayerManager.getLoseCamp();
        if (loseCamp != null) {
            Game.GameManager.gameState = GameState.Over
            if (GLB.isRoomOwner) {
                this.sendRoundOverMsg(loseCamp);
            }
        }
    }
}

}
?
開(kai)發完成后， 再通過CC的微(wei)信(xin)小游(you)戲一鍵發布(bu)功能上線微(wei)信(xin)即可(ke)。