媲美微信的二维码识别库

1. 为什么要做这个库?

相信大家在平常的生活中,如果遇到扫码的场景第一个想到的应该就是微信了,可以说微信使用二维码打开了移动互联网的另一扇大门,并且在扫码体验上及其优秀,本该有一定要求的扫码过程,在经过微信的优化之后,让用户在使用时拥有了一种『随意性』,像拍一张照片一样简单,像发一句消息随意,像摆弄一件玩具一样有趣。

有了这样的『标杆』存在,大家在潜意识里面也都有了标准,你们的扫一扫为什么不好用?为什么要识别这么久?甚至我对准了也识别不出来?摆在我们面前的是各种用户的不满,解决这些问题就成了我们必须要面对的情形。

2. 选型

二维码处理,绕不开的就是ZXing和ZBar了,ZXing作为老牌的识别库已经"孵化"出了包括js、Python、C++、PHP等各个语言的lib,同时Android版本也一直在更新,但是ZBar作为C的处理者,上次的更新已经是7年前了。为了让二维码的识别尽量的快,并且对图像处理有更多的可能性,考量之后我们选用了更具活力的zxing-cpp,选用了它来作为我们的底层处理库。

3. 相机的处理

原始图像的获取至关重要,倘若这一步走不好,其他的处理再好也于事无补,对于从来没有接触这一领域的自己来说,踏遍Android相机的坑不知要花多少时间,好在已经有优秀的开源库,这里特别感谢BGAQRCode-Android的开源库,操纵摄像头的一些重要功能,比如自动对焦、触摸对焦、放大缩小等都已经具备,自己也只是在其之上做了一些小改进,比如GroupView的改进、加入传感器对焦、线程池处理等等。有了这些之后,我们就可以开始处理数据了。

4. 相机数据处理

Android的相机获取到的数据并非我们平常认为的RGB数据,而是视频采集中的经常使用的NV21格式即YUV,所以在获取到这些数据之后是无法直接使用的。

  1. 格式转换
    要转格式首先我们先要了解NV21在内存中是什么样子的。
    YUV420

    不同于我们平常的图片格式,比如png的图片,图片由一个一个像素点构成,400 * 800的图片就有320000个像素,每一个像素对应一个ARGB,即4个字节,分别表示(透明度,红色色值,绿色色值,蓝色色值),就是我们平常见到的(0,255,255,255)一个像素的内存是连在一起的,但是YUV不同于我们『认知』上的格式,这3个数值分别代表的是(明亮度,色度,浓度),一个很有意思的知识是:YUV的发明是由于彩色电视与黑白电视的过渡时期
    YUV的组成

    有了一个大概的了解之后,我们就可以把摄像头的数据转化为我们需要的数据,其实只要根据公式来推倒就可以了,但是了解原理能让我们更好的理解。
    YUV->RGB
  2. 算法优化

    对于二维码来说,它是一个个黑白的点组成的,其实并不需要多么色彩斑斓的装饰,一张灰度图或许是更好的选择,一般的图像处理,都是轮询所有像素数据,对于一个或者一组数据进行处理。一个YUV转化为RGB的算法就是要拿出所有像素,然后各种转换,这无疑是一种浪费。一个更好的选择是把原图像直接转化为灰度图。
    灰度图.jpg
   for (int i = top; i < height + top; ++i) {
            srcIndex += left;
            for (int j = left; j < left + width; ++j, ++desIndex, ++srcIndex) {
                p = data[srcIndex] & 0xFF;
                pixels[desIndex] = 0xff000000 | p << 16 | p << 8 | p;
            }
            srcIndex += margin;
        }
  1. 图片裁剪
    我们知道,通常二维码识别的界面都有一个『框』,这个框并不是可有可无的,它不仅能告诉用户我们正在扫描,二维码应该放在这里面,更能在我们处理时成倍的提高处理效率,在测试的过程中,裁剪和没有经过裁剪的图片处理一般要相差4-5倍的时间。一张600 * 600的图片识别要50-80ms;而一张完整照片,比如1920 * 1080的图片,通常要经过200ms以上的时间处理,如果所有的图片都不经过截取,那么想要提升整体的识别效率是很困难的。图片裁剪是一个非常必要的操作,加上我们上面的灰度转换,两个操作合二为一,得到灰度图的同时也裁剪了图像。经过简单的处理之后,这个图像的“质量”是很高的。


    截取图.jpg

    截取后的图像只有原图像的1/5,更利于我们去处理数据,至此我们的图像已经准备好了。

