这是代码片段,需要填写 appid 和 这个 appid 对应的广告位 id
https://developers.weixin.qq.com/s/Sl7wwxms79kv
问题是:
icon 位置 left 我写0,icon并不会贴着屏幕左边,而是距离左边有一定距离。
icon 位置 left 我写 windowWidth - size,icon 并不会靠右,而是有一部分跑到屏幕外面去了。感觉像是整体往右偏移了。
核心代码:
// 定义推荐位
let iconAd = null
var scale = 1;
var windowWidth = window.innerWidth;
var windowHeight = window.innerHeight;
function getGameIconItemStyle(x, y, width) {
return {
appNameHidden: true,
color: 'white',
size: width,
borderWidth: 1,
borderColor: 'white',
left:x,
top:y
}
}
function getGameIconAllStyle(count, x, size) {
var style = []
var startY = windowHeight / scale / 2 - (count * size) / 2 - windowHeight / scale * 0.09;
for(var i = 0; i < count; i++) {
var styleItem = getGameIconItemStyle(x, startY + i * (size + 2), size);
style.push(styleItem)
}
return style;
}
function getGameLeftIconStyle(count, size) {
// 这里写死 left = 0
return getGameIconAllStyle(count, 0, size);
}
function getGameRightIconStyle(count, size) {
// 这里计算 left = windowWidth - size
var x = windowWidth / scale - size;
return getGameIconAllStyle(count, x, size);
}
function getGameIconStyle() {
var style = [];
var size = windowWidth / scale * 0.15;
style = style.concat(getGameLeftIconStyle(4, size))
style = style.concat(getGameRightIconStyle(4, size))
return style;
}
// 创建推荐位实例,提前初始化
if (wx.createGameIcon) {
iconAd = wx.createGameIcon({
adUnitId: 'PBgAAOUZqELoV7hE',
count:8,
style:getGameIconStyle()
})
}
// 在合适的场景显示推荐位
// err.errCode返回1004时表示当前没有适合推荐的内容,建议游戏做兼容,在返回该错误码时展示其他内容
if (iconAd) {
iconAd.load().then(() => {
iconAd.show()
}).catch((err) => {
console.error(err)
})
}
实际情况如图所示:
如果icon实际 size 会比我设置的大,那具体会大多少呢? 我写死一个偏移数值,在不同尺寸屏幕表现不一样,无法调整到完美。根据屏幕宽度按比例计算一个偏移数值,同样在不同尺寸的屏幕上表现不一致。
建议使用这3个参数进行计算