首先介绍一个api和相应的参数:
cc.view.setDesignResolutionSize(1024, 768, cc.ResolutionPolicy.FIXED_WIDTH);
参数说明:
EXACT_FIT会拉伸游戏,充满整个屏幕,最简单最粗暴;
SHOW_ALL保持游戏原比例,让一边占满屏幕,另外一侧黑边;
NO_BORDER跟SHOW_ALL类似,但让短边占满屏幕,另外一侧超出屏幕,不显示黑边,一部分画面在屏幕外,无法显示;
FIXED_WIDTH和FIXED_HEIGHT都是NO_BORDER的升级版,指定那一侧充满屏幕,另外一侧超出屏幕。
这里建议使用FIXED_WIDTH和FIXED_HEIGHT,因为这两个方案适合UI沿着屏幕边缘布局,而游戏画面居中,游戏背景则可以裁剪(显示一部分)的情况。
屏幕尺寸
另外cc.view.getFrameSize可以获取屏幕尺寸
下面是本人自己一般的配置(假设游戏为横版480*320):
var mode = cc.ResolutionPolicy.SHOW_ALL; if(cc.winSize.width/cc.winSize.height > 480/320){ mode = cc.ResolutionPolicy.FIXED_WIDTH; }else if(cc.winSize.width/cc.winSize.height < 480/320){ mode = cc.ResolutionPolicy.FIXED_HEIGHT; } cc.view.setDesignResolutionSize(480,320, mode);