QML QZXing 二维码扫描

QML QZXing 二维码、条形码扫描

Qt于2022年4月8日发布了6.3版本，QtCreater也来到了7.0版本，带来非常多的变化。笔者常用的QZXing于2021年12月26日更新了3.3版本，也对Qt6有比较好的支持，写个笔记记录一下。

QZXing、QML变化

参考QML for Android 实现二维码扫描（QZXing）、Qt 之二维码扫描等相关文章很容易就可以实现使用镜头扫描识别二维码的功能。但是这几篇文章写作的时间是在Qt 6之前，而Qt 6发布之后，移除了几个QZXing用到的模块，所以之前的QZXing版本在QML6上编译会出错。QZXing的Github上也有写移除的模块：
Qt 6 limitations
On Qt 6, a number of modules have been removed or not yet supported. The list of removed modules includes two important features that directly affect QZXing:
Text codecs
QZXing used QTextCodec to re-interpret the parsed strings into their proper encoding. In Qt6, QTextCodec has been moved to core5compat module. After testing, it seems that QTextCodec, if used through core5compat in Qt 6, it does not support many of the encoding that it did in Qt 5 (for instance, Shift-JIS encoding). To avoid the dependency of an extra module (that also does not work as supposed to), QTextCodec has been replaced by QStringDecoder only when building for Qt 6. If QZXing if build for Qt 5, QTextCodec is used as it was.

而具体到QML for Android 实现二维码扫描（QZXing）这篇文章中所用到的Camera和VideoOutput，也有相关变化。QML增加了MediaDevices和CaptureSession，而VideoOutput中的filter没有了。

QZXing使用方式

使用C++/Qml均有两种方式调用QZXing，一种方式是识别图片，一种方式是视频流。这里有一个问题，笔者使用Qt6.2.3版本在Qml中调用摄像头，在Windows平台中打开摄像头并识别二维码、条形码没有问题，一切正常，但是切换到Android中，***白屏！！！_ _***试了下6.3版本，也一样是白屏，不知道问题出在什么地方… …所以下文的QZXing在Qml6中的使用是在Windows平台，方式是识别相机截图。在Android上笔者用的是Qt5.15.2，方式是视频流。QZXing的3.3版本源码中附带例子，均有两种方式在Qml6中的使用。C++/Qml均可以调用QZXing，笔者这里用的是Qml。Qt Creator 7.0 + Win11/Android 10。QZXing为3.3版本

详解

引用

在.pro文件中添加：

CONFIG += qzxing_qml        //用Qml开发要添加这一行
CONFIG += qzxing_multimedia //采用视频流方式，要添加这一行；识别图片不用添加这一行
CONFIG += staticlib         //静态库方式
include(QZXing/QZXing.pri)

在main.cpp中添加：

#include "QZXing.h"
int main(int argc, char *argv[])
{
    ...
    QZXing::registerQMLTypes();
    ...
}

到这里就先编译一下，正常情况下是可以通过的。

Qml6 采用识别图像方式

QML文件

import QZXing 3.3//QML6在引用这里也有变化，可以不写后面的版本号，直接写：import QZXing

function decode(preview) {
	imageToDecode.source = preview
	decoder.decodeImageQML(imageToDecode);
}
Image{
	id:imageToDecode
}
QZXing{
	id: decoder
	enabledDecoders: QZXing.DecoderFormat_QR_CODE  // 这里是识别格式，还可以添加CODE_128/39/93等
    //optional
    tryHarderType: QZXing.TryHarderBehaviour_ThoroughScanning | QZXing.TryHarderBehaviour_Rotate

    imageSourceFilter: QZXing.SourceFilter_ImageNormal //| QZXing.SourceFilter_ImageInverted
    onDecodingStarted: console.log("Decoding of image started...")
	onTagFound: console.log("Barcode data: " + tag)
	onDecodingFinished: console.log("Decoding finished " + (succeeded==true ? "successfully" :    "unsuccessfully") )
}

这一片段引自QZXing官方，简单明了，就是识别图片中的二维码并输出结果。如果想使用相机实时识别二维码，则添加如下片段：

MediaDevices{//设备
    id: mediaDevice
}
CaptureSession{
    id: cap
    camera: Camera{
        id: camera
        cameraDevice: mediaDevice.defaultVideoInput//输入源
        focusMode: Camera.FocusContinuous//连续自动对焦
    }
    imageCapture: ImageCapture{//这个是抓取相机图像
        id: iCapture
    }
    videoOutput: videoOutput
}
VideoOutput {
    id: videoOutput
    anchors.fill: parent
    fillMode: VideoOutput.PreserveAspectCrop//裁剪
}

把上面两个片段结合就可以实现相机实时扫描二维码：

//笔者这里使用点击识别，实时识别用Timer
Rectangle{
    width: 100
    height: 50
    color: "#00a0e9"
    anchors.centerIn: parent
    radius: 5
    MouseArea{
        anchors.fill: parent
        onClicked: {
            cap.camera.start()
        }
        onDoubleClicked: {
            iCapture.capture()
            decode(iCapture.preview)
        }
    }
}

注： 在Windows平台下，采用这种方式实时识别没有太大问题，在Android中不行，识别时间过短的话相机反应不过来，而且必须设置相机分辨率。

Qt 5.15.2 采用视频流方式

import QZXing 3.3
Camera{
    id: camera
    focus {
        focusMode: Camera.FocusContinuous//连续自动对焦
        focusPointMode: CameraFocus.FocusPointAuto
    }
}
VideoOutput{
    id: videoOutput
    source: camera
    anchors.fill: parent
    autoOrientation: true//视频方向主动调整
    //focus: parent
    fillMode: VideoOutput.PreserveAspectCrop//裁剪
    filters: [ zxingFilter ]
}
QZXingFilter{
    id: zxingFilter
    orientation: videoOutput.orientation//注1
    captureRect: {
        // setup bindings
        videoOutput.contentRect;
        videoOutput.sourceRect;
        return videoOutput.mapRectToSource(videoOutput.mapNormalizedRectToItem(Qt.rect(
                                                                                   0, 0, 1, 1
        )));//设置识别区域为整个屏幕
    }
    decoder {
        enabledDecoders: QZXing.DecoderFormat_CODE_128//条形码
        onTagFound: {
            console.log(tag + " | " + decoder.foundedFormat() + " | " + decoder.charSet());
        }
        tryHarder: false
    }
    onDecodingStarted: {
//            console.log("started");
    }
}

笔者在之前使用QZXing2.3版本的时候，采用视频流方式识别条形码一直没有问题，在更新到QZXing3.3的时候发现只能识别二维码，条形码CODE 128/39/93均不能识别，在重要的部分是在注1这里，视频方向要调整。当条形码与手机屏幕呈“十”字或者有一定的小角度时，没有问题，角度过大或者条形码与手机屏幕平行时均不能识别。诸位看官试一下是不是这样。

QZXing官方下载

https://github.com/ftylitak/qzxing