CocosCreator适配
1、 项目数据
设计分辨率：1280x720，
屏幕分辨率：768x393
屏幕和设计的比例：wdthScale=0.6 hightScale=0.54
2、UI适配规则
（1）设置“适应屏幕高度”
结果：
Canvas会依据设计高度和屏幕高度， 计算出缩放比例是0.54， 那么横向缩放后的像素为：1280 x 0.54=691，所以背景图（图片宽度是1280）最终展示的宽度就是：691，而实际屏幕宽度是768，所以两边都有黑边。如果只是等比缩放而已，那么这时canvas宽度的像素应该是： 1280 x 0.54=691，但是实际上canvas会自动向两边补齐,也就是增加宽度（不是缩放），直至横向铺满屏幕，所以红色的按钮（利用wigde左上对其了canvas）会依然显示在屏幕左上角。可以从右边红框中看到真实的canvas大小是1440*720，因为canvas宽度在1280的基础上自动在两边添加了一定宽度。
\
(2）设置“适应屏幕宽度”
结果：
如果设置为适配屏幕宽度，则canvas会依据屏幕宽度和设计宽度的缩放比例0.6，将canvas的横向和纵向都缩放0.6倍，这时canvas的所在像素宽高应该是1280 x 0.6=768,780 x 0.6=468,这样背景图就会相应的扩大相同的倍数，所以横向刚好铺满屏幕，纵向的高度468就会比屏幕的纵向393大，所以纵向上背景图是被裁剪了一部分的。按理这时的canvas也应该在纵向上超出屏幕一部分，红色按钮应该显示不全，但是实际上canvas会在纵向上自动减去部分，直至铺满屏幕，所以这时红色按钮还是显示在左上角，而canvas的实际大小就是1280*640，因为纵向上在原来的720的基础上减掉了一部分。
\
(3）两个都设置
如果都设置，就会默认以缩放比例小的值作为缩放值，因为又要适配横向又要适配纵向，也就是横向和纵向都希望能展示出来，那就只能以缩放比例小的值作为缩放值，这样就会导致缩放大的方向不能铺满屏幕，而且这种情况canvas不会自动补齐,结果就是缩放大的方向有黑边，这时与canvas左上角对齐的红色按钮不会对齐倒屏幕左上角。
结果：
(4)两个都不设置
则以缩放比例大的值作为缩放值，canvas也不会自动补齐，就会导致有一个方向会被裁掉。
结果：
以上两种情况由于canvas都不会自动补齐，也就是不会自动增加或减少，所以canvas的大小和设计大小是一样的，而且红色按钮也不会完美的处在屏幕左上角，因为这时canvas本身都不是刚好铺满屏幕的。
3、除了在设置界面设置适配策略外，还可以在代码中设置
view.setResolutionPolicy(ResolutionPolicy.FIXED_WIDTH);
设置界面中的： 适配屏幕高度 ==》ResolutionPolicy.FIXED_HEIGHT
适配屏幕宽度 ==》ResolutionPolicy.FIXED_WIDTH
两者都选 ==》 ResolutionPolicy.SHOW_ALL
都不选 ==》ResolutionPolicy.NO_BORDER
版权归原作者 哈哈悦 所有， 如有侵权，请联系我们删除。