【分享】Cocos Creator 多分辨率适配方案分享（微信小游戏专场）

Creator 2.x
#1

前言：上一次的【分享】Cocos Creator 多分辨率适配方案分享基本包括了大部分适配内容，如果还没有阅读过的，建议看看~

适配目标

本次我们重点针对微信小游戏做相关适配，最终达到以下目标

  1. 节点高度和微信菜单栏持平（支持刘海屏）
  2. 节点位置和微信菜单栏保持一致（支持刘海屏）

本实现适用于 游戏顶部菜单栏摆放 以及其他场合

效果图

WXGAME_FULLSCREEN_TOPBAR_UI_ADAPTER.gif1014×1242 539 KB

源码实现

测试项目地址

https://github.com/zhitaocai/CocosCreator-Multi-resolution-Adapter

测试步骤：

  1. 下载测试项目到本地
  2. 用 Cocos Creator 2.0.x 打开项目
  3. 双击选择./assets/Scene下的微信测试场景，点击发布到微信开发者工具
  4. 打开微信开发者工具切换不同设备分辨率即可测试
4赞
#2

mark。确实很好用。收藏。

#3

点赞，支持一下

#4

恐怖的是 getMenuButtonBoundingClientRect()有时候返回的数据是错误的 不确定是机型问题还是游戏版本(开发体验线上)的问题。

#5

去微信开发者论坛看了一圈 wx.getMenuButtonBoundignClientRect 确实有点问题， 模拟器和部分真机上表现不太一致 ，18年底提出来的BUG，到现在还没有弄好

#6

好用！

#7

mark，谢谢分享

#8

楼主，我是p20真机测试啦一下，微信端(模拟器和真机都好的）用QQ程序开发者工具测试, 模拟器是好的( 360*748, pdr:3), 真机没有显示出来，看下log，是模拟器可以获得 paddingtop 和node.height值，但是真机是null

qq.getMenuButtonBoundingClientRect
这个接口，真机测试为null

#9

恩恩，对的，之前也有反馈，在微信开发者社区上，也有类似的反馈，这个API算是微信在真机上的BUG吧，从上年12月到现在一直都是有问题的样子（在部分真机上），也有很多开发者在微信开发者社区上反馈了，目前来看

  1. 要么等微信修复
  2. 自己大概估算一下那个高度

╮(￣▽￣)╭

#10

mark,mark:slightly_smiling: