手机版

微信如何识别小程序代码?

时间:2021-12-13 来源:互联网 编辑:宝哥软件园 浏览:

【小程序代码-设计章节】文章菊花绽放介绍了小程序代码的设计过程。本文继续分享我们在小程序代码识别方面的一些经验,欢迎有共同兴趣的同事一起讨论。

识别之前,我们需要对照片做什么处理

打开扫描,扫描码引擎通常采集的图片是这样的。

微信是如何识别小程序码的?(图1)

实际上,引擎并不关心菊花是什么颜色,所以我们简化了图片,并将其处理成灰度图片。

微信是如何识别小程序码的?(图2)

二值化可以让引擎更容易做事情,所以将灰度图像处理成位图。

微信是如何识别小程序码的?(图3)

如何在黑白图中快速找到菊花的位置

细心的朋友一定注意到,每一朵菊花都有两个共同点:

3个圆形“靶心”(锚点)

右下角的“小程序LOGO”

以上是小程序代码的定位信息,准确定位是识别的第一步。

如何快速找出所有可能的锚点?

在设计这个菊花代码时,我们按照0.8 : 1.2 3360 1 3360 1.2 : 0 0.8绘制锚点。

微信是如何识别小程序码的?(图4)

为什么不用1:1:13:1336013360133:1的比例呢?因为前者的比例更接近黄金比例,更符合人类的审美需求。(下图右边是1:133601:1336013360133601:1)

微信是如何识别小程序码的?(图5)

基于这一特性,通过扫描线在水平、垂直和45度角三个方向扫描整个画面。如果三个方向的黑白像素都接近这个比例,很明显很有可能是一个锚点。

微信是如何识别小程序码的?(图6)

如何定位“小程序LOGO”

最简单的方法就是根据三个锚点的位置来估计小程序LOGO的中心位置(平行四边形)。

微信是如何识别小程序码的?(图7)

在许多扭曲的情况下,上述方法仍然有很大的偏差。因此,我们提出了一种改进的方法:该方法基于圆形LOGO将估计的中心点校正到圆心。

微信是如何识别小程序码的?(图8)

具体校正方法如下:

39-8.gif" />

拍摄出来的码这么“歪”,能否进行“摆正”

由于上文中,我们已经找到了码在图像中的位置,但由于这个码可能已经被旋转,扭曲,所以,我们需要再做一次矩阵变换(透视变换),将其变换到直角坐标系。变换后的码,已经比较易于被机器解读了。

微信是如何识别小程序码的?(图10)

怎么读码

二维码怎么读码

上述流程和传统二维码识别的核心思想并无二致,如果你坚持看到这里,说明你已经知道如何识别二维码了。

微信是如何识别小程序码的?(图11)

经过透视变换,二维码其实已经变成了单位矩阵(如上图,你可以理解一个小块为一个像素点,这里为了方便阅读,放大了),那么,我们顺着二维码的编码路径,就能完整地读出编码信息了。

小程序码怎么读码

其实,按照二维码的套路,我们可以把透视变换后的图,进行编码区域划分。值得注意的是,这里一个彩色小块并非一个像素点,而是一片区域。一个编码块是 0 还是 1,取决于该区域上的黑色像素(面积)的比例,我们称之为“投票法”。

微信是如何识别小程序码的?(图12)

是否有其他读码方案

但在实际应用中,我们发现该方法对于扭曲的场景,识别效率很低,鲁棒性不佳。经过各种尝试和思考,我们借鉴了一维码的识别思路 ——“采样法”。

微信是如何识别小程序码的?(图13)

举个例子,上图中,我们用红色扫描线采样一维码的信息,对于采样的一行像素,我们根据比例读出具体的编码。

微信是如何识别小程序码的?(图14)

类比该方案,我们利用小程序码为“放射线”编码的特性,采样每一条放射线上的一个像素序列,根据黑白比例读出每一条线的编码信息。

目前扫码引擎的性能如何,能应对什么场景

在测试阶段,我们内部自行拍摄采集了各种场景下的大量测试样本,做了如下评测

微信是如何识别小程序码的?(图15)

包括如下场景

微信是如何识别小程序码的?(图16)

版权声明:微信如何识别小程序代码?是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。