CocosCreator 屏幕适配

首先说下设计分辨率和屏幕分辨率

设计分辨率

cocos官方说是内容生产者在制作场景时使用的分辨率蓝本，其实就是开发者搭界面，美术大大产出UI效果图的分辨率。这个分辨率是根据设备来设置的。

屏幕分辨率

游戏在设备上运行时的十几屏幕显示分辨率

如何确定设计分辨率

** 常用的手机分辨率**

华为mate9 1080x1920 16：9 （1.77）

华为mate40 pro 2772 x 1344 （2.06）

小米11 3200×1440 （2.22）

iphone11 1792x828 （2.16）

iphone12 2532 x 1170 （2.16）

iphone12 pro 2532 x 1170 （2.16）

iphone12 pro max 2778×1284 (2.16)

** 常用的设计分辨率**

分辨率 Canvas高宽(美术效果图) 游戏背景图高宽

16:9 640x1140 640x1430

16:9 720x1280 720x1600

2:1 640x1280 640x1430

2:1 720x1440 720x1600

一般手机最高2.22：1,背景的长度需要能达到这个高度，不然会出现黑框。

横版游戏,一般采用16:9的设计分辨率,匹配iphone5~iphone8以及几乎全部安卓手机

适配方案

1. Fit Height

设计分辨率宽高比大于屏幕分辨率，适配高度避免黑边(两边可能出现黑边)

2. Fit Width

设计分辨率宽高比小于屏幕分辨率，适配宽度避免黑边（上下可能出现黑边）

3. Show All

同时勾选Fit Height和Fit Width,高宽都是100%显示(不会裁剪,上下左右都可能有黑框）

4. No Border

同时不勾选Fit Height和Fit Width，此时无论屏幕宽高比多少都不会产生黑边。也就是说，当设计分辨率宽高比大于屏幕分辨率时，会适配高度；设计分辨率宽高比小于屏幕分辨率时，会适配宽度。

IPhoneX适配

按照官方文档横屏fix height 设计分辨率 1280* 720，背景图 1600720

竖屏的话fix width 设计分辨率7201280,背景图 720* 1600

同时用widget节点对游戏中贴边的UI节点进行对齐，就可以完美适配了