用qt的label控件显示mjpg-streamer中的视频画面

最新推荐文章于 2025-06-04 15:39:45 发布
原创 最新推荐文章于 2025-06-04 15:39:45 发布 · 1.2w 阅读 · 51 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#Qt #编程 #图形

###在stitip项目中需要用Qt编写一个带界面的实现实时监控的程序，所以准备学习Qt的开发，本文档记录的是是学习Qt过程中的笔记，方便自己复习使用。###

 

2016.9.2

目标：今天想要实现在label中显示自己定义的一张图片，并且自动将大小设置为图片的宽和高。

一、直接添加图片

1.参考Qt的帮助文档，可支持的类型，即可以直接读取并显示的格式有BMP、GIF、JPG、JPEG、PNG、TIFF、PBM、PGM、PPM、XBM、XPM。

2.显示图片步骤：

先打开一个图像；将图像文件加载进QImage对象中；再用QPixmap对象获得图像；最后用QLabel选择一个QPixmap图像对象显示。

这是要插入的图片：

 

 

代码如下（在这之前需要在界面里添加一个Qlabel控件，对象名为label）：

QString filename(“F:\\Study\\junior\\Qt\\door\\1.jpg”);
        QImage* img=new QImage;
        if(! ( img->load(filename) ) ) //加载图像
        {
            QMessageBox::information(this,
                                     tr("打开图像失败"),
                                     tr("打开图像失败!"));
            delete img;
            return;
        }
        ui->label->setPixmap(QPixmap::fromImage(*img));


 

显示的效果如图所示：

 

很明显只能显示图片的一小部分。

 

二、修改label的大小

Qlable设置大小的函数有resize（）

所以在添加图片前加上这行代码可以先调整好label的大小。
    

ui->label->resize(img->width(),img->height());

 

显示结果：

    

好像图片过大了，label的大小已经超过了窗口的大小，还是不能完全显示，所以还是要找其他合适的解决方法。

 

 

我想label的大小范围是固定的，所以应该按比例缩放图片的大小，经过查阅资料有如下的方法：

首先用

label->setGeometry(0,0,400,300);//前两个参数表示label左上角位置后面分别是宽和高

函数设置lable的位置和大小，接着根据图片的大小缩放到合适的大小显示

图片缩放的相关函数是

img->scaled(width,height,Qt::KeepAspectRatio);

该函数前两个参数表示的是缩放之后图片的宽高，而第三个参数的作用是选择模式是否保持长宽比，相关的参数可以在qt的帮助文档中查看。接下来看使用了缩放之后的效果：

 

的确能够把画面全部显示出来了。下面是mainwindows的构建代码：

{
    ui->setupUi(this);
    QString StrWidth,StrHeigth;
    QString filename="F:\\Study\\junior\\Qt\\door\\1.jpg";
            QImage* img=new QImage,* scaledimg=new QImage;//分别保存原图和缩放之后的图片
            if(! ( img->load(filename) ) ) //加载图像
            {
                QMessageBox::information(this,
                                         tr("打开图像失败"),
                                         tr("打开图像失败!"));
                delete img;
                return;
            }
            int Owidth=img->width(),Oheight=img->height();
            int Fwidth,Fheight;       //缩放后的图片大小
            ui->label->setGeometry(0,0,400,300);
            int Mul;            //记录图片与label大小的比例，用于缩放图片
            if(Owidth/400>=Oheight/300)
                Mul=Owidth/400;
            else
                Mul=Oheight/300;
            Fwidth=Owidth/Mul;
            Fheight=Oheight/Mul;
            *scaledimg=img->scaled(Fwidth,Fheight,Qt::KeepAspectRatio);
            ui->label_text->setText(QString("width: ")+StrWidth.setNum(Fwidth)
                                    +QString("\nheight: ")+StrHeigth.setNum(Fheight));
            ui->label->setPixmap(QPixmap::fromImage(*scaledimg));
}

 

2016.9.8

目标：在Qt的实现通过按钮控制在窗口中查看mjpeg-streamer运行时本地显示的摄像头画面。

 

思路：原来在html中只要直接插入图片标签，对应的地址"/?action=stream" ，在打开mjpeg-streamer的时候，就能在网页中显示对应的画面，所以我想在qt的label中将该地址引用为图片是否就可以直接看到画面，接下来就直接在上次的基础上修改代码试试。

 

事实证明我想的太简单了，image.load()只能打开本地的图片，对于网上的图片只能先保存为本地的图片然后再在控件里显示，所以接下来要解决的是如何获取网络上的图片。
查阅了资料之后发现就下载而言，Qt5的QtNetwork模块为我们提供了相当便利的接口,下面我就直接给出源码，相关的函数用法都可以参考帮助文档：

 

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    QNetworkAccessManager *manager;
    manager = new QNetworkAccessManager(this);
    connect(manager, SIGNAL(finished(QNetworkReply*)), this, SLOT(slot_replyFinished(QNetworkReply*)));
    QNetworkRequest request;
    request.setUrl(QUrl("http://www.bz55.com/uploads/allimg/150707/139-150FG51639-50.jpg"));
    manager->get(request);
}
MainWindow::~MainWindow()
{
    delete ui;
}
void MainWindow::slot_replyFinished(QNetworkReply* reply)
{
 QPixmap pix;
 QByteArray data = reply->readAll();
 pix.loadFromData(data, "JPG");
 pix.save("/root/Qt/program/netpicture/tmp1.jpg", "JPG", 100);
 ui->textEdit->resize(500,500);
 ui->textEdit->append("<img src=/root/Qt/program/netpicture/tmp1.jpg width=400 hight=300>");
}


 

