【Cocos2d-x 3.x】屏幕自适应匹配

2023-08-19 08:56:22

在进行游戏开发时，由于市场上的Android移动设备的分辨率有很多种，而且IOS移动设备的分辨率也不相同，为了能让手游能在90%以上的移动设备较为完美的运行，因此需要考虑屏幕的自适应问题，让一套资源能在多种分辨率下的移动设备上运行起来。

在AppDelegate.cpp文件中，一般都是这样处理屏幕自适应问题的：

bool AppDelegate::applicationDidFinishLaunching() {

    // initialize director

    auto director = Director::getInstance();

    auto glview = director->getOpenGLView();

    if(!glview) {

        glview = GLViewImpl::create("Treasure Defense"/*, cocos2d::Rect(0, 0, 1024, 768)*/);

        director->setOpenGLView(glview);

    }

	glview->setDesignResolutionSize(1024, 768, ResolutionPolicy::EXACT_FIT); // 这里设置屏幕自适应

// ....其他内容

}

1024和768分别是游戏运行的窗口的宽高，第三个参数ResolutionPolicy::EXACT_FIT是设置屏幕自适应的一种方法，其他方法在头文件 CCGLView.h中：

// CCGLView.h

enum class ResolutionPolicy

{

    // The entire application is visible in the specified area without trying to preserve the original aspect ratio.

    // Distortion can occur, and the application may appear stretched or compressed.

    // EXACT_FIT会将背景连带里面的Sprite等等都会拉伸或压缩， 不会考虑原有的宽高比. 会发生变形， 因此游戏界面会被拉伸或压缩， 不会出现黑边

    EXACT_FIT,

    // The entire application fills the specified area, without distortion but possibly with some cropping,

    // while maintaining the original aspect ratio of the application.

    // NO_BORDER会保持宽高比， 不会出现黑边， 因此如果屏幕的分辨率小于背景图片， 会将背景图片进行裁剪。

    NO_BORDER,

    // The entire application is visible in the specified area without distortion while maintaining the original

    // aspect ratio of the application. Borders can appear on two sides of the application.

    // 会保持宽高比，等比例拉伸， 直到宽度或高度达到屏幕尺寸， 但是两侧可能会出现黑边

    SHOW_ALL,

    // The application takes the height of the design resolution size and modifies the width of the internal

    // canvas so that it fits the aspect ratio of the device

    // no distortion will occur however you must make sure your application works on different

    // aspect ratios

    // 保持高度不变， 然后修改宽度值来适配屏幕，不变形，与设备保持宽高比

    FIXED_HEIGHT,

    // The application takes the width of the design resolution size and modifies the height of the internal

    // canvas so that it fits the aspect ratio of the device

    // no distortion will occur however you must make sure your application works on different

    // aspect ratios

    // 保持宽度不变， 然后修改高度值来适配屏幕，不变形，与设备保持宽高比

    FIXED_WIDTH,

    UNKNOWN,

};

各个参数说明：

ResolutionPolicy::EXACT_FIT ：

EXACT_FIT将图片拉伸，不会保持原有的宽高比，在拉伸时会连带里面的Sprite、Button等都会拉伸或压缩，会发生变形，因此游戏界面会被拉伸或压缩，但不会出现黑边。它适用于个人的小项目，轻微拉伸不会太影响游戏的展示，但公司大项目基本不用这个。

ResolutionPolicy::NO_BORDER ：

NO_BORDER为了保持图片的宽高比，等比例拉伸，屏幕宽、高分别与设计分辨率宽、高计算缩放因子，取较大者作为宽、高的缩放因子，保证了设计区域总能一个方向上铺满屏幕，而另一个方向可能会超出屏幕区域，不会出现黑边情况。如果屏幕分辨率和图片分辨率不同，会将图片裁剪多出的部分。

ResolutionPolicy::SHOW_ALL ：

屏幕宽、高分别与设计分辨率宽、高计算缩放因子，取较小者作为宽、高的缩放因子。保证了全部可以显示到屏幕上，但可能会有黑边。

ResolutionPolicy::FIXED_HEIGHT 和 ResolutionPolicy::FIXED_WIDTH ：

保持高度或宽度不变，ResolutionPolicy::FIXED_HEIGHT适合高方向需要填充满，宽方向可以裁剪的游戏界面；　ResolutionPolicy::FIXED_WIDTH适合宽方向需要填充满，高方向可以裁剪的游戏界面。它们是NO_BORDER的特殊情况，即可以在特定方向来拉伸。

重点推荐ResolutionPolicy::FIXED_HEIGHT和ResolutionPolicy::FIXED_WIDTH，次之是NO_BORDER，除非特殊需要，若一定要全部显示填充屏幕则可以使用EXACT_CIT，若一定要全部无变形显示，则可以使用SHOW_ALL。

关于cocos2d-x 3.x 的屏幕适配问题的帖子：

http://www.2cto.com/kf/201409/333604.html

码农公寓

相关文章