void ImageUtil::convertNV21ToGrayAndScale(int left, int top, int width, int height, int rowWidth,
                                          const jbyte *data, int *pixels) {
    int p;
    int desIndex = 0;
    int bottom = top + height;
    int right = left + width;
    int srcIndex = top * rowWidth;
    int marginRight = rowWidth - right;
    for (int i = top; i < bottom; ++i) {
        srcIndex += left;
        for (int j = left; j < right; ++j, ++desIndex, ++srcIndex) {
            p = data[srcIndex] & 0xFF;
            pixels[desIndex] = 0xff000000u | p << 16u | p << 8u | p;
        }
        srcIndex += marginRight;
    }
}
5. 二维码识别
  1. 解析二维码
    有了充足的准备,二维码的识别已经是水到渠成的事情了,根据转化好的数据,生成HybridBinarizer对象,通过MultiFormatReader即可解析。

  2. 识别流程优化
    在一些Demo中,二维码处理流程通常是使用setOneShotPreviewCallback作为相机数据的处理,即一帧画面处理完再处理下一帧(两帧不一定是相连的),这样的处理会造成两个问题,首先:相机获取的画面不一定是完全对焦好的,一般我们拿出手机都有一个对焦的动作,中间可能只有50%的画面是可用的,这种情况下可能会丢失清晰的图像而处理了模糊的图像;其次这种串行的处理也是对机能的浪费,现在的手机处理连续的图像是绰绰有余的;最后,这样的处理流程是不受我们控制的,只能来一张处理一张。
    在流程改进中我使用了setPreviewCallback的回调,并统一加入线程池处理。这里我可以控制一秒之内处理多少帧图像,在测试中是300ms处理一帧(不同机型处理的速度不尽相同,为了避免线程池队列过长,选择了较低的处理速度,后期可以根据机型来动态设置处理间隔),为了加速处理,这4帧是识别框内的数据。同时,为了能快速识别简单的二维码,每4帧处理完之后加入一帧全屏处理,这一帧可以作为识别图像明亮度的主帧,也可以在二维码超出识别框时,继续识别数据。有了这个改动,就可以做到点击扫一扫,抬手就能得到结果。但是这个扫码的距离实在不能让人满意,我们常用的扫一扫通常都会有一个放大的操作,而这个操作是扫码优化中也是非常关键的一步。


    scan_simple_code.gif
  3. 放大优化
    想要进一步的优化我们就得更进一步的研究二维码了,二维码的生成细节和原理二维码(QR code)基本结构及生成原理有详细的解释,这里我们发现左上、左下、右上三个位置探测图形,在二维码的解码过程中,其实是分几个步骤的,首先就是要定位这个二维码确认其位置,然后才能取出里面的数据,而这个定位的点就是这三个。在距离二维码较远时,可能无法解析出完整的数据,但是却能定位这个二维码,通过定位点的信息,我们可以进行放大的操作,从而获取到更加精确的图像数据,也更有利于我们解析。

    二维码结构

    /**
     * 没有查询到二维码结果,但是能基本能定位到二维码,根据返回的数据集,检验是否要放大
     *
     * @param result 二维码定位信息
     */
    void tryZoom(BarcodeReader.Result result) {
        int len = 0;
        float[] points = result.getPoints();
        if (points.length > 3) {
            float point1X = points[0];
            float point1Y = points[1];
            float point2X = points[2];
            float point2Y = points[3];
            float xLen = Math.abs(point1X - point2X);
            float yLen = Math.abs(point1Y - point2Y);
            len = (int) Math.sqrt(xLen * xLen + yLen * yLen);
        }
        handleAutoZoom(len);
    }
  1. 与微信的对比
    微信的扫一扫可以说是秒级的处理,特别是在iOS的设备上,更不可思议的是它好像没有距离的限制。经过我们的优化之后,我们的二维码可以在50cm内解析出来,但是与微信相差的还是太远,我们需要更好的处理图像数据,来定位二维码。
