一种基于Unity编辑器的Cocos2dx UI界面搭建方法[发明专利]

(19)中华人民共和国国家知识产权局

(12)发明专利申请

(10)申请公布号

CN 112817585 A

(43)申请公布日

2021.05.18

(21)申请号 2.6

(22)申请日 2021.02.26

(71)申请人 厦门极致互动网络技术股份有限公

司

地址 361000 福建省厦门市火炬高新区软

件园创新大厦C区3F-A343

(72)发明人 刘沛然　

(74)专利代理机构 厦门致群财富专利代理事务

所(普通合伙) 35224

代理人 刘兆庆

(51).

G06F

8/34

(2018.01)

G06F

8/38

(2018.01)

G06F

8/41

(2018.01)

权利要求书1页 说明书4页 附图1页

C

N

1

1

2

8

1

7

5

8

5

A

(54)发明名称

一种基于Unity编辑器的Cocos2dx UI界面

搭建方法

(57)摘要

本发明公开了一种基于Unity编辑器的

包括如下步骤：S1、解Cocos2dxUI界面搭建方法，

析ccb文件以得到UI节点层级信息、每个UI节点

的类型及对应的属性；S2、根据UI节点层级信息

构建基本UI节点树；S3、根据每个UI节点的类型

和属性，在对应的UI节点上挂上对应的Unity组

件，并设置对应的属性，使其可以显示，从而搭建

出UI界面；S4、保存回对应的ccb文件；S5、通过

ccb文件生成对应的可供游戏使用的ccbi文件。

本发明的方法可以替换原来Mac的CocosBuilder

来搭建UI界面，从而降低客户端开发对于Mac机

的需求，降低游戏开发的硬件成本，同时提升

Cocos2dx客户端的开发效率。

CN 112817585 A

权　利　要　求　书

1/1页

1.一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在于：包括如下步骤：

S1、解析ccb文件以得到UI节点层级信息、每个UI节点的类型及对应的属性；

S2、根据UI节点层级信息构建基本UI节点树；

S3、根据每个UI节点的类型和属性，在对应的UI节点上挂上对应的Unity组件，并设置

对应的属性，使其可以显示，从而搭建出UI界面；

S4、保存回对应的ccb文件；

S5、通过ccb文件生成对应的可供游戏使用的ccbi文件。

2.如权利要求1所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：步骤S1中所述解析ccb文件，是通过C#提供的XmlDocument解析库直接对ccb文件进行解

析。

3.如权利要求2所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：所述UI节点的类型包括：CCNode类型节点、CCLabelTTF类型节点、CCSprite类型节点、

CCScale9Sprite类型节点、CCRichText类型节点、CCBFile类型节点和CCControlButton类

型节点。

4.如权利要求3所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：不同类型的所述UI节点对应的属性分别为：

所述CCNode类型节点，用于设置UI节点的位置和大小，可以转化为Unity的

RectTransform组件；

所述CCLabelTTF类型节点，用于普通文本的设置，可以转化为Unity的文本组件；

所述CCSprite类型节点，用于设置图片，可以转化为Unity的图片组件；

所述CCScale9Sprite类型节点，用于设置九宫格图片，可以转化为Unity的图片组件；

所述CCRichText类型节点，用于设置附文本，可以转化为Unity的文本组件；

所述CCBFile类型节点，可以应用其他的ccb文件，用于显示子界面；

所述CCControlButton类型节点，为按钮控件，使用Unity的图片搭配文本组件来等价

实现。

5.如权利要求1所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：所述步骤S3还包括对所述UI界面进行修改，所述修改在Inspector面板上进行。

6.如权利要求1所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：所述步骤S4具体为：从所述UI节点树的根节点即第一个父节点开始，采用深度优先搜索

算法遍历整个节点树，然后利用C#提供的XmlDocument解析库回写为ccb文件。

7.如权利要求6所述的一种基于Unity编辑器的Cocos2dx UI界面搭建方法，其特征在

于：所述步骤S5具体为：

S51、利用C#的XmlDocument解析库解析所述ccb文件，在内存中构建出节点树；

S52、遍历所述节点树的所有节点的属性，构建出字符串缓存映射；

S53、根据ccbi文件结构遍历所述节点树信息，按照ccbi文件结构回写成ccbi文件。

2

CN 112817585 A

说　明　书

一种基于Unity编辑器的Cocos2dx UI界面搭建方法

1/4页

技术领域

[0001]

本发明涉及UI界面搭建技术领域，特别涉及一种基于Unity编辑器的Cocos2dx UI

