QT customizes QLabel and uses it to display pictures

Article directory

    • I. Overview
    • 2. Create a new project and add the mylabel class
    • 3. Improve the Label control
    • 4. Reference and connect the signal
    • 5. Effect test

1. Overview

In order to display pictures on the Label and obtain corresponding coordinates, corresponding mouse events are required. However, by default, QLabel does not support mouse event functions, such as click events. To realize the click event of QLabel, there are generally two ways: one is to generate a dynamic library file and place it in the D:\ProgramFiles\Qt\5.12.10\msvc2015_64\plugins\designer directory, that is The control can be directly dragged in the designer, and the other is to directly add the control class and promote the corresponding control to a custom control.

2. Create a new project and add the mylabel class

Add the mylabel class under the project that needs to use the custom control.


The header file and cpp file where the mylibel class is located are as follows:
myLabel.h

#pragma once

#include <QWidget>
#include <QLabel>
#include <QObject>
#include <QEvent>
#include <QMouseEvent>

extern int xlocation;
extern int ylocation;
class mylabel : public QLabel
{<!-- -->
Q_OBJECT // must include this if you use Qt signals/slots
public:
explicit mylabel(QWidget *parent = 0);

signals:
void myClicked(); // signal generated by clicking
void myDoubleClicked(); // signal generated by double click

private:
void enterEvent(QEvent* event); // mouse enter event
void leaveEvent(QEvent *event); //When the mouse leaves
void mousePressEvent(QMouseEvent* event); //mouse press
void mouseReleaseEvent(QMouseEvent *event);//mouse release
void mouseMoveEvent(QMouseEvent *event); //mouse movement
void mouseDoubleClickEvent(QMouseEvent *event); // mouse double click event
};

mylabel.cpp

#include "myLabel.h"
#include <QDebug>
#include <QMoveEvent>
int xlocation = 0;
int ylocation = 0;
mylabel::mylabel(QWidget *parent) :QLabel(parent)
{<!-- -->

}
//mouse enter
void mylabel::enterEvent(QEvent *event)
{<!-- -->
qDebug() << "tips:" << "move enter";
emit myDoubleClicked();
}
//mouse leaves
void mylabel::leaveEvent(QEvent *event)
{<!-- -->
qDebug() << "tips:" << "mouse leave";
emit myDoubleClicked();
}
//mouse pressed
void mylabel::mousePressEvent(QMouseEvent *event)
{<!-- -->
QString Str = QString("location: X=%1 Y=%2").arg(event->x()).arg(event->y());
xlocation = event->x();
ylocation = event->y();
//Determine whether the mouse is pressed the left button or the right button
if (event->button() == Qt::LeftButton) {<!-- -->
qDebug() << "tips:" << "mouse press the left button" + Str;
emit myClicked();
}
else {<!-- -->
qDebug() << "tips:" << "mouse press the right button" + Str;
}
}
//mouse release
void mylabel::mouseReleaseEvent(QMouseEvent *event)
{<!-- -->
//Determine whether the mouse is pressed the left button or the right button
if (event->button() == Qt::LeftButton) {<!-- -->
qDebug() << "tips:" << "mouse release the left button";
}
else {<!-- -->
qDebug() << "tips:" << "mouse release the right button";
}
}
//Mouse move
void mylabel::mouseMoveEvent(QMouseEvent *event)
{<!-- -->
//The continuous state needs to be judged by buttons and operator
if (event->buttons() & amp;Qt::LeftButton) {<!-- -->
QString Str = QString("location: X=%1 Y=%2").arg(event->x()).arg(event->y());
qDebug() << "tips:" << "mouse move" + Str;
}
}
//When the mouse is double-clicked
void mylabel::mouseDoubleClickEvent(QMouseEvent *event)
{<!-- -->
qDebug() << "tips:" << "When the mouse double clicks, the double click signal is issued";
emit myDoubleClicked();
}

3. Improve the Label control

In the ui interface of qt designer, drag the Label control to a suitable position, then right-click and select Promoted widget to promote it to the mylabel class we defined.

Note: After the control is promoted, the header file of the control we defined will be automatically included in our ui header file. As you can see, the header file (myLabel.h) directory is in the same directory as ui_MyLabelTest2.h, so it needs to be copied to this directory.

4. Reference and connect signal

The mouse click event and the execution function are connected through cnnect, and the mouse press event (mousePressEvent), mouse movement event, etc. are protected attributes, so they cannot be directly connected through the signal slot. Here, I mainly want to get the coordinates of the label through the mouse press event, so I use two global variables (xlocation and ylocation) to realize my function.
In addition, the ImshowQImage() function is added to display images on the Label control.

MyLabelTest2::MyLabelTest2(QWidget *parent)
    :QMainWindow(parent)
{<!-- -->
    ui. setupUi(this);
//ui.label11->setText("hello word");
ImshowQImage();
QObject::connect(ui.label11, &mylabel::myClicked, this, &MyLabelTest2::myLabel_Clicked);
}
void MyLabelTest2::ImshowQImage()
{<!-- -->

QString filename = "D:\PyProject01\images\background.jpg";
QImage image(filename);
\t
//The image adapts to the label size
image.scaled(ui.label11->size(), Qt::KeepAspectRatio);
ui.label11->setScaledContents(true);
\t//display image
ui.label11->setPixmap(QPixmap::fromImage(image));
//ui.label_processedImage->resize(ui.label_rawImage->pixmap()->size());
ui.label11->show();
}
void MyLabelTest2::myLabel_Clicked()
{<!-- -->
qDebug() << xlocation << " " << ylocation;
ui.label2->setText(QString::asprintf("(%d,%d)", xlocation, ylocation));
}

5. Effect test

Test our control events by moving the mouse on the Label, pressing, clicking, etc. The test results are as follows:


The final display picture and the corresponding coordinate effect are also realized.

Great, great fun. If you think it is helpful to you, just click three times.

References:
[1] https://blog.csdn.net/lizaijinsheng/article/details/125314092
[2] https://blog.csdn.net/qq_40541268/article/details/85211021
[3] https://blog.csdn.net/qq_33583069/article/details/109513284
[4] https://blog.csdn.net/augfun/article/details/101083946