要注意的是在mainwindow.h里要写上

void MainWindow::slot_replyFinished(QNetworkReply* reply)


这个槽函数的声明并且加上

#include <QNetworkReply>
#include <QNetworkAccessManager>
#include <QNetworkRequest>


这几个头文件，在.pro文件中加上

QT+= network

这一行，接下来就可以编译运行了。

 

代码中链接对应的图片就显示在了textEdit控件中了，当然在

“/root/Qt/program/netpicture”目录下也成功的下载了这个图片（不然也无法显示）。

 

好了既然能显示网络上的图片了那就简单的修改一下源码试试在label中显示mjpeg-streamer生成的“http://localhost:8080/?action=stream”图片，如果能够显示的话只要加上循环控制应该就可以显示视频了。

 

 

2016.9.10

coding...

 

2016.9.11

思考：经过一天的修改折腾想要的功能基本实现了，其中和预想的不一样的是要读取mjpg-streamer打开后对应的图片链接是”http://localhost:8080/?action=snapshot”

前面那个链接对应的是一个流，这才是一个静态图片。

还有一个难点是在执行了manager->get(request)；并不能立即调用槽函数，所以紧接着执行在label中显示图片的语句的话会出现图片打开失败的错误提示，我想应该是向链接发出访问请求是需要一小段时间的虽然很短但还是比两行命令之间的时间差要长很多，所以我在这两行命令之间添加了延时代码，要注意的是不能调用系统的sleep（）函数，因为这样你的控件就会失去响应，当然label上的画面也就不会刷新了。

接下来就直接贴出代码，这里我也将获取到的画面自动缩放到640*480大小：

QString PU="http://192.168.253.3:8080/?action=snapshot";
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    SetWindow();
}
MainWindow::~MainWindow()
{
    delete ui;
}
void MainWindow::PicConnect(QString PicUrl)
{       //connect to picture
    QNetworkAccessManager *manager;
    manager = new QNetworkAccessManager(this);
    connect(manager, SIGNAL(finished(QNetworkReply*)), this, SLOT(slot_replyFinished(QNetworkReply*)));
    QNetworkRequest request;
    request.setUrl(QUrl(PicUrl));
    manager->get(request);
}
 
void MainWindow::slot_replyFinished(QNetworkReply* reply)
{       //save the picture
 QPixmap pix;
 QByteArray data = reply->readAll();
 pix.loadFromData(data, "JPG");
 pix.save("/root/Qt/program/netpicture/tmp1.jpg", "JPG", 100);
}
void MainWindow::SetWindow()
{       //set the window with one label and pushButton
    this->resize(800,600);
    ui->PicLabel->setGeometry(10,10,640,480);
    ui->PicLabel->setText("PICTURE......");
    ui->PicButton->setGeometry(300,500,30,15);
    isPicOnLabel=false;
    ui->PicButton->setText("Show");
}
void MainWindow::on_PicButton_clicked()
{
    if(isPicOnLabel==false)
    {
        ShowPic();
    }
    else
    {
        StopPic();
    }
}
void MainWindow::ShowPic()
{
    isPicOnLabel=true;
    ui->PicButton->setText("stop");
    while(1)
    {
            if(isPicOnLabel==false)
                break;
            PicConnect(PU);
            QEventLoop eventloop;
            QTimer::singleShot(10, &eventloop, SLOT(quit()));
//等待10*0.001秒
            eventloop.exec();
            if(! ( img->load("/root/Qt/program/netpicture/tmp1.jpg") ) ) //加载图像
            {
                QMessageBox::information(this,
                                         tr("打开图像失败"),
                                         tr("打开图像失败!"));
                delete img;
                return;
            }
            *scaledimg=img->scaled(640,480,Qt::KeepAspectRatio);
            ui->PicLabel->setPixmap(QPixmap::fromImage(*scaledimg));
    }
}
void MainWindow::StopPic()
{
    isPicOnLabel=false;
    ui->PicButton->setText("show");
}


 

其中mainwindow.h.需要包含的头文件以及需要添加的成员变量：

#include <QMainWindow>
#include <QNetworkReply>
#include <QNetworkAccessManager>
#include <QNetworkRequest>
#include<QMessageBox>
#include<QTimer>
 
class MainWindow : public QMainWindow
{
    Q_OBJECT
public:
    bool isPicOnLabel;
    explicit MainWindow(QWidget *parent = 0);    
    QImage* img=new QImage,* scaledimg=new QImage;
    ~MainWindow();
public slots:
    void slot_replyFinished(QNetworkReply* reply);
private slots:
    void on_PicButton_clicked();
private:
    Ui::MainWindow *ui;
    void PicConnect(QString p);
    void SetWindow();
    void ShowPic();
    void StopPic();
};


