微信小游戏屏幕适配

作者: 何永峰；
标签: 屏幕适配

屏幕适配

适配都是老生常谈，移动端要根据手机屏幕适配，PC端也有时候根据不同的电脑屏幕做适配，刚做的小鸡也要做适配。以下谈谈我根据需求做的小游戏适配方案吧

需求

需要在不同的屏幕把我们的所有主要功能（大概就是750*1334的这么大的内容）都展示出来

实际情况

目前所有手机都有自己的屏幕比例，不可能做成每部手机展示出来的内容都一样，不多不少。我们的游戏是竖屏游戏，主要要在高度上作修改就OK

思路

1、根据设计稿7501334（一开始已经定死了，只能跟着设计稿走）作为主要展示内容
2、叫设计做一个7501624的背景图，然后把7501334的主要内容居中放在背景图上
2、设置游戏舞台高度7501624（iphoneX是11252436，把宽高折成7501624使宽度大小尽量变成设计稿大小来计算，方便）
3、获取当前设备的屏幕高度（宽度是750比例的高度大小，例如是11252436，折算成7501624，拿1624当做屏幕高度），【设备的屏幕高度 - 1334（主要内容高度）】/ 2 = 上屏离主要内容的高度（一般是负数）
4、在Main添加皮肤的，把“上屏离主要内容的高度”设置为y值
4、这时候，大概展示是这样子