界面搭建方法。

背景技术

[0002]

在部分游戏项目中，客户端开发使用的是Cocos2dx版本，其大部分的游戏逻辑代

码的开发是在Windows操作系统上进行的，而搭建UI界面使用的工件是Mac操作系统上的

CocosBuilder，搭建UI界面和修改UI界面在游戏开发中占有很大的比重。这样UI开发流程

再配存在以下弊端：1、如果客户端开发人员每人配备一台Windows电脑用于游戏逻辑开发，

备一台Mac机用于UI界面开发，势必会加重企业硬件成本；2、若Mac机不是客户端开发人员

人手一台，则客户端开发人员需要通过远程连接软件远程连接到Mac机上进行UI界面的搭

建工作，远程操作有网络延迟和显示延迟的缺陷，并且Mac机不够的情况下，客户端开发人

员需要排队等待，影响开发工作的效率；3、在开发过程中，Windows开发机需要将UI界面需

要的图集通过网络传输同步到Mac机上，通过Mac机搭建完的界面文件需要同步传输回

Windows开发机，多了同步传输的冗余操作和时间等待消耗，同样不利于提高开发工作的效

率。

发明内容

[0003]

为解决上述问题，本发明提供了一种基于Unity编辑器的Cocos2dx UI界面搭建方

法。

[0004]

本发明采用以下技术方案：

[0005]

一种基于Unity编辑器的Cocos2dx UI界面搭建方法，包括如下步骤：

[0006]

S1、解析ccb文件以得到UI节点层级信息、每个UI节点的类型及对应的属性；

[0007]

S2、根据UI节点层级信息构建基本UI节点树；

[0008]

S3、根据每个UI节点的类型和属性，在对应的UI节点上挂上对应的Unity组件，并

设置对应的属性，使其可以显示，从而搭建出UI界面；

[0009]

S4、保存回对应的ccb文件；

[0010]

S5、通过ccb文件生成对应的可供游戏使用的ccbi文件。

[0011]

进一步地，步骤S1中所述解析ccb文件，是通过C#提供的XmlDocument解析库直接

对ccb文件进行解析。

[0012]

进一步地，所述UI节点的类型包括：CCNode类型节点、CCLabelTTF类型节点、

CCSprite类型节点、CCScale9Sprite类型节点、CCRichText类型节点、CCBFile类型节点和

CCControlButton类型节点。

[0013]

进一步地，不同类型的所述UI节点对应的属性分别为：

[0014]

所述CCNode类型节点，用于设置UI节点的位置和大小，可以转化为Unity的

RectTransform组件；

3

CN 112817585 A

[0015]

[0016]

[0017]

说　明　书

2/4页

所述CCLabelTTF类型节点，用于普通文本的设置，可以转化为Unity的文本组件；

所述CCSprite类型节点，用于设置图片，可以转化为Unity的图片组件；

所述CCScale9Sprite类型节点，用于设置九宫格图片，可以转化为Unity的图片组

件；

所述CCRichText类型节点，用于设置附文本，可以转化为Unity的文本组件；

[0019]

所述CCBFile类型节点，可以应用其他的ccb文件，用于显示子界面；

[0020]

所述CCControlButton类型节点，为按钮控件，使用Unity的图片搭配文本组件来

等价实现。

[0021]

进一步地，所述步骤S3还包括对所述UI界面进行修改，所述修改在Inspector面板

上进行。

[0022]

进一步地，所述步骤S4具体为：从所述UI节点树的根节点即第一个父节点开始，采

用深度优先搜索算法遍历整个节点树，然后利用C#提供的XmlDocument解析库回写为ccb文

件。

[0023]

进一步地，所述步骤S5具体为：

[0024]

S51、利用C#的XmlDocument解析库解析所述ccb文件，在内存中构建出节点树；

[0025]

S52、遍历所述节点树的所有节点的属性，构建出字符串缓存映射；

[0026]

S53、根据ccbi文件结构遍历所述节点树信息，按照ccbi文件结构回写成ccbi文

件。

[0027]

采用上述技术方案后，本发明与背景技术相比，具有如下优点：

[0028]

1、由于Unity编辑器可以在Windows上使用，因此本发明的方法可以替换原来Mac

的CocosBuilder来搭建UI界面，从而降低客户端开发对于Mac机的需求，降低游戏开发的硬

件成本；

[0029]

2、现有的游戏UI界面开发需要分别到Windows和Mac两台电脑上进行，使用本发明

