Cocos2d-x——CocosBuilder官方幫助文檔翻譯2 多分辨率支持

Working with Multiple Resolutions

多分辨率設置

A common scenario when creating apps or games is to target multiple devices with different screen sizes. CocosBuilder provides advanced tools for supporting multiple resolutions and relative positioning. You can use the same file to have support for iPhone and iPad and a multitude of Android devices (if you are using cocos2d-x).

建立應用或者遊戲面臨的一個常見的問題就是不一樣設備不一樣屏幕尺寸的問題。CocosBuilder提供了高級的工具來解決多分辨率和相對位置的問題。你可使用同一個文件來支持iPhone、iPad以及衆多安卓設備（若是你使用cocos2d-x）

When creating a new file you select the resolutions that you want to support natively. Each resolution setting has a number of properties, such as width, height, resource extension and global scale.

當建立一個文件時選擇你想支持的分辨率。每個分辨率的設置都有一些對應的屬性，好比寬度，高度，資源後綴（resource extension）和縮放係數。

 

CocosBuilder's resolution settings only reflects what is displayed in CocosBuilder, and are not exported to your ccbi-files. However, the default settings in CocosBuilder corresponds to the default settings in cocos2d. If you make changes to the default settings, please be aware that you may also need to make corresponding changes in your code when loading the file.

CocosBuilder分辨率的設置只會影響到CocosBuilder中所顯示的內容，而不會導出到你的ccbi文件中。然而，CocosBuilder中的默認設置對應着cocos2d中的默認設置。若是你要更改這些默認設置，那麼在你的代碼中也要作相應的更改。

If you need to edit the resolutions after a document has been created you can do so by selecting Edit Resolutions… in the View menu.

當文檔創建後，你還想對分辨率進行編輯，你能夠在View菜單中選擇Edit Resolutions…

 

Selecting the Right Resources

選擇合適的分辨率

An important aspect of getting the multiple resolution support to work satisfactory is to select the correct resources for the correct display. The Resource extension determines which resources are selected for a particular resolution. For instance, for the ipad hd setting the resources with the -ipad extension are selected first hand, if no such resource is found resources with the -hd extension is used. If none of the listed extensions are found for a particular resource, the fallback is the resource without an extension. You place all your images, with the different resolution extensions, in a directory within your projects resource path.

爲了使你的應用或遊戲完美地支持多分辨率，最爲重要的一步是根據分辨率選擇合適的資源文件。資源後綴（resource extension）指的是爲特定的分辨率指定特定的資源。好比，對於ipad hd來講，以-ipad爲後綴的文件將被優先選擇，若是沒有這個文件，那麼就使用以-hd問後綴的文件，若是仍是沒有，則使用不加任何後綴的文件。你的全部帶有不一樣後綴的圖片文件放置在你的項目資源路徑下。（注：Cocos2d-x的新版本已經把不一樣尺寸的圖片放在了不一樣的文件夾中，好比小尺寸的放在iphone文件夾中，大尺寸的放在ipad文件夾中，可是文件名是同樣的，不會帶任何後綴）

The project view will only list resources without a resolution extension. Resources with an extension are hidden.

項目視圖只會顯示那些不包含後綴的資源文件。帶有後綴的資源文件將被隱藏。

 

Supporting Retina Display

支持Retina屏

CocosBuilder works entirely with points and not pixels. This means that you will only be seeing non-retina display layouts inside CocosBuilder. When you load the ccbi-files in cocos2d, cocos2d will select the -hd or -ipadhd (for retina iPad) resources. This is the reason why you won't have the option to select -ipadhd as an extension when editing your resolution settings.

CocosBuilder使用的是點而不是像素。這代表了在CocosBuilder中你只能看到非Retina的顯示方式。當你在cocos2d中加載ccbi文件時，cocos2d會選擇以-hd或者-ipadhd（iPad retina）爲後綴的資源文件。這就是爲何當你修改你的分辨率設置的時候不用去選擇-ipadhd的選項。

 

Content Sizes

內容尺寸（Content Sizes）

By default cocos2d only supports absolute sizes for setting the contentSize of a node. Included with CCBReader is an extension which allows setting the contentSize relatively to the nodes parent. (If you want to use this feature programmatically, include the CCNode+CCBRelativePositioning.h file.)

默認狀況下，cocos2d只支持使用絕對尺寸來設置節點的內容尺寸（contentSize）。但CCBReader中包含的擴展內容容許根據父節點去相對地設置節點的內容尺寸（contentSize）。（若是你想在代碼中使用這個功能，那麼請把CCNode+CCBRelativePositioning.h頭文件包含進來。）

There are six different options for setting the size of a node in CocosBuilder:

在CocosBuilder中有六個選項用來設置節點尺寸。

 1.Absolute: This sets the size to an absolute value (in points).

 1.絕對：設置爲絕對值（單位：點）。

 2.Percentage of container size: This sets the content size to a percentage of its parents content size. If it is the root node of the ccb-file it will (by default) be a percentage of the devices screen size.

 2.容器尺寸的百分比：設置爲容器尺寸的百分比。若是當前節點是ccb文件的根節點，那麼這個百分比是相對於設備屏幕尺寸的百分比。

 3.Relative container size: This option will calculate the nodes content size by subtracting the width/height values that you enter with the width/height value of the parent node. It can also be seen as an inset of the parents content size.

 3.相對容器尺寸：這個選項將根據你所輸入的父節點的寬高值相減後得出你的節點的寬高值。也能夠被視爲是父節點內容尺寸的嵌入尺寸。

 4.Horizontal percentage of container, fixed height: The width is set as a percentage, while the height is absolute (points).

 4.水平方向使用容器百分比，高度固定值：寬度設置爲百分比，高度是絕對值（單位：點）。

 5.Vertical percentage of container, fixed width: The height is set as a percentage, while the width is absolute (points).

 5. 豎直方向使用容器百分比，寬度固定值：高度設置爲百分比，寬度是絕對值（單位：點）。

 6.Multiply by resolution scale: This option multiplies the value that you enter by the resolution scale factor which is specified for the current resolution.

 6.與分辨率縮放係數相乘：這個選項將與你所設置的分辨率縮放係數相乘。

 

