cocos2dx 螢幕自適應

cocos2d-x 螢幕自適應

cocos2dx-2.0版本對多解析度適配提供了很好的支援，使用起來比1.0版本要簡單些，1.0版本的適配可以參考

這篇博文。

1. 做2.0版本的適配首先需要了解下面這些知識。

(1)適配策略

2.0版本提供了三種適配策略：

kresolutionshowall：整個遊戲介面是可見的，會按原始比例進行縮放，不變形，但兩側可能會留有黑邊，不鋪滿螢幕。

可以根據自己的要求選擇。

(2)visiblesize和visibleorigin

getvisiblesize：表示獲得視口(可視區域)的大小，如果designresolutionsize跟螢幕尺寸一樣大，則getvisiblesize等於getwinsize。

getvisibleorigin：表示可視區域的起點座標，這在處理相對位置的時候非常有用，確保節點在不同解析度下的位置一致。

(3)designresolutionsize

designresolutionsize是乙個比較重要的概念，其實2.0版本的適配跟1.0版本原理差不多，都是按比例進行縮放。這個designresolutionsize表示設計方案，就是你的遊戲完美支援的解析度方案，一般根據資源的尺寸來定，自適配時會按照這個解析度計算出縮放因子。因此，這個值也應該是動態的，如果是橫屏遊戲則高度肯定是鋪滿螢幕的，寬度也要盡可能的鋪滿螢幕，因此應該選擇寬高比最大的作為設計解析度，下面的demo會給出使用方法。

(4)設定相對位置

在遊戲中使用相對位置設定座標的好處是顯而易見的，這樣就不需要為每個解析度都定義一套座標了。首先得定義一些參考點，引擎的testcpp例子中就提供了一種方法，以螢幕上可視區域的9個點作為參考點，相當於在該矩形內寫乙個公尺字，這9個點分別是：左上、左、左下、下、右下、右、右上、上、中心。

#include "cocos2d.h"

typedef struct tagresource

resource;

//可用的資源尺寸

static resource smallresource = ;

static resource mediumresource = ;

static resource largeresource = ;

//設計方案

static cocos2d::ccsize smalldesignresolutionsize = cocos2d::ccsizemake(480.0f, 320.0f);

static cocos2d::ccsize mediumdesignresolutionsize = cocos2d::ccsizemake(1024.0f, 768.0f);

static cocos2d::ccsize largedesignresolutionsize = cocos2d::ccsizemake(2048.0f, 1536.0f);

//縮放因子，主要給文字標籤使用

#define scale_factor (cocos2d::cceglview::sharedopenglview()->getdesignresolutionsize().width / smallresource.size.width)

#endif ：

else if (framesize.height > smallresource.size.height)

else

pdirector->setdisplaystats(true);

pdirector->setanimationinterval(1.0 / 60);

ccscene *pscene = helloworld::scene();

pdirector->runwithscene(pscene);

return true;}

(3)建立visiblerect.h和visiblerect.cpp檔案，封裝了獲取那9個點座標的函式，比較簡單。**如下：

visiblerect.h

#ifndef __visiblerect_h__
#define __visiblerect_h__
#include "cocos2d.h"
using_ns_cc;
class visiblerect; 
#endif

visiblerect.cpp

#include "visiblerect.h"
ccrect visiblerect::s_visiblerect;
void visiblerect::lazyinit()} 
ccrect visiblerect::getvisiblerect()
ccpoint visiblerect::left()
ccpoint visiblerect::right()
ccpoint visiblerect::top()
ccpoint visiblerect::bottom()
ccpoint visiblerect::center()
ccpoint visiblerect::lefttop()
ccpoint visiblerect::righttop()
ccpoint visiblerect::leftbottom()
ccpoint visiblerect::rightbottom()

(4)修改helloworldscene.cpp的init函式，使用相對位置設定座標。

bool helloworld::init()
ccmenuitemimage *pcloseitem = ccmenuitemimage::create(
"closenormal.png",
"closeselected.png",
this,
menu_selector(helloworld::menuclosecallback));
pcloseitem->setposition(ccpadd(visiblerect::rightbottom(), 
ccp(-pcloseitem->getcontentsize().width/2, pcloseitem->getcontentsize().height/2)));
ccmenu* pmenu = ccmenu::create(pcloseitem, null);
pmenu->setposition(ccpointzero);
this->addchild(pmenu, 1);
cclabelttf* plabel = cclabelttf::create("hello world", "arial", scale_factor * 24);
plabel->setposition(ccpadd(visiblerect::top(),
ccp(0, -plabel->getcontentsize().height)));
this->addchild(plabel, 1);
ccsprite* psprite = ccsprite::create("helloworld.png");
psprite->setposition(visiblerect::center());
this->addchild(psprite, 0);
ccsprite *plogosprite = ccsprite::create("icon.png");
plogosprite->setanchorpoint( ccp(0, 0.5) );
plogosprite->setposition(ccpadd(visiblerect::left(), ccp(50, 0)));
this->addchild(plogosprite, 0);
return true;
}

(5)建立視窗，main.cpp的主要內容：

cceglview* eglview = cceglview::sharedopenglview();

//eglview->setframesize(2048, 1536);

//eglview->setframesize(480, 320);

//eglview->setframesize(800, 480);

//eglview->setframesize(1024, 768);

//eglview->setframesize(1280, 800);

eglview->setframesize(1280, 768);

//eglview->setframesize(960, 640);

eglview->setframezoomfactor(0.5f);

ok，到此為止，**部分已經完成

cocos2dx 螢幕自適應

cocos2dx 螢幕設定

cocos2d x螢幕適配

cocos2dx 螢幕設定

cocos2dx 螢幕自適應

cocos2dx 螢幕設定

cocos2d x螢幕適配

cocos2dx 螢幕設定

相關推薦