本例以windows下的qt演示操作过程,再移植到虚拟机下运行

创建工程

在这里插入图片描述
在这里插入图片描述

环境配置

在pro文件中添加opencv库:LIBSINCLUDEPATH
在weight.h中加:
#include <opencv2/opencv.hpp>
#include <QFileDialog>//文件对话框
using namespace cv;

ui设计

接下来就使用设计器直接进行设计啦

按钮

点击weight.ui
在这里插入图片描述

假设我们现在需要一个按钮,我们直接从左侧拖入我们设计大小的画面中
在这里插入图片描述
在右侧可以对按钮的详细样式进行设计
我们肯定要给按钮添加槽函数,我们只要对着按钮右击——转到槽
在这里插入图片描述
使用最简单的单击就发信号,按OK之后qt就会自动帮我们创建好槽函数啦
在这里插入图片描述

显示图片(label)

opencv的画面(图片)我们使用label绘制进行显示在qt界面中
一样地操作,先从左边拉出来一个label
在这里插入图片描述
我们直接在右侧对label的属性进行设置,为了显示opencv的画面,我们先把这一块label设置为白底
在这里插入图片描述然后选择白色,点ok即可
在这里插入图片描述

当然StyleSheet还有很多其他的样式设计,一样在这里选择哈
同时,既然要拿来显示画面,那么就把字去掉:
在这里插入图片描述

业务实现

那么我们怎么将图片显示在画面中呢?也就是我们要去写之前自动生成的槽函数,下面直接po出代码,详细的解释都在注释中了:

代码业务是:
按下按钮,选择一张jpg图片打开,把图片显示在label选定的位置中

void Widget::on_pushButton_clicked()
{
    //点击按钮,打开文件选择,选择要播放的视频
    QString fileName=QFileDialog::getOpenFileName(this,//1、parent,用于指定父组件
                                                  tr("open Image"),//2、caption,是对话框的标题
                                                  ".",//3、dir,是对话框显示时默认打开的目录,"." 代表程序运行目录
                                                  tr("Image File(*.jpg)"));
    //4、filter,是对话框的后缀名过滤器,比如我们使用"Image Files(*.jpg *.png)"就让它只能显示后缀名是jpg或者png的文件。
    //4、如果需要使用多个过滤器,使用";;"分割,比如"JPEG Files(*.jpg);;PNG Files(*.png)";
    if(fileName.isEmpty())
    {
        return;
    }

    //toLatin1转QString到QByteArray,data转QByteArray到char*(可f1查看)
    Mat srcImage=imread(fileName.toLatin1().data());

    //qt中对图像的颜色格式存储是RGB格式,而opencv中是BG格式
    //要想显示,我们要把BGR转RGB
    cv::cvtColor(srcImage,srcImage,COLOR_BGR2RGB);

    //QT中图片是使用QImage对,而opencv中Mat对象是图片,其中真正数据是存放在Mat的data属性,所以要转化srcImage为disImage
    //用QImage第四个重载方法
    QImage disImage=QImage((const unsigned char*)srcImage.data,
                           srcImage.cols,srcImage.rows,QImage::Format_RGB888);//888是三通道

    //转化好了格式,怎么把QImage和QLabel结合,QLabel显示QImage?
    //ui是访问我们设计工具设计的元素,在设计器左上角可以看到编号
    ui->label->setPixmap(QPixmap::fromImage(disImage.scaled(ui->label->size(),//使得图片匹配为label的大小
                                                            Qt::KeepAspectRatio//使得图片保存高宽比
                                                            )));


}

显示效果如下:
在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