溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
寫在前面——
如果轉載請注明出處，謝謝大家支持
同步更新51CTO博客
——Forward
我的微博——龍顏碩
在《【Cocos2dx工具——Cocostudio界面編輯器】一》博客結束的時候，Forward提出兩個問題——1、有了編輯好的UI界面之后，我們如何把它們加載到程序中去呢？2、如何使對應的控件具有對應的功能呢？
帶著上面這兩個問題，我們開始今天的博客之旅——《【Cocos2dx工具——Cocostudio界面編輯器】二》
一、UI界面的加載
OK，在上一篇博客結束的時候，我們已經用編輯器完成了一個自己的UI，如下圖所示：
圖1
首先我們創建一個新的工程——UIEditorDemo。
從上一節的說明中我們看到，通過Cocostudio的界面編輯器編輯導出我們得出了一個如下圖所示的文件結構：
圖2
好的，下面我們需要的正式這個些資源，將他們拷貝到資源目錄下。
問題來了，有了這些資源與UI界面文件，難道要我們自己去實現解析、UI層級管理、事件響應實現？Cocostudio開發者怎么會這樣對我們呢（^_^）？他們已經為我們完成了上述提到問題的解決方案，在Cocostudio官網上，可以找到對應代碼下載（CocoGUILIB.zip）
將對應該的UI層級相關的代碼導入我們上面創建的UIEditorDemo工程中，（并按照編譯報告添加對應的頭文件路徑即可）
完成上面的工作之后，在我們的源文件中添加如下代碼：
COCOUISYSTEM->resetSystem(this);
COCOUISYSTEM->replaceUISceneWithFile(this, "NewProject.json", 1, true, true,true);
包含對應頭文件即可。
下面就是見證奇跡的時刻——
圖3
運行程序，我們看到如上圖3的運行結果，這不就是我們前天編輯的UI界面嗎。不錯，加載就是這么簡單。
二、UI事件的響應：
加載出我們編輯好的UI界面只是第一步，一個不能響應事件的界面是毫無意義的，接下來我們就需要知道如何讓這個界面能夠響應我們的操作，來完成玩家的交互。
好的，我們這就進入主題
首先我們需要理解UI層面控件的操作流程——只需要獲取UI層面這個控件，給它綁定一個事件的回調，然后在回調函數中實現我們的功能即可
這里我們拿ImageView的點擊放大與還原效果來做一次演示，其他類似。
操作ImageView（上面的頭像就是使用了ImageView）很簡單，代碼如下：
cs::CocoImageView* p_w_picpathView = (cs::CocoImageView*) (COCOUISYSTEM->getWidgetByName("ImageView_Header"));
p_w_picpathView->addPushDownEvent(this, coco_pushselector(HelloWorld::ScaleTo2Size));
p_w_picpathView->addReleaseEvent(this, coco_releaseselector(HelloWorld::ScaleResume));
好的，現在我們就需要再添加兩個函數ScaleTo2Size和ScaleResume即可，然后這兩個函數中分別對這個控件做擴大和還原處理——
voidHelloWorld::ScaleTo2Size(CCObject* pSender)
{
cs::CocoImageView* p_w_picpathView = (cs::CocoImageView*) (COCOUISYSTEM->getWidgetByName("ImageView_Header"));
p_w_picpathView->setScale(2.0f);
}
voidHelloWorld::ScaleResume(CCObject* pSender)
{
cs::CocoImageView* p_w_picpathView = (cs::CocoImageView*) (COCOUISYSTEM->getWidgetByName("ImageView_Header"));
p_w_picpathView->setScale(1.0f);
}
如上所示，頭像控件的名稱Forward已經在UI編輯器中修改為“ImageView_Header”，否會找不到的。
看看效果吧~~
原始頭像大小如下：
圖4
圖5
確實按照我們的預期進行了……
在這篇博客中，我們已經解決了在《【Cocos2dx工具——Cocostudio界面編輯器】一》博客末尾提出的兩個問題。至此我么可以說是已經做到了“知其然”，但是到底整個CocoGUILIB是如何工作的呢？從文件解析到控件創建，其中的Touch事件又是如何接收與處理呢？CocoGUILIB的結構是什么樣子呢？我們現在只是管中窺豹，見其一角，未盡全貌，要是解決了以上提及的問題，或許才可以說“知其所以然”。
對于以上問題，Forward會在《【Cocos2dx工具——Cocostudio界面編輯器】三》中做進一步深入學習與分享~~
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