最后可以看一下程序运行的效果：

这是在按下“show”按钮之前

 

 

按下之后：

 

这时候能够看到连续的画面，帧数可以通过

QTimer::singleShot(10, &eventloop, SLOT(quit()));


的第一个参数来控制，第一个参数的单位是毫秒。

 

为了添加拍照功能，于是加上了一个savebutton，槽函数代码如下：

void MainWindow::on_SaveButton_clicked()
{
    if(isPicOnLabel==false)
    {
        QMessageBox::information(this,
                                 tr("ERROR!"),
                                 tr("NO PICTURE !"));
    }
    else
    {
        QString str_time,path;
        QDateTime time = QDateTime::currentDateTime();
        str_time = time.toString("yyyy-MM-dd_hh-mm-ss");
        path="../netpicture/photo/"+str_time+".jpg";
        QPixmap::fromImage(*img).save(path, "JPG", 100);
        QMessageBox::information(this,
                                 tr("save"),
                                 tr("PICTURE has been saved to folder 'photo!'"));
 
    }
}


---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

后来再看了这个程序发现太多的问题了，析构函数没有写而且在循环显示图片的时候不断的new对象都没有delete，所以把原来的代码改了，没有用循环而是用的定时器来实现不断的刷新图片。下面我就直接把cpp文件全部贴上来。（都怪当初c++基础没学好啊！），不过下面有几个函数是录音和发送按钮的，还没有写好可以不看的。

#include "mainwindow.h"
#include<QPushButton>
#include<QFont>
#include<QApplication>
#include<QIcon>
#include <QPainter>
#include<QMessageBox>
#include<QDebug>
#include<QDir>
#include<QFileDialog>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    setWindowIcon(QIcon(":/new/icon/srcs/title.png")); //设置窗口图标

    img = new QImage;
    scaledimg = new QImage;
    setWindowTitle("智能门神系统");


    isLocal=true;
    showTime=new QTimer;
    showTime->setInterval(130);
    connect(showTime, SIGNAL(timeout()), this, SLOT(flushPic()));
    manager = new QNetworkAccessManager(this);
    connect(manager, SIGNAL(finished(QNetworkReply*)), this, SLOT(slot_replyFinished(QNetworkReply*)));

    Address = "127.0.0.1";
    Port = "8080";
    PU="http://127.0.0.1:8080/?action=snapshot";    //默认地址为127.0.0.1 端口为8080
