长按海报长图无法识别小程序码的解决方案
发布于 5 年前 作者 pgong 4724 次浏览 来自 分享

今天刚好看到 @沐绒。 提的一个问题《show-menu-by-longpress 在图片过长时,ios会识别不了小程序二维码》,于是就一本正经的慢悠悠的打开集齐BUG于一身让人又爱又恨的小程序开发工具,心里在想“呵,识别不了??我就不信了”

基础库:2.11.0

经过了漫长的长达300,000毫秒时间,新建了一个代码片段试了一番,各种预览,真机预览,真机调试,确实存在长按识别不出来的情况

是图片太长了?还是功能让人感觉有忽悠了?

最后发现,问题所在:只有在页面可视区域完全显示小程序码时,长按才能识别

所有在这个长按识码的功能变得更强大之前,解决方案如下:(不想多写代码,画海报的时候就把小程序码画在左上或者右上吧)

1、给图片绑定touchstart事件

2、使用wx.createSelectorQuery获取图片高宽位置信息

3、使用wx.pageScrollTo将页面滚动到图片底部对应页面的高度位置,注意 duration 默认为300ms,这里要设置duration为0,不然...

js:

touchstart: function (e) {
  wx.createSelectorQuery().select('.qrcodeImg').boundingClientRect(function (res) {
    wx.pageScrollTo({
      scrollTop: res.top + res.height,
      duration:0, // 设置页面滚动所需的时间,这里设置为0
    })
  }).exec()
}

wxml:

<image src="图片地址" bindtouchstart="touchstart" class="qrcodeImg"  show-menu-by-longpress="{{true}}" mode="widthFix"></image>

最后猜测:长按识码,貌似是长按时,截取当前手机屏幕的图片进行识别的?

以下图片来自 问题《show-menu-by-longpress 在图片过长时,ios会识别不了小程序二维码

第1张图,完整显示小程序码,可以识别

第2张图,小程序码显示不完整,无法识别

第3张图,移动vConsole到小程序码上,也无法识别

代码片段:https://developers.weixin.qq.com/s/EGde0fm970h2

3 回复

牛,太牛了

我又发现这个属性的另一个 bug 了 我真的太难了

我跟美工说,以后做图直接把二维码做中间位置。

回到顶部