cocostudio Cocos2D-X引擎工具集2.0.2 官網(wǎng)正式版

CocoStudio是一套基于Cocos2D-X引擎的工具集，包括UI編輯器、動(dòng)畫編輯器、場景編輯器和數(shù)據(jù)編輯器。我們剛才說過，工作流程和部門分工導(dǎo)致了人員價(jià)值并沒有實(shí)現(xiàn)最大化，而CocoStudio工具集解決的就是這方面的問題。它的整體思路就是減少程序員的工作壓力，讓策劃、UI、動(dòng)畫等方面的負(fù)責(zé)人可以通過CocoStudio工具集中對應(yīng)的工具，把動(dòng)畫、圖像等元素直接轉(zhuǎn)化成類似模塊的代碼，程序員在編碼過程中，只要直接將相關(guān)對應(yīng)內(nèi)容調(diào)入實(shí)現(xiàn)即可。

UI編輯器

我先從UI編輯器先講起，我們介紹的第一個(gè)工具是UI編輯器。我們先來看一段視頻，“界面左邊是一排控件，我們把所有的控件拖到界面當(dāng)中去，調(diào)整坐標(biāo)，在右邊設(shè)置它們的屬性。因?yàn)檫@個(gè)視頻就是我們開發(fā)人員錄的，我們也沒有找專業(yè)的美術(shù)，所以做得可能不是很專業(yè)。這個(gè)視頻演示了幾個(gè)不常用的控件。大家 可以看到，除了編輯功能，其他什么都沒有，很簡單。”

UI編輯器是支持碎圖合并功能，大家通過剛才的視頻也看到我們拖了很多的控件，用到了很多的圖，我們導(dǎo)出的時(shí)候可能有很多圖。大家都清楚，圖片數(shù)量 如果非常多的話，在程序里面加載會(huì)非常低效。所以通常大家會(huì)使用一些第三方工具，將圖合并成一張。這樣的話，在程序里面的運(yùn)行效率會(huì)比較高，我們現(xiàn)在把這 個(gè)功能也直接集成到UI編輯器里面。這樣的話，大家在導(dǎo)出的時(shí)候就不需要再借助一些第三方工具再去合圖。

自定義UI模板是我介紹的UI編輯器的第三種功能，我們在做這個(gè)游戲的時(shí)候，比如我們做了一個(gè)商店界面或者一個(gè)設(shè)置界面，我 下一個(gè)游戲的時(shí)候還需要這個(gè)界面，我不想重復(fù)造輪子，我可以把這個(gè)界面保存成模板，我在下一個(gè)項(xiàng)目當(dāng)中把這個(gè)模板導(dǎo)進(jìn)來，我們替換相應(yīng)的資源，保證我們制作上是非常高效的。這就是我剛才介紹的UI編輯器，當(dāng)然它還有很多其他的功能，希望大家會(huì)后下載，可以自己去體驗(yàn)。

動(dòng)畫編輯器

我們?nèi)鄙僮鰟?dòng)畫的工具，所以我們做了一個(gè)簡單的動(dòng)畫編輯器，把這張圖放在這兒。這是剛才視頻里面演示的，也是這次我們要公布的新的動(dòng)畫編輯器的界面。兩個(gè)編輯器對比起來我們會(huì)發(fā)現(xiàn)，現(xiàn)在的編輯器比以前要專業(yè)一些。為什么要放這兩張圖，我想說的是，動(dòng)畫編輯器是給美術(shù)設(shè)計(jì)師用的，所以我 們在界面設(shè)計(jì)上是盡量參考美術(shù)經(jīng)常使用的一些軟件，無論是從界面上還是快捷鍵這些功能，盡量是保持美術(shù)的習(xí)慣。

他們在使用這個(gè)動(dòng)畫編輯器的時(shí)候就非常容易 上手，不存在什么門檻。同樣我們動(dòng)畫編輯器就是只能做動(dòng)畫，我們動(dòng)畫設(shè)計(jì)師在使用這個(gè)編輯器的時(shí)候，它的功能是非常純粹的。這樣的話，我們這個(gè)編輯器所表 現(xiàn)的動(dòng)畫功能，相信它會(huì)比其他工具的動(dòng)畫編輯功能更專業(yè)。