//    PU="http://127.0.0.1:8080/?action=stream";    //默认地址为127.0.0.1 端口为8080
    QWidget *mainwidgit = new QWidget();
    this->setCentralWidget(mainwidgit);
    //作为主界面，用来放置layout_main,可以解决
    //QLayout: Attempting to add QLayout "" to MainWindow "", which already has a layout
    //的问题

    //左侧按钮和加载图标的变量

    url_label = new QLabel("地址：");
    port_label = new QLabel("端口：");
    url_lineedit =new QLineEdit("127.0.0.1");
    url_lineedit->setMinimumWidth(100);
    url_lineedit->setMaximumWidth(100);
    port_lineedit = new QLineEdit("8080");
    port_lineedit->setMinimumWidth(100);
    port_lineedit->setMaximumWidth(100);

    button_islocal = new QPushButton;
    button_islocal->setText("LOCAL");
    button_islocal->setMinimumSize(70,25);
    button_islocal->setMaximumSize(70,25);

    QIcon button_ico(":/new/icon/srcs/movie.png");
    button_movie = new QPushButton;
    button_movie->setStyleSheet("QPushButton:pressed{border-image:url(:/new/icon/srcs/movieclick.png)}");
    button_movie->setMinimumSize(55,55);    //设置button固定大小就不会在layout里自动变化了
    button_movie->setMaximumSize(55,55);
    button_movie->setIcon(button_ico);
    button_movie->setIconSize(QSize(50,50));
    button_movie->setFlat(true);

    button_shot = new QPushButton();
    button_shot->setStyleSheet("QPushButton:pressed{border-image:url(:/new/icon/srcs/shotclick.png)}");
    button_ico.addFile(":/new/icon/srcs/shot.png");
    button_shot->setMinimumSize(55,55);
    button_shot->setMaximumSize(55,55);
    button_shot->setIcon(button_ico);
    button_shot->setIconSize(QSize(50,50));
    button_shot->setFlat(true);

    button_pictures = new QPushButton();
    button_ico.addFile(":/new/icon/srcs/pictures.png");
    button_pictures->setStyleSheet("QPushButton:pressed{border-image:url(:/new/icon/srcs/picturesclick.png)}");
    button_pictures->setMinimumSize(55,55);
    button_pictures->setMaximumSize(55,55);
    button_pictures->setIcon(button_ico);
    button_pictures->setIconSize(QSize(50,50));
    button_pictures->setFlat(true);

    button_record = new QPushButton();
    button_record->setStyleSheet("QPushButton:pressed{border-image:url(:/new/icon/srcs/recordclick.png)}");
    button_ico.addFile(":/new/icon/srcs/record.png");
    button_record->setMinimumSize(55,55);
    button_record->setMaximumSize(55,55);
    button_record->setIcon(button_ico);
    button_record->setIconSize(QSize(50,50));
    button_record->setFlat(true);

    button_play = new QPushButton();
    button_play->setStyleSheet("QPushButton:pressed{border-image:url(:/new/icon/srcs/playclick.png)}");
    button_ico.addFile(":/new/icon/srcs/play.png");
    button_play->setMinimumSize(55,55);
    button_play->setMaximumSize(55,55);
    button_play->setIcon(button_ico);
    button_play->setIconSize(QSize(50,50));
    button_play->setFlat(true);

    button_movieIsClicked = false;      //初始化按钮的状态
    button_recordIsClicked = false;
    layout_button = new QVBoxLayout();

    //关联按钮的信号和槽函数
    //connect()

    //左侧的logo
    logo_label = new QLabel();        //添加图片
    QImage *logo_img = new QImage(":/new/label/srcs/logo.png");
    QImage *scaled_logo_img = new QImage();
    *scaled_logo_img=logo_img->scaled(150,120,Qt::KeepAspectRatio);
    logo_label->setPixmap(QPixmap::fromImage(*scaled_logo_img));

    //把按钮控件放到左边的垂直布局中
    layout_button->addWidget(button_islocal);
    layout_button->addWidget(url_label);
    layout_button->addWidget(url_lineedit);
    layout_button->addWidget(port_label);
    layout_button->addWidget(port_lineedit);
    layout_button->addWidget(button_movie);
    layout_button->addWidget(button_shot);
    layout_button->addWidget(button_pictures);
    layout_button->addWidget(button_record);
    layout_button->addWidget(button_play);
    //把logolabel放进布局
    layout_logo = new QVBoxLayout();
    layout_logo->addWidget(logo_label);

    //右测
    movie_label = new QLabel();
    movie_label->setFrameStyle(QFrame::Panel|QFrame::Sunken);
    movie_label->resize(640,480);
    img = new QImage(":/new/label/srcs/nosignal.png");
    scaledimg = new QImage;
    *scaledimg=img->scaled(movie_label->width()/4,movie_label->height()/4,Qt::KeepAspectRatio);
    movie_label->setAlignment(Qt::AlignCenter);
    movie_label->setPixmap(QPixmap::fromImage(*scaledimg));

    layout_label = new QGridLayout();
    //将label添加到右侧布局中
    layout_label->addWidget(movie_label);

    //mainlayout
    QGridLayout *layout_main = new QGridLayout(); //让主窗口采用这个布局
    layout_main->setMargin(15);
    layout_main->setSpacing(10);
    layout_main->addLayout(layout_logo,0,0,1,1);
    layout_main->addLayout(layout_button,1,0,2,1);
    layout_main->addLayout(layout_label,0,1,3,5);

    //为编辑框添加失去焦点事件
//    connect(url_lineedit,&QLineEdit::returnPressed,this,&MainWindow::ChangeAddress);
//    connect(port_lineedit,&QLineEdit::returnPressed,this,&MainWindow::ChangePort);

    //为按钮添加事件
    connect(button_movie,&QPushButton::clicked, this,&MainWindow::Click_Button_movie);
    connect(button_shot, &QPushButton::clicked, this, &MainWindow::Click_Button_shot);
    connect(button_pictures,&QPushButton::clicked, this,&MainWindow::Click_Button_pictures);
    connect(button_islocal,&QPushButton::clicked,this,&MainWindow::on_button_islocal);
/*    connect(button_record,&QPushButton::clicked, this, &MainWindow::Click_Button_record);
    connect(button_play,&QPushButton::clicked, this, &MainWindow::Click_Button_play);
    */

    if(!QDir("temp").exists())
    {
        QDir dir;
        dir.mkpath("temp");
    }

    //将mainlayout加到mainwidget上去
    mainwidgit->setLayout(layout_main);
    this->resize(800,600);

    /********** Send and receive message though UCP protocol **************/
    UdpSender = new QUdpSocket(this);
    UdpReader = new QUdpSocket(this);
    // 将UdpReader绑定到localhost的6666端口，接收发到这个端口的信息
    bool result=UdpReader->bind(6666);
    if(!result)
    {
     QMessageBox::information(this,tr("error"),tr("udp socket create error!"));
     return ;
    }
    record = new QProcess;
    play = new QProcess;
    sendfile=new QFile("/root/server/record.mp3");
    recivefile=new QFile("/root/server/play.mp3");
    recivefile->resize(0);

    connect(UdpReader, SIGNAL(readyRead()), this, SLOT(readMessage()));
    connect(button_play,SIGNAL(clicked()),this,SLOT(on_button_play_clicked()));
    connect(button_record,SIGNAL(clicked()),this,SLOT(on_button_record_clicked()));
    connect(UdpReader,SIGNAL(readyRead()),this,SLOT(getAmessege()));

    totalBytes=0;
    loadSize=4*1024;//每次发送4kb
    bytesToWrite=0;

}