6. OpenCV

识别距离

二维码的识别中,距离 是一个非常关键的制约条件,通常在30cm-40cm内是一定可以识别出来的,但是超过这个距离获取到的图像就会比较模糊,如果摄像头的分辨率不高识别率也会下降,如果超过这个阈值,识别算法就只能定位数据而无法解析数据,比如上图中的B点,这里我们加入自动放大就可以解决,但是超过这个距离呢?我们就需要手机移动了。如果有一种方案,可以像在B点时一样,虽然无法获取到数据但是可以得到二维码的位置、大小呢?要做到这个,OpenCV是一个不二之选。

说到图像处理,我们大致有两套方案,方案一:处理图像数据,获取图像轮廓,算法检测二维码位置。方案二:机器学习,直接定位二维码。

两者其实都是可行的,只是在难易度方面的差异,我们首先尝试了机器学习的方案,奈何自己学的还比较浅,收集到的样本数据也不够,训练出来的模型也不太理想,比如一个没有二维码的画面会检查出好几个,又比如有的时候又要离的特别近才能识别出来,这又违背了我们的本意。所以我选择了方案一,虽然听起来没那么高大上了,但是在实际的测试中也完全能达到预期水平。

当图像即无法解析出数据也无法定位到二维码时,我们采用OpenCV去处理图像。因为之前已经进行过灰度处理了,这里可以直接进行Canny化,然后执行findContours方法获取轮廓信息,之后过滤轮廓信息,判断点与点之间的距离,得到二维码的位置信息。(以上的过程看似简单,其实进行了很多尝试,包括二值化,毛边去除、调节亮度、对比度处理,直接获取点信息等等,这里感谢https://blog.csdn.net/jia20003/article/details/77348170
https://blog.csdn.net/zwx1995zwx/article/details/79171979
的图像过滤算法,作为一个图像处理的门外汉真的学到很多)

canny化之后的图像

识别二维码轮廓
定位二维码轮廓,红色框框是自动生成的

拿到这些信息之后,我们就可以遵循在B点时的处理逻辑,直接放大图像获取数据。(你可能会想为什么不直接截取图像,这样就不用费时费力再进行一轮识别,其实这里也想到过,但是得到的数据精度丢失实在太多,我尝试用微信去识别截取得到的二维码,微信也无法检测出来,这样的处理对于简单的二维码或许可行,但是对于稍微复杂的二维码或者我们所要解决的问题来说是远远不够的)

7. 成果

在加入OpenCV之后,我们的识别距离扩大了一倍,得到的效果比预期的还要好。
识别效果展示

8. 待完善的功能
  1. aar过大,因为有OpenCV的加入,aar文件有7.7M。
  2. 扩展性、可定制性不够,这个可以慢慢加入。

注: 不同手机识别效率其实不尽相同,摄像头越好,识别效率越高。

源码地址
欢迎Star,欢迎Fork,欢迎和我一起开发。

9. 感谢

zxing-cpp
BGAQRCode-Android

在不到一个月的时间里完成了主要功能(主要是自己在业余时间完成的),感谢那些无私奉献的博主之余也感受到开源的便利和伟大,我能做的也只是用开源来回馈各位。最后以牛顿的一句话来结尾吧,“我之所以站得高,是因为我站在巨人的肩膀上。”

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,125评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,293评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,054评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,077评论 1 291
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,096评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,062评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,988评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,817评论 0 273
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,266评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,486评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,646评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,375评论 5 342
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,974评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,621评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,796评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,642评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,538评论 2 352