联网对战游戏开发实例之《斗兽棋》（附源码）

最新推荐文章于 2025-05-18 21:32:55 发布

原创

最新推荐文章于 2025-05-18 21:32:55 发布 · 7.2k 阅读

23 ·

CC 4.0 BY-SA版权

文章标签：

#Cocos #游戏开发 #微信小游戏 #游戏服务器 #游戏服务器引擎

本文介绍了使用Cocos Creator和Matchvs JavaScript SDK开发一款回合制休闲游戏《斗兽棋》的过程，包括用户登录、随机匹配和创建房间、游戏同步的实现。提供体验链接和源码地址，详细讲解了游戏开发的各个步骤，从登录场景的创建到游戏同步的处理，最后通过Cocos的一键发布功能上线微信小游戏。

本次，Matchvs为大家带来的是一款回合制休闲游戏的开源案例。玩家双方在一个4X4的棋盘上，遵循食物链的规则玩法下进行翻牌与追逐，最终以场上存活的一方为获胜者。

体验地址:http://demo.matchvs.com/AnimalChecker-mobile

源码地址：:https://github.com/matchvs/AnimalChecker

首先你需要下载Cocos Creator 和Matchvs JavaScript SDK。本次游戏设计的实现步骤主要拆分为用户登录、随机匹配和创建房间、以及同屏游戏三个部分完成。

用户登录

使用Cocos Creator(以下简称CC)创建游戏登录场景

使用CC 拖动控件, 还原设计稿 , 依托CC的良好的工作流,使得这部分的工作可以由游戏策划或者UI设计者来完成,程序开发者只需要在场景中挂载相应的游戏逻辑脚本. 举个例子,在登录按钮挂在一个uiLogin.js的脚本完成用户登录功能.

uilogin.fire

新建一个uiLogin.js,按 1,2,3 三个步骤挂载到场景中.

新建js脚本文件
选中场景任一控件
添加组件,选中刚新建的脚本,

在脚本的on'Load函数中给按钮添加点击监听,触发登录操作

onLoad() {
     this.nodeDict["start"].on("click", Game.GameManager.matchVsInit, Game.GameManager);
}

实现this.startGame函数. 登录之前需要初始化Matchvs SDK:

uiLogin.js

uiLogin.js
---

var uiPanel = require("uiPanel");
cc.Class({
    extends: uiPanel,
    properties: {},

    onLoad() {
        this._super();
    },

    start() {
        if (window.wx) {
            this.nodeDict["start"].active = false;
            wx.getSystemInfo({
                success: function(data) {
                    Game.GameManager.getUserInfoBtn = wx.createUserInfoButton({
                        type: 'text',
                        text: '开始多人游戏',
                        style: {
                            left: data.screenWidth * 0.2,
                            top: data.screenHeight * 0.73,
                            width: data.screenWidth * 0.65,
                            height: data.screenHeight * 0.07,
                            lineHeight: data.screenHeight * 0.07,
                            backgroundColor: '#fe714