Cocos2d-x 多分辨率支持策略和原理

API接口

目前正在使用的cocos2d-x的版本是3.x版本,在这个版本中多分辨率的支持接口有以下这些:

Director::getInstance()->getOpenGLView()->setDesignResolutionSize() //设计分辨率大小及模式
Director::getInstance()->setContentScaleFactor() //内容缩放因子
FileUtils::getInstance()->setSearchPaths() //资源搜索路径
Director::getInstance()->getOpenGLView()->getFrameSize() //屏幕分辨率
Director::getInstance()->getWinSize() //设计分辨率
Director::getInstance()->getVisibleSize() //设计分辨率可视区域大小
Director::getInstance()->getVisibleOrigin() //设计分辨率可视区域起点

资源到设计尺寸

在Cocos里,官方把适配方案分为了两步,第一步是资源到设计尺寸的适配。

因为设备尺寸是参差不齐的,当我们在开发游戏时并不会假定界面是基于某台设备来设计的。通常,我们会选择一个较为通用的尺寸来进行界面布局(比如1280*720),这时选取的这个尺寸称为设计尺寸。

而从资源到设计尺寸的映射,其实就是图片到设计尺寸的映射。例如,我们为iPhone3G和iPhone4设计一款游戏。iPhone 3G的分辨率是320480,而iPhone 4的分辨率是640960。尽管这两种设备分辨率不同,但是屏幕尺寸一样大。在这样的情况下,我们使用同样的设计尺寸,只不过将iPhone4的图片资源换成2倍的即可。

通过 cocos2d 的setContentScaleFactor函数可以设置所有加载资源的缩放因子:

director->setContentScaleFactor(2);

设置完之后,一张640960的背景图在一个sprite显示时,高宽变为为320480,而分辨率变为了原本的4倍。这样一来,iPhone 3G和iPhone 4的屏幕适配做好了。

当然,因为改变了缩放因子,这两种设备设置加载的资源就不同,为了方便管理,我们会为它们设置不同的资源目录:

/Resource
    /iphone
    /iphonehd

并根据具体设备指定Resource下的默认资源路径:

vector<string> searchPath;
if (iPadHD){    
    searchPath.push_back("iphonehd");
}else if(iPhone){
    searchPath.push_back("iphone");
}

//如果这两个目录下没有所需的资源,加载common目录资源

searchPath.push_back("common");
FileUtils::getInstance()->setSearchPaths(searchPath);

现在iPhone 3G近乎绝迹,大部分iOS设备都是高清设备。所以,不必考虑为iPhone设备设置普清图。

从设计分辨率到屏幕分辨率

setDesignResolutionSize(DW, DH, resolutionPolicy)

有三个参数，设计分辨率宽，设计分辨率高，分辨率策略。

前两个很好理解，复杂点在分辨率策略的选择上。

适配方案resolutionPolicy有五种选择:

• ResolutionPolicy::SHOW_ALL 屏幕宽、高分别和设计分辨率宽、高计算缩放因子，取较小者作为宽、高的缩放因子。保证了设计区域全部显示到屏幕上，但可能会有黑边。
• ResolutionPolicy::EXACT_FIT 屏幕宽与设计宽的比例作为X方向的缩放因子，屏幕高与设计高的比例作为Y方向的缩放因子。保证了设计区域完全铺满屏幕，但是可能会出现图像拉伸。
• ResolutionPolicy::NO_BORDER 屏幕宽、高分别和设计分辨率宽、高计算缩放因子，取较(大)者作为宽、高的缩放因子。保证了设计区域总能一个方向上铺满屏幕，而另一个方向一般会超出屏幕区域。
• ResolutionPolicy::FIXED_HEIGHT 保持传入的设计分辨率高度不变,根据屏幕分辨率修正设计分辨率的宽度。(按照适配尺寸的宽度将屏幕撑满,宽度可根据屏幕的分辨率拉伸或者是裁剪)
• ResolutionPolicy::FIXED_WIDTH 保持传入的设计分辨率宽度不变,根据屏幕分辨率修正设计分辨率的高度。

参考链接1
参考链接2

• ← Previous Post
• Next Post →