一、Cocos編輯器
自動布局系統主要涉及固定與拉伸屬性：
如圖，總共可以修改控件的上下左右四個圖釘和中間的兩個拉伸條六個屬性。
效果
1.當打開其中的任意一個圖釘時，當前節點與父節點的對應邊的距離即被固定。當父節點的大小修改時，當前節點與父節點對應邊的距離總是不變。
2.當打開其中的任意兩個相對的圖釘時，當前節點與父節點對應的兩邊的距離成固定比例。即當修改父節點的大小時，當前節點到父節點對應兩條邊的距離之比總是不變的。
3.當開啟中間任意一條拉伸條，如橫向拉伸條，節點的寬度與父節點的寬度之比固定不變。
其他
1. 不開啟上述任意屬性時，對象默認相對左下角位置不變。
2. 當前僅控件對象（文本、FNT字體也沒有）和容器兩種類型有拉伸條屬性。
二、Cocos 2d-x(Cocos Framework)中的相關概念及代碼設置
設計分辨率和屏幕分辨率：
首先我們需要了解兩個概念：在Cocos2d-x中有兩種分辨率：設備分辨率、屏幕分辨率。設備分辨率即當前游戲所運行平台的實際分辨率；設計分辨率就是我們設計的游戲的分辨率。
設計分辨率是可設置的，是我們的游戲程序能夠“感知到”的分辨率大小，我們的界面超過這個區域的部分都不會顯示。
設計分辨率一般在啟動時進行設置
AppDelegate::applicationDidFinishLaunching
中進行，代碼如下：
director->getOpenGLView()->setDesignResolutionSize(960,640,ResolutionPolicy::FIXED_HEIGHT);
(這句代碼上邊還有一句createWithRect這個是在桌面系統上，創建游戲模擬器用的。可以修改里邊的Rect的后邊兩個值來修改設備分辨率，但這個值在移動設備上是無效的。)
這句代碼什么意思呢？
這里把設計分辨率設置為960，640，並把游戲界面調整方案設置為固定寬度。但這么設置之后，我們后邊再獲取設計分辨率時得到的大小卻不一定是960，640。這又是為什么呢？
看看源碼：
轉到setDesignResolutionSize的定義看看。里邊做了一些判斷和賦值，最終調用了updateDesignResolutionSize，繼續轉到updateDesignResolutionSize里邊，這個函數的部分代碼如下：
//1.計算游戲界面在縮放至充滿屏幕的情況下X、Y軸的縮放率:
_scaleX= (float)_screenSize.width/ _designResolutionSize.width;
_scaleY= (float)_screenSize.height/ _designResolutionSize.height;
//2.根據設配策略，調整縮放率和設計分辨率:
if(_resolutionPolicy== ResolutionPolicy::NO_BORDER)
{//將X、Y軸縮放值設置為其中的最大者
_scaleX = _scaleY = MAX(_scaleX,_scaleY);
}
else if(_resolutionPolicy== ResolutionPolicy::SHOW_ALL)
{//將X、Y軸縮放值設置為其中的最小者
_scaleX = _scaleY = MIN(_scaleX,_scaleY);
}
else if( _resolutionPolicy == ResolutionPolicy::FIXED_HEIGHT) {
_scaleX = _scaleY;//將X、Y軸縮放值固定為Y軸縮放值，調整設計分辨率的寬度，使設計分辨率的寬度在縮放后依然能夠充滿屏幕。
_designResolutionSize.width= ceilf(_screenSize.width/_scaleX);
}
else if( _resolutionPolicy == ResolutionPolicy::FIXED_WIDTH) {
_scaleY= _scaleX;//將X、Y軸縮放值固定為X軸縮放值，調整設計分辨率的高度，使設計分辨率的高度在縮放后依然能夠充滿屏幕。
_designResolutionSize.height= ceilf(_screenSize.height/_scaleY);
}
//其他縮放策略：EXACT_FIT不作調整這段代碼主要做了兩件事：
1.根據設備分辨率和設計分辨率計算游戲界面的縮放率；
2.調整設計分辨率。
根據以上源碼我們應該很容易就能夠理解幾種縮放策略的意義：
·NO_BORDER就是在保持設計分辨率大小不變的情況下，將游戲界面按比例縮放至充滿屏幕。游戲的上下或者左右兩邊可能會被裁剪。
·SHOW_ALL(Cocos 2d-x默認方案)就是在保持設計分辨率大小不變的情況下，將游戲界面按比例縮放至設計分辨率的其中一邊頂住屏幕。游戲上下或者左右兩邊可能會有黑邊。
·FIXED_HEIGHT就是固定設計分辨率的高度，調整設計分辨率的寬度，使設計分辨率的長寬比與設備分辨率的長寬比相同，然后縮放游戲界面至充滿屏幕。
·FIXED_WIDTH同上，不同的是保持寬度不變。
·EXACT_FIT是最粗暴的方式，直接將游戲界面縮放到充滿整個屏幕，X軸Y軸縮放比率不一定一致。
那么，我們應該選擇哪個方案呢？必然的我們應該選擇FIXED_HEIGHT或者FIXED_WIDTH。因為只有這兩個方案下，界面是會自動根據設備分辨率調整設計分辨率的大小並且充滿屏幕。
接下來加載界面。
加載界面在HelloWorld::init中進行：
auto rootNode= CSLoader::createNode("MainScene.csb");
auto size= Director::getInstance()->getVisibleSize();
rootNode->setContentSize(size);
ui::Helper::doLayout(rootNode);
addChild(rootNode);這里除了用createNode把界面加載出來，並添加到HelloWorld之外，還做了兩件事情：
• 設置加載出來的界面的ContentSize，調用對rootNode調用了ui::Helper::doLayout對加載出來的界面進行處理。
• 為什么要這么設計呢，做成自動的多好啊？
第一個理由：跟編輯器不一致；第二個理由是：自動調整界面被設計為是被動的，如果是主動進行的話，可能會造成大量的性能損失——如果每次設置大小都要重新遍歷計算所有的子節點的位置，那得浪費多少CPU時間啊。
效果：
- 設備分辨率X/Y相對設計分辨率X/Y較大，設配策略為固定高度
- 設備分辨率X/Y相對設計分辨率X/Y較大，設配策略為固定寬度
- 設備分辨率X/Y相對設計分辨率X/Y較小，設配策略為固定高度
- 設備分辨率X/Y相對設計分辨率X/Y較小，設配策略為固定高度
PS：枚舉類型ResolutionPolicy是框架提供給我們的方便的默認方案。其實我們在設置設計分辨率之前可以獲取設備分辨率，然后自己根據設備分辨率調整設計分辨率。