收藏
回答

wx.createGameIcon 如何正确设置icon位置?

这是代码片段,需要填写 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 会比我设置的大,那具体会大多少呢? 我写死一个偏移数值,在不同尺寸屏幕表现不一样,无法调整到完美。根据屏幕宽度按比例计算一个偏移数值,同样在不同尺寸的屏幕上表现不一致。

最后一次编辑于  09-21
回答关注问题邀请回答
收藏

1 个回答

  • Forever
    Forever
    09-23

    建议使用这3个参数进行计算

    09-23
    有用
    回复 1
    • 海阔天空®
      海阔天空®
      发表于移动端
      09-23
      贴左边是写死的0啊,不存在计算的问题
      09-23
      回复
登录 后发表内容
问题标签