MainWindow::~MainWindow()
{
    QFile::remove("temp/temp1.jpg");
    delete img;
    delete scaledimg;
    delete url_label;
    delete port_label;
    delete url_lineedit;
    delete port_lineedit;
    delete button_movie;
    delete button_pictures;
    delete button_play;
    delete button_record;
    delete button_shot;
    delete layout_button;
    delete layout_logo;
    delete logo_label;
    delete movie_label;
    delete layout_label;
    delete button_islocal;
}
void MainWindow::paintEvent(QPaintEvent *event)
{
   QPainter painter(this);
   painter.drawPixmap(0,0,width(),height(),QPixmap(":/new/wall/srcs/wall.jpg"));
}



void MainWindow::slot_replyFinished(QNetworkReply* reply)
{       //save the picture
 QPixmap pix;
 QByteArray data = reply->readAll();
 pix.loadFromData(data, "JPG");
 pix.save("temp/temp1.jpg", "JPG", 50);

 if(! ( img->load("temp/temp1.jpg") ) ) //加载图像
 {
     showTime->stop();
     QMessageBox::information(this,
                              tr("警告"),
                              tr("图像载入失败!"));
     button_movieIsClicked=false;
     QIcon button_ico1(":/new/icon/srcs/movie.png");
     button_movie->setIcon(button_ico1);
     return;
 }
 *scaledimg=img->scaled(this->width()*4/5,this->height()*4/5,Qt::KeepAspectRatio);
 movie_label->setPixmap(QPixmap::fromImage(*scaledimg));

}
void MainWindow::Click_Button_movie()
{
    Address=url_lineedit->text();
    Port=port_lineedit->text();
    if(isLocal)     //判断是否为本地视频
        PU="http://"+Address+":"+Port+"/?action=snapshot/";
    else
        PU="http://"+Address+"/proxy/?action=snapshot";
    if(button_movieIsClicked==false)
    {
        QIcon button_cio(":/new/icon/srcs/stop.png");
        button_movie->setIcon(button_cio);

        button_movieIsClicked=true;
        showTime->start();
    }
    else
    {
        QIcon button_ico1(":/new/icon/srcs/movie.png");
        button_movie->setIcon(button_ico1);
        button_movieIsClicked=false;
        showTime->stop();
    }
}
void MainWindow::on_button_islocal()
{
    if(isLocal)
        button_islocal->setText("WAN");
    else
        button_islocal->setText("LOCAL");
    isLocal=!isLocal;
}
void MainWindow::flushPic()
{
    request.setUrl(QUrl(PU));
    manager->get(request);
/*    if(! ( img->load("temp/temp1.jpg") ) ) //加载图像
    {
        QMessageBox::information(this,
                                 tr("警告"),
                                 tr("图像载入失败!"));
        button_movieIsClicked=false;
        QIcon button_ico1(":/new/icon/srcs/movie.png");
        button_movie->setIcon(button_ico1);
        showTime->stop();
    }
    *scaledimg=img->scaled(this->width()*4/5,this->height()*4/5,Qt::KeepAspectRatio);
    movie_label->setPixmap(QPixmap::fromImage(*scaledimg));
    */
}


void MainWindow::Click_Button_shot()
{
    if(!QDir("photo").exists())
    {
        QDir dir;
        dir.mkpath("photo");
    }
    QString str_time,path;
    QDateTime time = QDateTime::currentDateTime();
    str_time = time.toString("yyyy-MM-dd_hh-mm-ss");
    path="./photo/"+str_time+".jpg";
    QPixmap::fromImage(*img).save(path, "JPG", 100);
    QMessageBox::information(this,
                             tr("save"),
                             tr("PICTURE has been saved to folder 'photo!'"));
}
void MainWindow::Click_Button_pictures()
{
    QIcon button_ico1(":/new/icon/srcs/movie.png");
    button_movie->setIcon(button_ico1);
    button_movieIsClicked=false;

    QFileDialog pho;
    pho.setDirectory(QString("photo"));
    pho.setWindowTitle("截图");
    if(pho.exec())
    {
        QStringList filePath=pho.selectedFiles();
        img->load(filePath[0]);
        *scaledimg=img->scaled(movie_label->width(),movie_label->height(),Qt::KeepAspectRatio);
        movie_label->setPixmap(QPixmap::fromImage(*scaledimg));


    }
}



void MainWindow::sendMessage()
{
      /*totalBytes=sendfile->size();
      int sendNum=totalBytes/loadSize;
      for(int i=0;i<sendNum;i++)
      {
        QByteArray line = sendfile->read(loadSize);
        UdpSender->writeDatagram(line,QHostAddress("127.0.0.0"),7777);
        line.resize(0);
      }
      bytesToWrite=totalBytes-sendNum*loadSize;
      QByteArray line=sendfile->read(bytesToWrite);
      UdpSender->writeDatagram(line,QHostAddress("127.0.0.0"),7777);
      line.resize(0);
      qDebug()<<"send over!";
      sendfile->close();*/

    QByteArray line = sendfile->read(sendfile->size());
    UdpSender->writeDatagram(line,QHostAddress("127.0.0.0"),7777);
    line.resize(0);
    qDebug()<<"send over!";
    sendfile->close();
}
void MainWindow::readMessage()
{
    if(!recivefile->open(QIODevice::WriteOnly))
    {
       qDebug()<<"open play.mp3 error !";
       return;
    }
    while (UdpReader->hasPendingDatagrams())
    {
        QByteArray datagram;
        datagram.resize(UdpReader->pendingDatagramSize());
        QHostAddress sender;
        quint16 senderPort;
        UdpReader->readDatagram(datagram.data(), datagram.size(),&sender,&senderPort);
       // qDebug() <<sender.toString();
        //qDebug() <<senderPort;
        recivefile->write(datagram.data(),datagram.size());
    }
    recivefile->close();
    qDebug() <<"recive success!";

}