的方法，客户端开发人员只需要在Windows电脑就可以完成UI界面的开发工作，提升

Cocos2dx客户端的开发效率。

附图说明

[0030]

图1为本发明的方法流程示意图。

具体实施方式

[0031]

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对

本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并

不用于限定本发明。

[0032]

实施例

[0033]

如图1所示，一种基于Unity编辑器的Cocos2dx UI界面搭建方法，包括如下步骤：

[0034]

S1、解析ccb文件以得到UI节点层级信息、每个UI节点的类型及对应的属性；

[0035]

这里的ccb文件是cocos builder界面描述文件，其本质为明文的xml文件，主要描

述UI节点树的层级以及各个节点的类型和基础属性，比如这个节点是文本控件节点还是图

片控件节点、节点的位置、大小和需要用什么贴图等等。

4

[0018]

CN 112817585 A

[0036]

说　明　书

3/4页

因为ccb文件本质上是xml文件，所以本实施例步骤S1中直接使用C#提供的

XmlDocument解析库对ccb文件内容进行解析。

[0037]

所述UI节点的类型包括：CCNode类型节点、CCLabelTTF类型节点、CCSprite类型节

点、CCScale9Sprite类型节点、CCRichText类型节点、CCBFile类型节点和CCControlButton

类型节点。

[0038]

不同类型的所述UI节点对应的属性分别为：

[0039]

(1)所述CCNode类型节点，用于设置UI节点的位置和大小，可以转化为Unity的

Rect Transform组件；

[0040]

(2)所述CCLabelTTF类型节点，用于普通文本的设置，可以转化为Unity的文本组

件；

[0041]

(3)所述CCSprite类型节点，用于设置图片，可以转化为Unity的图片组件；

[0042]

(4)所述CCScale9Sprite类型节点，用于设置九宫格图片，可以转化为Unity的图

片组件(Image组件)；

[0043]

(5)所述CCRichText类型节点，用于设置附文本，可以转化为Unity的文本组件

(Text组件)；

[0044]

(6)所述CCBFile类型节点，可以应用其他的ccb文件，用于显示子界面；

[0045]

为按钮控件，使用Unity的图片搭配文本组件(7)所述CCControlButton类型节点，

来等价实现。

[0046]

S2、根据UI节点层级信息构建基本UI节点树；

[0047]

S3、根据每个UI节点的类型和属性，在对应的UI节点上挂上对应的Unity组件，并

设置对应的属性，使其可以显示，从而搭建出UI界面；

[0048]

所述步骤S3还包括对所述UI界面进行修改，所述修改在Inspector面板上进行。这

里的修改包括添加或删除子节点、编辑节点属性等操作。

[0049]

根据不同的节点类型，需要编写不同的C#脚本代码来表示不同的类型的节点，比

如一个CCNode节点对应实现一个CCNode类类型，一个图片CCSprite节点对应实现一个

CCSprite类型，在Unity中，只要是而这些类型都继承于Unity的

haviour类型，在Unity中，只要是来自于haviour

的子类，那么其公有的成员变量都可以在Inspector面板上做显示和修改。

[0050]

搭建或修改完界面后，就可以执行步骤S4、保存回对应的ccb文件；

[0051]

所述步骤S4具体为：从所述UI节点树的根节点即第一个父节点开始，采用深度优

先搜索算法遍历整个节点树，然后利用C#提供的XmlDocument解析库回写为ccb文件。

[0052]

S5、通过ccb文件生成对应的可供游戏使用的ccbi文件。

[0053]

这里的ccbi文件是由ccb文件生成的二进制文件，比ccb文件小，cocos游戏客户端

可以通过读取ccbi文件来创建界面。

[0054]

所述步骤S5具体为：

[0055]

S51、利用C#的XmlDocument解析库解析所述ccb文件，在内存中构建出节点树；

[0056]

S52、遍历所述节点树的所有节点的属性，构建出字符串缓存映射；比如一个节点

中有位置(Position)属性，可以将0与位置属性挂钩，也就是说，在某些语义下用0来替换位

置属性的字符串；

5

CN 112817585 A

[0057]

说　明　书

4/4页

S53、根据ccbi文件结构遍历所述节点树信息，按照ccbi文件结构回写成ccbi文

件。

以上所述，仅为本发明较佳的具体实施方式，但本发明的保护范围并不局限于此，

任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到的变化或替换，

都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应该以权利要求的保护范围

为准。

[0058]

6

CN 112817585 A

说　明　书　附　图

1/1页

图1

7