CocosBuilder學習之一：認識CocosBuilder

CocosBuilder是一款原生的支持cocos2d和cocos2d-x的UI編輯器，它的功能很強大?，F在觸控開發的一款編輯器Cocostuido的功能要更加全面，CocosBuilder已落后，并且也不會再對它進行更新了。但是在做項目中發現，仍然有不少團隊在使用CocosBuilder,可能是因為第一次接觸編輯器，CocosBuilder容易上手，也許是項目初級Cocostudio還不是很成熟，不管是什么原因吧，現在仍然有很多同學在CocosBuilder的使用中迷茫著，這里把自己的一點使用心得來分享一下。

打開CocosBuilder的界面，如下圖

?

首先我們先來看看我們所用的版本，我現在用的是 3.0-alpha4，CocosBuilder的版本一定要和cocos2d-x引擎相對應，我所用的版本對應的是cocos2d-x 2.1.3,如果不對應，請到CocosBuilder網站去下載相應的程序包

下面我們先來新建一個CocosBuilder的項目吧,File > New >New Project

?

起個名字叫TestCocosBuilder

然后默認界面如下所示

?

我們來看CocosBuilder的幾個區域，工具條，文件區，渲染區，操作區，屬性區，當然這幾個區的名字是我自己起的，非官方的，不過我覺得還是挺有代表性的。

首先我們討論的是工具條

我們來看左邊的三個按鈕

這三個按鈕來控制渲染區大小的，+號就是用來放大渲染區的，-號可以縮小渲染區，=號是回到渲染區的原始比例，這三個按鈕可以幫助我們很輕松的調節渲染區的大小，方便我們來進行整體和細節的操作。

接下來這三個按鈕，如果用過XCode的同學們應該很熟悉，這就是控制者文件區，操作區，屬性區的隱藏和顯示的，當前狀態就是都顯示，當按下相應的按鈕，對應的區域就是隱藏。

下面是我們的結點按鈕們，

CCNode

用來創建一個CCNode結點，但是這個結點是不可顯示的，它會以OpenGl的原點為中心點，但是它沒有任何可渲染的內容，所以是空白的。

CCLayer,CCLayerColor,CCLayerGridient,CCScrollView

前面三個就是用來創建CCLayer,CCLayerColor,CCLayerGridient,不明白的同學去看代碼，這里就不在介紹它們三個了，我們著重介紹一下CCScrollView，新建一個CCScrollView,它是以左下角為零點的，我們來看它的屬性，最上面是JS Controller，但是我們不需要JS，所以在File >Project Settings 里面去掉勾選

然后繼續向下看，單選框Visible就是設置它的visible屬性，然后是Position，

前面四個是讓你來選取坐標系原點，第五個是設置相對坐標，第六個是根據設備的尺寸來進行縮放。我們這里采用第一種坐標系。然后可以設置X，Y的坐標值。

這里我們來設置的是CCScrollview的可滑動區域的大小。

?

用來設置錨點，不過對于CCLayer類和它的繼承類來說，應該不起作用，這里我們不做詳細介紹。

重要的是這里，我們可以設置我們已經編輯好的一個CCB文件來作為它的Container，還可以設置方向。

?

CCSprite

這里是用來新建CCSprite和CCScaleSprite的，下面我們來新建一個CCSprite,然后可以在屬性區來設置它的屬性，這里的主要屬性就是

設置一個圖片，透明度，和疊加顏色。

CCLabel

這是用來創建文本的

CCMenu

用來創建CCMenu按鈕

CCControlButton

用來創建CCControlbutton

?

粒子

CocosBuilder集成了粒子系統，不過對于相當多參數的粒子系統來說,還是建議大家用更加專業的工具來做。

CCBFile

這是CocosBuilder提供的一個強大的控件，它支持模塊化的設計，更好地實現的復用，這里支持把已編輯好的CCB文件加載到當前的CCB，相當好用。

?

Plugns是用來擴展插件的，我們也不做介紹了。

?

?

?

新建CCB文件

我們來新建一個編輯界面， File > New > New File,會彈出如下界面

這里我們可以選擇根節點的類型，一般來說我們新建一個界面，選擇的是CCLayer,根據你的屏幕大小來選取下面的尺寸，或者可以新建一個尺寸，這都是可以的。如果你想要新建一個以CCNode為根節點的界面，那你就選擇CCNode,然后把Full Screen的勾去掉。這里我們新建一個CCLayer，

注意你選擇的目錄不能和工程文件同級，因為這樣它會找不到test1,我們要選擇它的下級目錄。

總結

以上是生活随笔為你收集整理的CocosBuilder学习之一：认识CocosBuilder的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。