OpenCV学习笔记（二十五）——OpenCV图形界面设计Qt+VS2008

一直对MFC对OpenCV的支持不好而耿耿于怀，了解了Qt对OpenCV支持很好，但网上这方面的资料很少。大部分的图形交互的设计都是基于OpenCV2.0之前的数据结构lpImage进行的。最近得到了一本好书《OpenCV 2 Computer Vision Application Programming Cookbook》，下载的链接为http://ishare.iask.sina.com.cn/f/20485520.html?retcode=0，2011年5月出版，全书都是基于OpenCV2.2版本的实现，采用了新的数据结构。我这里强烈建议利用C++开发的朋友们不要再使用老版本的数据结构了，实在影响开发效率。至于大家最熟悉的参考书《learning OpenCV》和《OpenCV教程——基础篇》这两本广为流传的书，我的看法是已经远远不能满足OpenCV新版本的学习了。真的希望这本新书的中文版尽快出炉。

参考这本书的利用Qt创建GUI，不过书中的办法是在Qt Creator下实现的，我这里通过VS2008+Qt实现。下面结合一个例程介绍一下如何在Qt的GUI环境下开发OpenCV。

先新建工程Qt Project --> Qt Application，点击finish完成工程的创建。然后在项目属性里的连接器的附加依赖项里面添加opencv的lib文件。工程创建好之后，一个后缀名为.ui的文件就是关于界面设计的。首先创建两个按钮，拖拽两个Push Buttons到Form中去，修改其属性，一个名字为Open Image，一个为Process。右键按钮选择connect signal为其添加响应函数，选择clicked（）。对应的cpp文件多出了on_OpenImage_clicked函数，代码如下：

[cpp] view plaincopy

1. #include "qttest1.h"   
2.   
3. qttest1::qttest1(QWidget *parent, Qt::WFlags flags)  
4.     : QMainWindow(parent, flags)  
5. {  
6.     ui.setupUi(this);  
7. }  
8.   
9. qttest1::~qttest1()  
10. {  
11.   
12. }  
13.   
14.   
15. void qttest1::on_OpenImage_clicked()  
16. {  
17.   
18. }  

接下来要在对应的头文件中添加显示图片的必要代码，添加QFileDialog类的声明，OpenCV必要的include头文件包含，在类中声明一个cv :: Mat成员变量。代码如下：

[cpp] view plaincopy

1. #ifndef QTTEST1_H   
2. #define QTTEST1_H   
3.   
4. #include <QtGui/QMainWindow>   
5. #include <QFileDialog>   
6. #include "ui_qttest1.h"   
7.   
8. #include <opencv2/core/core.hpp>   
9. #include <opencv2/highgui/highgui.hpp>   
10.   
11. class qttest1 : public QMainWindow  
12. {  
13.     Q_OBJECT  
14.   
15. public:  
16.     qttest1(QWidget *parent = 0, Qt::WFlags flags = 0);  
17.     ~qttest1();  
18.   
19. private:  
20.     Ui::qttest1Class ui;  
21.     cv::Mat image;  // cv图片   
22.   
23. private slots:  
24.     void on_OpenImage_clicked();  
25. };  
26.   
27. #endif // QTTEST1_H  

接下来添加on_OpenImage_clicked的函数内容。代码如下：

[cpp] view plaincopy

1. void qttest1::on_OpenImage_clicked()  
2. {  
3.     QString fileName = QFileDialog::getOpenFileName(this, tr("Open Image"), ".", tr("Image Files (*.png *.jpg *.jpeg *.bmp)"));  
4.     image = cv::imread(fileName.toAscii().data());  
5.     cv::namedWindow("Original Image");  
6.     cv::imshow("Original Image", image);  
7. }  

类似的办法添加Process按钮的相应代码：

[cpp] view plaincopy

1. void qttest1::on_Process_clicked()  
2. {  
3.     cv::flip(image, image, 1);  
4.     cv::namedWindow("Output Image");  
5.     cv::imshow("Output Image", image);  
6. }  

这样就可以实现一个普通的按钮响应。但我们的目的是将图片显示在对话框form中，这还需要进一步深入学习。与MFC中显示图片需要CvvImage类似，要想在Qt的Form中显示图片，图片的格式也必须为QImage，需要将cv：：Mat的BGR通道顺序变换为RGBA，QImage的格式为Format_RGB32，调用cvtColor实现（这里例程里调用的为BGR2RGB，然后QImage的格式为Format_RGB888，但我试验显示结果是有问题的，故自己调整了一下）。（后经实验，BGR2RGB，Format_RGB888这组参数对于webcam视频是正确的，对于我当时的实验照片是不正确的，格式的问题真是混乱！！！）实现代码如下：

[cpp] view plaincopy

1. cv::cvtColor(image, image, CV_BGR2RGBA);  
2. QImage img = QImage((const unsigned char*)(image.data), image.cols, image.rows, QImage::Format_RGB32);  
3. QLabel *label = new QLabel(this);  
4. label->move(200, 50);  
5. label->setPixmap(QPixmap::fromImage(img));  
6. label->resize(label->pixmap()->size());      
7. label->show();  

注意打开图片的路径不要有中文，最后的显示结果为

相关代码的下载地址为http://download.csdn.net/detail/yang_xian521/3793960