void MainWindow::on_button_play_clicked()
{
      bool play_copyIsexit=QFile::exists("/root/server/play_copy.mp3");
      int playmp3Size=recivefile->size();
      if(play_copyIsexit&&playmp3Size)
      {
           QFile::remove("/root/server/play_copy.mp3");
           if(!QFile::copy("/root/server/play.mp3","/root/server/play_copy.mp3"))
               qDebug() <<"copy error!";
      }
      if(!play_copyIsexit&&!playmp3Size)
          QMessageBox::information(this,
                                   tr("messege"),
                                   tr("历史消息为空!"));
      if(!play_copyIsexit&&playmp3Size)
      {
          if(!QFile::copy("/root/server/play.mp3","/root/server/play_copy.mp3"))
              qDebug() <<"copy error!";
      }
      play->start("play /root/server/play_copy.mp3 bass +35");
      recivefile->resize(0);
      recivefile->close();
      qDebug() <<"playing ......";
}


void MainWindow::on_button_record_clicked()
{
    if(button_recordIsClicked==false)
    {
      button_recordIsClicked=true;
      QIcon button_ico(":/new/icon/srcs/send.png");
      button_record->setIcon(button_ico);
      QFile::remove("/root/server/record.mp3");
      record->start("avconv -f alsa -i hw:0 /root/server/record.mp3");
    }
    else
    {
       record->close();
       button_recordIsClicked=false;
       QIcon button_ico1(":/new/icon/srcs/record.png");
       button_record->setIcon(button_ico1);
       if(!sendfile->open(QIODevice::ReadOnly))
       {
           qDebug()<< "open record.mp3 error!";
           return;
       }
       sendMessage();
    }
}

void MainWindow::getAmessege()
{
    QMessageBox::information(this,
                             tr("messege"),
                             tr("A new messege!"));
}





这里是mainwindow.h文件





#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include<QLabel>
#include<QPushButton>
#include<QVBoxLayout>
#include<QHBoxLayout>
#include<QGridLayout>
#include <QNetworkReply>
#include <QNetworkAccessManager>
#include <QNetworkRequest>
#include<QTimer>
#include<QLineEdit>
#include <QtNetwork/QUdpSocket>
#include <QProcess>
#include<QFile>
class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = 0);
    ~MainWindow();
    QImage* img,* scaledimg;
    void ShowPic();
    QTimer *showTime;
    QNetworkAccessManager *manager;
    QNetworkRequest request;

public slots:
    void slot_replyFinished(QNetworkReply* reply);
    void Click_Button_movie();
    void Click_Button_shot();
    void getAmessege();
    void Click_Button_pictures();
    void sendMessage(); // 发送消息
    void readMessage(); // 接受信息
    void on_button_play_clicked();
    void on_button_record_clicked();
    void flushPic();
    void on_button_islocal();
//    void ChangeAddress();
//    void ChangePort();


private:        //主窗口中需要用到的控件和布局的指针
    //左边的按钮和显示logo的label
    QLabel *url_label;
    QLabel *port_label;
    QLineEdit *url_lineedit;
    QLineEdit *port_lineedit;
    QPushButton *button_movie;
    QPushButton *button_shot;
    QPushButton *button_pictures;
    QPushButton *button_record;
    QPushButton *button_play;
    QPushButton *button_islocal;
    QVBoxLayout *layout_button;
    QVBoxLayout *layout_logo;
    QLabel *logo_label;

    //两个UDPSocket,一个接收一个发送
    QUdpSocket *UdpSender;
    QUdpSocket *UdpReader;
    //两个文件，一个保存将要发送的MP3文件，一个保存接收到的MP3文件
    QFile *sendfile;
    QFile *recivefile;
    //两个Process分别调用外部录音和播音软件
    QProcess *record;
    QProcess *play;

    qint64 totalBytes;  //数据总大小
    qint64 bytesWritten;  //已经发送数据大小
    qint64 bytesToWrite;   //剩余数据大小
    qint64 loadSize;   //每次发送数据的大小
    //mjpeg-stream画面的地址
    QString Address,Port,PU;


    //记录按钮状态
    bool button_movieIsClicked; //控制显示“moive”或者“stop”
    bool button_recordIsClicked;//控制显示“record”或者“send”
    bool isLocal;//是否为局域网视频

    //右边显示视频画面的label
    QLabel *movie_label;
    QGridLayout *layout_label;
protected:
    void paintEvent(QPaintEvent *event);
    void SetWindow();



};

