Qt中使用ui设计界面实现显示opencv图片(label+button)
文章目录创建工程环境配置ui设计按钮显示图片(label)业务实现本例以windows下的qt演示操作过程,再移植到虚拟机下运行创建工程环境配置在pro文件中添加opencv库:LIBS和INCLUDEPATH在weight.h中加:#include <opencv2/opencv.hpp>#include <QFileDialog>//文件对话框using namespa
本例以windows下的qt演示操作过程,再移植到虚拟机下运行
创建工程
环境配置
在pro文件中添加opencv库:LIBS
和INCLUDEPATH
在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//使得图片保存高宽比
)));
}
显示效果如下:
更多推荐
所有评论(0)