amin例子的简单研究

   amin这个例子，使用了比较复杂高阶的qml技巧，但是也有局限性。下面分3个部分，分别是界面部分，算法部分和扩展部分，简单地对这个问题进行理解。

   

   由衷感谢：http://amin-ahmadi.com/quick-camera-cv/ 给本程序很多借鉴

 

代码下载地址：https://files.cnblogs.com/files/jsxyhelu/GO_GTD2%E5%AE%8C%E6%88%90.zip

视频地址 ：https://files.cnblogs.com/files/jsxyhelu/amin%E4%BE%8B%E5%AD%90%E8%A7%86%E9%A2%91.zip

 

一、qml界面部分：

1、专门生成了用于提示的dialog

/*
        只有一个OK的弹出界面,目前这个弹出界面只给捕获的时候使用
    */
    Dialog
    {
        property alias text: msgDlgLabel.text
        id: messageDialog
        modal: true
        x: (parent.width - width) / 2
        y: (parent.height - height) / 2

        standardButtons: Dialog.Ok
        //上面只有一个label
        Label
        {
            id: msgDlgLabel
            font.bold: true
            wrapMode: Text.Wrap
            width: parent.width
            //点击事件
            onLinkActivated:
            {
                if(link == "图像处理")
                {
                    tabBar.currentIndex = 1
                }
                messageDialog.close()
            }
        }
    }

 

2、整体界面采用swipe和page以及footer的形式，达到了简洁高效

  /*
        主要的swipview界面
    */
    SwipeView
    {
        id: swipeView
        currentIndex: 0
        anchors.rightMargin: 0
        anchors.bottomMargin: 0
        anchors.leftMargin: 0
        anchors.topMargin: 0
        anchors.fill: parent
        //TabBar和swipview要对应起来
        onCurrentIndexChanged:
        {
            tabBar.setCurrentIndex(swipeView.currentIndex)
        }

        //视频预览
        Page
        {……

 

以及

  /*
        主要的footer操作
    */
    footer: TabBar {
        id: tabBar
        currentIndex: 0
        padding: 10

3、使用了HTML增加文本显示效果，并且是可以切换的

 

  
 Text
                            {
                                id: helpText
                                wrapMode: Text.Wrap
                                anchors.left: parent.left
                                anchors.right: parent.right
                                text: "由衷感谢：<a href="http://amin-ahmadi.com/quick-camera-cv/">http://amin-ahmadi.com/quick-camera-cv</a>" +
                                      "给本程序很多借鉴" +
                                      "<br>" +
                                      "<br>" +
                                      "作者博客:" +
                                      "<br>" +
                                      "<a href="jsxyhelu.cnblogs.com">jsxyhelu.cnblogs.com</a>" +
                                      "<br>" +
                                      "<a href="jsxyhelu.cnblogs.com"><img src="http://images2015.cnblogs.com/blog/508489/201607/508489-20160731065441684-483128601.png"  alt="欢迎访问!"></a>"+
                                      "<br>" +
                                      "<b>版权</b>" +
                                      "本程序使用 <a href="http://qt.io/">Qt Framework</a> 作为GUI" +
                                      "<br>" +
                                      "同时使用 <a href="http://opencv.org/">OpenCV</a> 做图像处理算法." +
                                      "<br>" +
                                      "程序采用ICO来自<a href="http://flaticon.com/">Flat Icon</a>."
                                     onLinkActivated:
                                      {
                                           Qt.openUrlExternally(link); 
                                      }

                                }

应该这样讲，有这段代码作为例子，那么这种样式的程序在界面上基本不成问题。

 

二、算法实现部分：

    qml是弱语法，比较类似lambda，所以这种语言的使用对于习惯c语言的我来说有难度，想要精通需要时间；另一个方面，因为需要和OpenCV进行交互，所以更复杂一点。本例中综合使用了qml使用c++封装出来的对象，以及“信号、槽”机制等；在摄像头获取和图片采集实现中，硬件层综合使用了qml和qcamera，捕获使用了QCameraImageCapture，具体这样用

在qml中，使用

  //摄像头选择对话框

                    ComboBox
                    {
                        id: cameraCombo
                        Layout.fillWidth: true
                        Layout.fillHeight: true
                        model: QtMultimedia.availableCameras
                        textRole: "displayName"

                        delegate: ItemDelegate
                        {
                            text: modelData.displayName
                        }
                        onCurrentIndexChanged:
                        {
                            camera.stop()
                            camera.deviceId = model[currentIndex].deviceId
                            camera.start()
                        }
                    }

这样可以获得所有可用摄像头的句柄，然后直接传递到c++中

//调用qcamera进行图像采集
void QCvImageProcessor::setCamera(QVariant v)
{
    QObject *o = qvariant_cast<QObject *>(v);
    camera = qvariant_cast<QCamera *>(o->property("mediaObject"));
    camera->setCaptureMode(QCamera::CaptureStillImage);
    imageCapture = new QCameraImageCapture(camera);
    camera->focus()->setFocusMode(QCameraFocus::ContinuousFocus);
    camera->focus()->setFocusPointMode(QCameraFocus::FocusPointAuto);
    //直接在这里设置动作级联
    connect(imageCapture, &QCameraImageCapture::imageSaved, [this](int id, const QString &fileName)
    {
        Q_UNUSED(id);
        processSavedImage(fileName);
    });
}

void QCvImageProcessor::capture()
{
    if(imageCapture->isReadyForCapture())
    {
        //注意这里获得一个可用的图片地址的方法
        imageCapture->capture(QStandardPaths::writableLocation(QStandardPaths::PicturesLocation));
       
    }
    else
    {
        emit errorOccured("Camera is not ready to capture.");
    }
}

还是使用QCameraImageCapture,QCamera来完成捕获。

 

由于在andoird中,videocapture不能给使用，那么qcamera作为qt专属，来实现摄像头采集功能是非常合适的，这里给出了具体系统方法。

三、进一步扩展部分：

QCameraImageCapture只能捕获静态图片，但是作为一个完整的图像处理程序，一定要能够处理并显示实时的视频数据，如何解决？继续探索！

感谢阅读至此，希望有所帮助。

来自为知笔记(Wiz)

附件列表