#endif // MAINWINDOW_H








 


                

        

    

    
  



    



                



	

		

			

				
					
使用QT实现Mjpeg-streamer的客户端，从mjpg-streamer中读取视频流

				
			

			

				

					u010068150的博客
				

				

					02-27
					
					580
					
				

			

		

		

			
				
参考文章1
参考文章2
参考文章3

			
		

	



                

            
              



	

		

			

				
					
分享一个用QT实现的Mjpeg-streamer客户端(简易版)

				
			

			

				

					aiduan6474的博客
				

				

					01-22
					
					1722
					
				

			

		

		

			
				
mainWindow代码如下(由于篇幅问题，子窗口代码不贴出了，有需要源码的可以留下邮箱)：
/*
 *      Author : 博客园 Lance# 
 */

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QUrl>
#include <QPixmap>
#include <...

			
		

	



              


  
              

                


	

		

			

				
					
在QT中的label控件显示mjpg-stream的视频流画面

				
			

			

				

					qq_41219121的博客
				

				

					09-20
					
					4798
					
				

			

		

		

			
				
最近到了大四，想对大学期间做过的项目进行回顾和总结，故写此博客。

其中的一个项目就是视频监控的智能小车，此博客着重记录视频传输问题。



一、首先确定使用什么工具来发送视频流和接受视频流

    在arm主控板方面，我将其作为客户端，使用mjpg-stream来作为视频流的发送。在服务端，我使用QT中的label控件来接受视频流，并设计UI进行运动控制。



二、确定服务端接受...

			
		

	





	

		

			

				
					
mjpg-streamer工具详解与应用实践

					
最新发布

				
			

			

				

					weixin_32869687的博客
				

				

					06-04
					
					816
					
				

			

		

		

			
				
mjpg-streamer是一个轻量级的网络流媒体服务器，能够将多种来源的图片（如摄像头、网络摄像头、本地图片文件等）编码成JPEG流，并通过HTTP协议传输到客户端。由于其开源性质，用户可以根据需要调整源代码，非常适合用于定制化视频监控系统。视频设备输入插件是mjpg-streamer的一个核心功能，它使得用户可以通过视频捕捉设备，比如摄像头和DV，实时传输视频流。这一功能对于需要进行远程视频监控或者视频捕捉的场景尤其有用。

			
		

	



		

			
		



	

		

			

				
					
使用QT实现Mjpeg-streamer的客户端，采用单独的线程进行视频图片的获取

				
			

			

				

					weixin_44503595的博客
				

				

					02-05
					
					1965
					
				

			

		

		

			
				
