您的当前位置:首页正文

cocos2dx进阶学习之屏幕适配

2020-11-09 来源:汇智旅游网

http://blog.csdn.net/itcastcpp/article/details/18608437 背景 在学习cocos2dx时,我们在main函数中发现一句代码, [cpp] view plaincopyprint? #includemain.h #includeAppDelegate.h #includeCCEGLView.h USING_NS_CC; int APIENTRY_tWinMain( HINSTANCE

http://blog.csdn.net/itcastcpp/article/details/18608437

背景

在学习cocos2dx时,我们在main函数中发现一句代码,

[cpp] view plaincopyprint?

  1. #include "main.h"
  2. #include "AppDelegate.h"
  3. #include "CCEGLView.h"
  4. USING_NS_CC;
  5. int APIENTRY _tWinMain(HINSTANCE hInstance,
  6. HINSTANCE hPrevInstance,
  7. LPTSTR lpCmdLine,
  8. int nCmdShow)
  9. {
  10. UNREFERENCED_PARAMETER(hPrevInstance);
  11. UNREFERENCED_PARAMETER(lpCmdLine);
  12. // create the application instance
  13. AppDelegate app;
  14. CCEGLView* eglView = CCEGLView::sharedOpenGLView();
  15. eglView->setViewName("CrazyMario");
  16. eglView->setFrameSize(480, 320);
  17. return CCApplication::sharedApplication()->run();
  18. }

#include "main.h"
#include "AppDelegate.h"
#include "CCEGLView.h"

USING_NS_CC;

int APIENTRY _tWinMain(HINSTANCE hInstance,
 HINSTANCE hPrevInstance,
 LPTSTR lpCmdLine,
 int nCmdShow)
{
 UNREFERENCED_PARAMETER(hPrevInstance);
 UNREFERENCED_PARAMETER(lpCmdLine);

 // create the application instance
 AppDelegate app;
 CCEGLView* eglView = CCEGLView::sharedOpenGLView();
 eglView->setViewName("CrazyMario");
 eglView->setFrameSize(480, 320);
 return CCApplication::sharedApplication()->run();
}

那就是eglView->setFrameSize(480,320),这句代码设置了窗口的大小,一般说来手机游戏需要全屏显示,所以对于不同分辨率的手机,setFrameSize要求不一样的。这样是不是很崩溃?因为我们代码里很多地方可能也要改,图片大小可能也要改,那怎么办呢?

其实cocos2dx已经为我们做好了这一切

结局方案

这个方案就是调用eglView->setDesignResolutionSize(480, 320, kResolutionShowAll);来告诉cocos2dx,我的程序是按照480,320来设计的,那么setFrameSize如果不是480,320那么cocos2dx会按照比例给我们做适配,不用我们做别的事情。

在超级马里奥这个游戏里,在AppDelegate中已经调用了setDesignResolutionSize函数设置设计大小为480,320

那么在setFrameSize不同的情况下,也不会引起图片比例不合适的情况,只是窗口大小会发生变化而已


在480*320的情况下


在960*640的情况下,只是界面变大了,图片没有任何的不适合


setDesignResolutionSize的参数

第三个参数的取值范围如下:

[cpp] view plaincopyprint?

  1. enum ResolutionPolicy
  2. {
  3. // The entire application is visible in the specified area without trying to preserve the original aspect ratio.
  4. // Distortion can occur, and the application may appear stretched or compressed.
  5. kResolutionExactFit,
  6. // The entire application fills the specified area, without distortion but possibly with some cropping,
  7. // while maintaining the original aspect ratio of the application.
  8. kResolutionNoBorder,
  9. // The entire application is visible in the specified area without distortion while maintaining the original
  10. // aspect ratio of the application. Borders can appear on two sides of the application.
  11. kResolutionShowAll,
  12. // The application takes the height of the design resolution size and modifies the width of the internal
  13. // canvas so that it fits the aspect ratio of the device
  14. // no distortion will occur however you must make sure your application works on different
  15. // aspect ratios
  16. kResolutionFixedHeight,
  17. // The application takes the width of the design resolution size and modifies the height of the internal
  18. // canvas so that it fits the aspect ratio of the device
  19. // no distortion will occur however you must make sure your application works on different
  20. // aspect ratios
  21. kResolutionFixedWidth,
  22. kResolutionUnKnown,
  23. };

enum 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.
 kResolutionExactFit,
 // The entire application fills the specified area, without distortion but possibly with some cropping,
 // while maintaining the original aspect ratio of the application.
 kResolutionNoBorder,
 // 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.
 kResolutionShowAll,
 // 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
 kResolutionFixedHeight,
 // 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
 kResolutionFixedWidth,

 kResolutionUnKnown,
};

kResolutionExactFit:会靠拉伸来填满屏幕,本例来说背景图会变形来填充屏幕,因为1024:768=1.3, 480:320=1.5,宽高比不同,图片也就无法等比缩放来填满屏幕,只能变形了。
kResolutionNoBorder: 看不到黑边,实际就是宽高等比缩放,但缩放比例取宽比和高比之中大的那一个。
kResolutionShowAll:全部显示,可以理解为保证内容都显示在屏幕之内,实际也是宽高等比缩放,但缩放比例取宽比和高比之中小的那一个。

显示全文