Relative Positioning

相對位置

All relative positioning in CocosBuilder is in relation to the position and content size of a nodes parent. In particular, if you are using the percentage option it will only work if the parent node has a size.

在CocosBuilder中全部的相對位置都是與父節點的位置和內容尺寸相關的。尤爲是，若是你使用的是百分比選項的時候，只有在父節點有尺寸的狀況下相對位置纔會起做用。

 1.Absolute: This sets the position to an absolute value (in points), same as cocos2d would normally use.

 1.相對左下角：這個選項將把位置設置爲相對於父節點的左下角。（此處原文有錯誤）

 2.Relative top-left: This sets the position relative to the top-left corner of the parent node.

 2.相對左上角：這個選項將把位置設置爲相對於父節點的左上角。

 3.Relative top-right: This sets the position relative to the top-right corner of the parent node.

 3.相對右上角：這個選項將把位置設置爲相對於父節點的右上角。

 4.Relative bottom-right: This sets the position relative to the bottom-right corner of the parent node.

 4.相對右下角：這個選項將把位置設置爲相對於父節點的右下角。

 5.Percentage of container: Uses a percentage of the parent's content size to set the position relative to the bottom-right corner of the parent node. E.g. using the value 50,50 will place the node in the middle of its parent.

 5.容器的百分比：使用父節點的內容尺寸的百分比（左下角爲原點），好比，使用50,50將把節點放置在父節點的中心位置。（此處原文有錯誤）

 6.Multiply by resolution scale: This option multiplies the value that you enter by the resolution scale factor which is specified for the current resolution.

 6.與分辨率縮放係數相乘：這個選項將與你所設置的分辨率縮放係數相乘。

 

Relative Scaling

相對縮放

You can use relative scaling for any object's scale or for some float based properties (e.g. the font size of CCLabelTTF).

對於任何物體的縮放以及一些浮點型的屬性你可使用相對縮放。

 1.Absolute: CocosBuilder will use the scale you provide regardless of which resolution is currently used.

 1.絕對：不管你當前使用的是何種分辨率，CocosBuilder將使用你所提供的縮放係數。

 2.Multiply by resolution scale: The value will be multiplied by the resolution scale factor for the current resolution.

 2.與分辨率縮放係數相乘：這個選項將與你所設置的分辨率縮放係數相乘。

 

Options When Loading ccbi-files

當加載ccbi文件時的選項

The resolution sizes are not saved in the ccbi-files, by default the screen size is used as the parent size when the files are loaded. If you have used a custom size you may need to pass this size to the loader. To do this you will need to use the nodeGraphFromFile:owner:parentSize: or sceneWithNodeGraphFromFile:owner:parentSize: methods.

CGSize mySize = CGSizeMake(100.0f, 100.0f);

CCNode* myNode = [CCBReader nodeGraphFromFile:@"myNode.ccbi" owner:NULL parentSize:mySize];

Before loading your ccbi-files you can set the resolution scale you want to use. The default resolution scale is 1 for iPhone and 2 for iPad, but sometimes it can be useful to use other scale factors.

[CCBReader setResolutionScale: 2.5f];

 

分辨率尺寸不會被保存在ccbi文件中，默認狀況下當文件被加載時，屏幕尺寸將做爲父節點尺寸。若是你本身使用了一個自定義的尺寸，你須要把這個尺寸傳給loader。爲了使用這個功能，你須要使用nodeGraphFromFile:owner:parentSize:方法或者sceneWithNodeGraphFromFile:owner:parentSize:方法：

CGSize mySize = CGSizeMake(100.0f, 100.0f);

CCNode* myNode = [CCBReader nodeGraphFromFile:@"myNode.ccbi" owner:NULL parentSize:mySize];

在加載ccbi文件以前，你能夠設置你想使用的分辨率縮放係數。iPhone的默認係數是1，iPad的默認係數是2，但有時也可使用其餘的縮放係數。

[CCBReader setResolutionScale: 2.5f];

 

Useful Tips!

有用的技巧

• It is always better to design for multiple resolutions from the start in a project, rather then trying to convert an existing layout to fit different devices.
• 最好是在項目一開始就爲多分辨率進行設計，而不是在後期將現有的佈局去適配不一樣的設備。
• If you are planning on using letter boxing, the multiply by resolution scale option can be very useful.
• 若是你想加邊框，那麼與分辨率縮放選項相乘會是很是有用的。
• Combine setting the anchor point of an object with the relative positioning options to pin nodes to corners or sides of the screen.
• 錨點和相對位置組合使用能夠把節點放置在屏幕的角落或屏幕邊緣。
• You can achieve very complex behaviors for the multiple resolutions by nesting different positioning and size options.
• 經過不一樣的位置和尺寸選項的嵌套，你能夠爲多分辨率實現很是複雜的設置。

Don't be afraid to experiment with the different options, it can be complex at first sight, but once you get the hang of it you will have many options for laying out your scenes.

不要懼怕嘗試不一樣的選項，一開始可能會很複雜，但一旦熟練掌握，你能夠佈局出你本身的場景。