最近在公司开发游戏,使用cocos creator做微信小游戏,遇到一个很恶心的问题,如图:

如图所示,微信的广告位被iphonex的底部bar给弹出了一点位置,没有靠在底部。

在这里不得不吐槽一下微信的小程序接口还有个恶心的地方,那就是他的广告style没有bottom,right属性,使得置底部必须使用算法计算。也就是winsize.height-广告高度(realheight),居中是winsize.width-广告宽度/2。

而就算如此,在Android和iphone普通手机上是没有适配问题的,完全居中靠底,而一到高贵的iPhonex上,就会出现广告位一会儿靠底部,一会又被底部黑色bar顶出一点位置,要解决这个蛋疼的问题,如下解决:

     showBannerAd(){
var wxFunc = this.getWXFunction('createBannerAd');
if (typeof(wxFunc)!='undefined' && wxFunc!=null){
var phone = wx.getSystemInfoSync();
console.log(phone);
var w = phone.screenWidth / 2;
var h = phone.screenHeight;
let bannerAd = wxFunc({
adUnitId: 'adunit-549b2e8b53ad8e21',
style: {
width: 300,
//height:40,
top:0,
left:0
}
});
bannerAd.onResize(function(){
bannerAd.style.left = w - bannerAd.style.realWidth/2+0.1;
bannerAd.style.top = h - bannerAd.style.realHeight+0.1;
console.log(bannerAd);
})
bannerAd.show();
return bannerAd;
}else{
return;
}
}

注意几点:

  1. 创建banner的默认位置不需要修改,反正也没用
  2. 在onresize中重置style来改变位置
  3. 使用realwidth和realheight作为相对位移(这两项必须是在banner已经创建完成的情况下)
  4. left和top都加上0.1,不加就会被iphonex该死的底部bar给顶上去,而且时而顶上去,时而又是正常,至今不知道为什么
  5. onresize之后再使用show方法将广告banner给show出来

微信小游戏广告位iphonex底部适配问题的更多相关文章

  1. Particle 粒子效果使用(适配微信小游戏,particle is not defined)

    在微信小游戏中使用粒子效果 参考: 1. 粒子库下载地址 2. 粒子官方使用教程 3. 水友解决微信小游戏particle is not defined 一.下载第三方库 Git地址:https:// ...

  2. 使用Laya引擎开发微信小游戏(上)

    本文由云+社区发表 使用一个简单的游戏开发示例,由浅入深,介绍了如何用Laya引擎开发微信小游戏. 作者:马晓东,腾讯前端高级工程师. 微信小游戏的推出也快一年时间了,在IEG的游戏运营活动中,也出现 ...

  3. 【转】利用 three.js 开发微信小游戏的尝试

    前言 这是一次利用 three.js 开发微信小游戏的尝试,并不能算作是教程,只能算是一篇笔记吧. 微信 WeChat 6.6.1 开始引入了微信小游戏,初期上线了一批质量相当不错的小游戏.我在查阅各 ...

  4. 使用Laya引擎开发微信小游戏(下)

    本文由云+社区发表 6. 动画 6.1 创建伞兵对象 在src目录下创建一个新目录role,用来存放游戏中角色. 在role里创建一个伞兵Soldier.ts对象文件. module role{ ex ...

  5. 微信小游戏下socket.io的使用

    参考: 微信小游戏:socket.io 一 在微信小游戏 中使用socket.io报错 因为项目需求,后端要使用nodejs简单搭建一个服务器,通讯用json格式. 使用Egret提供的socket. ...

  6. 用Kotlin破解Android版微信小游戏-跳一跳

    前言 微信又更新了,从更新日志上来看,似乎只是一次不痛不痒的小更新.不过,很快就有人发现,原来微信这次搞了个大动作——在小程序里加入了小游戏.今天也是朋友圈被刷爆的缘故. 看到网上 有人弄了一个破解版 ...

  7. 微信小游戏 egret.getDefinitionByName获取不到

    使用getDefinitionByName获取类定义 输出为null,获取不了 增加window["LoadingUI"] = LoadingUI 获取成功 总结: 这样无论是游戏 ...

  8. 一、微信小游戏开发 --- 初次在微信开发者工具里跑Egret小游戏项目

    尝试下Egret的小游戏开发,学习,学习,干IT,不学习,就得落后啊... 相关教程: Egret微信小游戏教程 微信公众平台-微信小游戏教程 微信公众平台-微信小游戏接入指南 开发版本: Egret ...

  9. 微信小游戏egret开发包括p2引擎小结

    用egret + p2 做一个类似投球的小游戏,坑大致如下: 1.p2引擎与egret坐标不同注意转换,横坐标没什么,纵坐标egret.y = stageHeight - body.position[ ...

随机推荐

  1. kindle关闭自动同步

    登录网页,在我的“管理我的内容和设备”里,关闭自动同步设置

  2. 三大PLM厂商

    西门子的叫Teamcenter(汽车.通用机械) 法国达索的Enovia(航空\汽车\高铁等交通运输行业和机械行业) PTC的叫windchill(船舶.电子)

  3. 吴裕雄--天生自然 PHP开发学习:表单 - 验证邮件和URL

    $name = test_input($_POST["name"]); if (!preg_match("/^[a-zA-Z ]*$/",$name)) { $ ...

  4. MyBatis从入门到精通(第6章):MyBatis 高级查询->6.1.1高级结果映射之一对一映射

    jdk1.8.MyBatis3.4.6.MySQL数据库5.6.45.IntelliJ IDEA 2019.2.4 本章主要包含的内容为 MyBatis 的高级结果映射,主要处理数据库一对一.一对多的 ...

  5. 关于Ueditor富文本编辑器的配置和使用心得

    一.环境和项目架构 本文章只是为了便于我个人记录日常笔记,如有错误或缺陷,请指出,文章仅供参考,如有转载请附上本文章链接. 介绍:将Ueditor富文本提交的内容直接生成Html文件,传到后台直接保存 ...

  6. Spring核心实现篇

    一.Spring Framework的核心:IoC容器的实现 1.1Spring IoC的容器概述 1.1.1 IoC容器和控制反转模式 依赖控制反转的实现有很多种方式.在Spring中,IOC容器是 ...

  7. Python Numpy中数据的常用的保存与读取方法

    在经常性读取大量的数值文件时(比如深度学习训练数据),可以考虑现将数据存储为Numpy格式,然后直接使用Numpy去读取,速度相比为转化前快很多. 下面就常用的保存数据到二进制文件和保存数据到文本文件 ...

  8. 黑马eesy_15 Vue:03.生命周期与ajax异步请求

    黑马eesy_15 Vue:02.常用语法 黑马eesy_15 Vue:03.生命周期 黑马eesy_15 Vue:04.Vue案例(ssm环境搭建) vue的生命周期与ajax异步请求 1.Vue的 ...

  9. 搭建rocketmq

    安装maven和java环境,此处省略.如果没有安装,请先安装maven和java环境!或者安装openjdk 首先下载rockermq官方地址:http://rocketmq.apache.org/ ...

  10. linux c 调用 python

    /* *gcc -o callpy callpy.cpp -I/usr/include/python3.5 -lpython3.5m */ #include <Python.h> #inc ...