碎圖合并，因?yàn)閯偛盼覀僓I編輯器是有碎圖合并，而且我們使用得非常爽，所以我們把這個(gè)功能也合并到我們動(dòng)畫編輯器。如果我們做了一個(gè)動(dòng)畫，最終我們可以合并成一張圖，而且這個(gè)東西在我們動(dòng)畫編輯器和UI編輯器導(dǎo)出的時(shí)候是自動(dòng)的。剛才提到骨骼動(dòng)畫的時(shí)候，我說了很多序列幀不好的地方，但是序列幀確實(shí)在做一些動(dòng)畫，或者是有一些特效還是非常有用的。比如說我們在做角色動(dòng)作的時(shí)候，序列幀還是非常關(guān)鍵的，包括我們做一些爆炸特效，做一些火焰特效的話，序列幀實(shí)現(xiàn)的效果比較好。動(dòng)畫編輯器依然支持序列幀，而且我們把序列幀做得非常簡單，非常高效。剛才大家也看到了，我們只需要三個(gè)操作就可以把序列幀完成。

數(shù)據(jù)編輯器與場景編輯器

UI編輯器和動(dòng)畫編輯器都是給美術(shù)用的，下面我們介紹兩個(gè)編輯器是給策劃用的，先說數(shù)據(jù)編輯器。數(shù)據(jù)編輯器非常簡單，它就是把策劃用的Excel數(shù) 值表分解，然后轉(zhuǎn)化成Cocos2D-X可以識(shí)別的格式，雖然說這個(gè)功能非常簡單，可能大家覺得不重要。但是我們之前做游戲的話，我們的策劃是一直在用 Excel做數(shù)值表的。這是我們的數(shù)據(jù)編輯器，中間我們會(huì)去分析這里面每一個(gè)表單，然后把它列在上面，右邊是顯示我們的數(shù)值，我們可以轉(zhuǎn)換和拷出，把一張 非常大的表分解成每一個(gè)小表。數(shù)據(jù)編輯器可以配合場景編輯器來使用，大家看一下這個(gè)方塊是什么，這里面我來解釋一下，我們這個(gè)場景編輯器是基于實(shí)體和組件的模式，我們創(chuàng)建一些實(shí)體，就是一個(gè)一個(gè)的方塊。把所有的功能設(shè)計(jì)成一個(gè)一個(gè)組件，分別綁在這些實(shí)體上。我們看到創(chuàng)建了一個(gè)實(shí)體，綁定一個(gè)動(dòng)畫組件就可以實(shí)現(xiàn)一個(gè)動(dòng)畫加入到場景中，場景編輯器就是實(shí)現(xiàn)將所有的資源整合在一起。

FrameWorkforCocoStudio

這套 FrameWork是基于Cocos2D-X的，基于實(shí)體和組件開發(fā)的�，F(xiàn)在我們是把它開放給大家去試用，而且我們會(huì)有一個(gè)團(tuán)隊(duì)一直在維護(hù)這套框架�？蚣� 本身是支持Javascript腳本的，如果大家想去快速的開發(fā)游戲原型，相信這個(gè)框架是非常適合的，因?yàn)槲覀兣浜线@個(gè)場景編輯器，配合我們 CocoStudio其他的工具，再配合這個(gè)框架，可以快速的做出游戲原型。場景編輯器可以整合我們之前CocoStudio其他編輯器的資源，構(gòu)成當(dāng)前 的游戲關(guān)卡，同時(shí)也支持第三方的工具模式，剛才大家也看到了里面噴泉的粒子效果。后續(xù)我們在場景編輯器里面也會(huì)開發(fā)插件系統(tǒng)，大家可以二次開發(fā)自定義的控件。

手游開發(fā)工具(cocostudio)的特點(diǎn)

CocoStudio的核心特點(diǎn)就是

實(shí)體+組件的設(shè)計(jì)模式，讓游戲代碼功能解耦。結(jié)構(gòu)清晰，易于維護(hù)；

數(shù)據(jù)驅(qū)動(dòng)，減少冗余代碼，提升編程效率，降低錯(cuò)誤風(fēng)險(xiǎn)；

實(shí)時(shí)模擬，設(shè)計(jì)人員不需要寫代碼即可看到游戲效果。讓團(tuán)隊(duì)之間依賴性得到解耦，降低溝通成本；

易于擴(kuò)展，CocoStudio將實(shí)現(xiàn)插件機(jī)制，方便開發(fā)者自己定制編輯器，滿足自己的特殊需求；

易學(xué)易用，CocoStudio從設(shè)計(jì)上盡量迎合不同職業(yè)開發(fā)人員的使用習(xí)慣，操作及熱鍵參考常用的工具；

支持腳本，使用腳本化來開發(fā)游戲，讓游戲的開發(fā)更簡單，并且易于更新，降低風(fēng)險(xiǎn)；