1. mjpeg-streamer服务器的搭建
  在树莓派上搭建好mjpeg-streamer的服务器，搭建过程可以参考这篇文章[mjpg-streamer在树莓派上的使用](https://blog.youkuaiyun.com/noriaki/article/details/79107835)

2. 简单QT界面的设计
QT的界面布局主要参考了这篇文章，但是我的里面是使用单独开辟的线程进行解析数据流的，这个文章里面是在主线程中完成的。[QT界面设计](https://www.cnblogs.com/GyFore

			
		

	





	

		

			

				
					
02_Windows10+OpenCV4.5.5+Qt Creator 实现读入本地视频并播放在QLabel控件上

				
			

			

				

					qq_52218412的博客
				

				

					05-19
					
					650
					
				

			

		

		

			
				
发现问题：录制的视频与实际视频时长不一致
解决方法：设置读取视频帧和存储视频帧帧率一致，定时器时间戳一致

			
		

	





	

		

			

				
					
QT项目：远程视频监搭建

				
			

			

				

					weixin_41560737的博客
				

				

					03-03
					
					1995
					
				

			

		

		

			
				
远程视频监控搭建



			
		

	





	

		

			

				
					
qt linux鼠标显示图片,Qt中用QLabel显示图片

				
			

			

				

					weixin_42511255的博客
				

				

					05-13
					
					1186
					
				

			

		

		

			
				
一、直接添加图片1.参考Qt的帮助文档，可支持的类型，即可以直接读取并显示的格式有BMP、GIF、JPG、JPEG、PNG、TIFF、PBM、PGM、PPM、XBM、XPM。2.显示图片步骤：先打开一个图像；将图像文件加载进QImage对象中；再用QPixmap对象获得图像；最后用QLabel选择一个QPixmap图像对象显示。这是要插入的图片：代码如下(在这之前需要在界面里添加一个Qlabel控...

			
		

	





	

		

			

				
					
QT练习视频监控客户端

				
			

			

				

					weixin_41560737的博客
				

				

					04-29
					
					1402
					
				

			

		

		

			
				
视频流服务

			
		

	





	

		

			

				
					
qlabel 添加图标_Qt中用QLabel显示图片

				
			

			

				

					weixin_39751391的博客
				

				

					12-22
					
					4084
					
				

			

		

		

			
				
一、直接添加图片1.参考Qt的帮助文档，可支持的类型，即可以直接读取并显示的格式有BMP、GIF、JPG、JPEG、PNG、TIFF、PBM、PGM、PPM、XBM、XPM。2.显示图片步骤：先打开一个图像；将图像文件加载进QImage对象中；再用QPixmap对象获得图像；最后用QLabel选择一个QPixmap图像对象显示。这是要插入的图片：代码如下(在这之前需要在界面里添加一个Qlabel控...

			
		

	





	

		

			

				
					
Qt--在显示视频的Label上画矩形

				
			

			

				

					墨上烟雨
				

				

					03-10
					
					3174
					
				

			

		

		

			
				
1、注意：需重新Label的鼠标事件和绘图事件
2、工程代码如下：
mylabel.h
#ifndef MyLabel_H
#define MyLabel_H

#include <QLabel>
#include <QPoint>
#include <QPainter>
#include <QColor>
#include <QPaintEv...

			
		

	





	

		

			

				
					
Qt实现在QLabel上播放视频文件，可以拖动进度条，快进倒退

				
			

			

				

					01-09
				

			

		

		

			
				
Qt实现在QLabel上播放视频文件，可以拖动进度条，快进倒退，快进可以两倍快进，同时提供了多倍快进的方法。视频播放过程中，实时显示进度

			
		

	





	

		

			

				
					
StreamerClient:该程序是Qt-5.5.0基于mjpg-streamer（@评估板WRTNode 2R）编写的客户端

				
			

			

				

					04-29
				

			

		

		

			
				
StreamerClient
 该程序是Qt-5.5.0基于mjpg-streamer（@评估板WRTNode 2R）编写的客户端

			
		

	





	

		

			

				
					
视频监控项目--友善之臂---阿里云---QT---mjpg-streamer

				
			

			

				

					qq_45604814的博客
				

				

					05-16
					
					1439
					
				

			

		

		

			
				
1.ping开发板ip地址ping不通

解决：关闭Linux 防火墙：ufw disable

     关闭电脑防火墙：控制面板---系统安全 （记住杀毒软件也要关闭）

linux开启ssh服务，实现ssh远程登录

  


			
		

	





	

		

			

				
					
Ubuntu V4l2中摄像头输出Mjpeg数据在Qt中显示

				
			

			

				

					colorfulshark
				

				

					01-12
					
					5117
					
				

			

		

		

			
				
被这个问题纠结了一天，我的山寨zc301摄像头只能输出mjpeg压缩的数据帧，然而网上绝大多数人都是yuv，教程大多是yuv转rgb24，mjpeg转rgb24的几乎没有，反正我是没找到，被逼的走投无路，尝试了下面的方法。
解决方法如果你已经了解了v4l2处理usb摄像头的步骤，就会知道有一个VIDIOC_DQBUF指令可以获取当前数据帧的缓冲区编号，通过这个编号，我们就可以找到这一帧的起始地址以及

			
		

	





	

		

			

				
					
Qt--QLabel显示视频，CPU占比问题小结

				
			

			

				

					天道酬勤
				

				

					07-05
					
					1万+
					
				

			

		

		

			
				
一、介绍

1、QImage到QPixmap转换耗费的资源较多。将QImage在QLabel显示容易卡死。

2、QWidget（QGLWidget）上Paintevent直接画快很多。

3、现在的电脑的核显和独显一般都支持OpenGL，故而支持Qt中的QGLWidget。

4、嵌入式硬件设备中，高端的一般也支持OpenGL，如rk3399。

5、Qt 显示照片的方式有：

（1）QLabe...

			
		

	





	

		

			

				
					
Qt5下使用OpenCV4打开摄像头并把图像显示到QLabel上并且录制视频

				
			

			

				

					他年得傍蟾宫客
				

				

					07-23
					
					3256
					
				

			

		

		

			
				
环境

windows10
	QT creator 4.13.4
	QT 5.14.2 MSVC2017
	opencv 430 (记得path 中添加opencvworld430.dll，这样qt中就不用加该dll了)
	电脑又vs2017，下载qt在线安装包qt-unified-windows-x86-3.2.3-online.exe，然后选择自己需要的即可。由于已经有了MSVC，故没有安装gcc
工程配置

.pro 文件配置如下

记得添加opencv的lib和include路径

使用的qtpac

			
		

	





	

		

			

				
					
Pyqt5：使用Qlabel标签进行视频播放

				
			

			

				

					牧子川的博客
				

				

					04-04
					
					1万+
					
				

			

		

		

			
				
Pyqt5安装并配置到pycharm方法：完全弄懂如何用pycharm安装pyqt5及其相关配置




			
		

	





	

		

			

				
					
QT opencv读取视频数据，QLabel实时显示图像（定时器）

					
热门推荐

				
			

			

				

					qq_27278957的博客
				

				

					05-28
					
					1万+
					
				

			

		

		

			
				
简述

使用 Qt 做一个实时显示视频的Demo，这里结合Opencv来做的。该视频可以是从摄像头实时获取的数据，也可以是本地保存的视频数据。

简述下思路：


使用 QT 做一个文件选择器，选择本地视频；
	使用opencv读取该视频数据，将视频分解成一帧一帧的图像；
	利用定时器，定时的调用显示图像接口。（这里使用QLabel显示每一帧图像；定时器的时间与视频的帧率有关；）；
注：这里注重说...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		
评论 9

	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值