Draw rectangle on QLabel

Kira

Hello All,
I have label which is continuously displaying the output of my webcam .
Now i want user to select particular part of the label using mouse and draw circle over the label
to highlight particular section of the video.

jsulm

@Kira You need to overload http://doc.qt.io/qt-5/qwidget.html#mousePressEvent, http://doc.qt.io/qt-5/qwidget.html#mouseMoveEvent, http://doc.qt.io/qt-5/qwidget.html#mouseReleaseEvent and http://doc.qt.io/qt-5/qwidget.html#paintEvent
User presses mouse button: you store the current cursor position
User moves the mouse while pressing mouse button: you draw the circle

dheerendra

Another way you can do is that, write a custom widget to paint your web-cam image, handle mouseEvent, use same paintEvent draw circle.

Kira

@jsulm : Thanks for the reply. My doubt was, as my QLabel on which i am showing the output of webcam is refreshing continuously with frame of images whether this circle will also get refreshed as it image is continuously changing

mrjj

@Kira
Hi
If you just replace the image with setPixmap then yes it replaces all you had drawn before,
but if you override paintEvent and handle drawing yourself then
you just draw image and then the circle ( from variable ) and new frames will not override it.

Notice if you need to drag out a rect , this class
http://doc.qt.io/qt-5/qrubberband.html
is useful.

Kira

Hello All,
@mrjj @jsulm @dheerendra :

Thanks for your reply everyone.
I tried to implement the above functionality using QRubberband.
I tried to follow an approach where i tried to implement the rubberband functionality on the QLabel
using EventFilter.

My problem is that my mousepress event works fine. But when go to mouse move event my code crashes.

Sample code is given below:

bool MainWindow::eventFilter(QObject *obj, QEvent *event)
{
if (event->type() == QEvent::MouseButtonPress)
{
QMouseEvent mouseEvent = static_cast<QMouseEvent>(event);
statusBar()->showMessage(QString("Mouse move (%1,%2)").arg(mouseEvent->pos().x()).arg(mouseEvent->pos().y()));
origin = mouseEvent->pos();
if (!rubberBand)
rubberBand = new QRubberBand(QRubberBand::Line, this);
rubberBand->setGeometry(QRect(origin, QSize()));
rubberBand->show();
qDebug("Entered the Mousebutton press Event");
}

if (event->type() == QEvent::MouseMove)
{
qDebug("Entering the mouse move event");
counter ++;
qDebug()<<counter;
QMouseEventmouseEvent = static_cast<QMouseEvent>(event);
rubberBand->setGeometry(QRect(origin, mouseEvent->pos()).normalized()) // The code crashes at this line.
qDebug("Completed the mouse move event");
}
return false;
}

Thanks in advance

jsulm

@Kira Shouldn't it be

QMouseEvent *mouseEvent = static_cast<QMouseEvent*>(event);
rubberBand->setGeometry(QRect(origin, mouseEvent->pos()).normalized())) ;

Was rubberBand initialized?

Kira

@jsulm : thanks for the reply it worked like a charm.
The issue got resolved now i can draw rubberband easily.

The rubbandband get drawn easily when i assign QRubberband to main window widget.
But when i try to assign it to QLabel there is issue with the drawing of rubberband.
I search on the above topic and came to know it is because of difference of the co-ordinates of window and label and i have to map it globally using the below link:
https://stackoverflow.com/questions/16527248/qrubberband-on-a-definite-label
But the problem still exist and i am not able to draw the rectangle.
//Example code:
void MainWindow::mousePressEvent(QMouseEvent *event){

mypoint = ui->label->mapFromGlobal(this->mapToGlobal(event->pos()));
// mypoint = ui->label->mapFrom(this, event->pos());
// mypoint = this->mapTo(ui->label, event->pos());
if(rubberBand == 0) // You should add this to not have a memory leak
    rubberBand = new QRubberBand(QRubberBand::Rectangle, ui->label_2);//new rectangle band
rubberBand->setGeometry(QRect(mypoint, ui->label_2->size()));
rubberBand->show();

}
After following the above approach,
When i click the mouse inside the label the whole rubberband gets drawn without even moving the cursor.

Another approach would be making a custom QLabel and implement the mouse co-ordinate in it but wanted to know if its possible using above approach

jsulm

@Kira said in Draw rectangle on QLabel:

void MainWindow::mousePressEvent(QMouseEvent *event)

You're overwriting mousePressEvent in MainWindow but actually you should do it only for the label, right? You should subclass QLabel and override mousePressEvent there.

Kira

@jsulm : Yes you are correct. But is there any way in which i can implement it in mouse event of the main window instead of creating the subclass of the QLabel as mentioned in the link by mapping the co-ordinates.

jsulm

@Kira Well, you need to check whether the user actually clicked inside the label or not.

Kira

@jsulm : can you please elaborate the approach. Because currently i am clicking inside the qlable and drawing the rubberband

mrjj

@Kira

Hi
If you get mouseEvents to mainwindow, the x,y coordinates will be for the main window.
so when you press buttons, you need to use something like
http://doc.qt.io/qt-5/qapplication.html#widgetAt
and check if over the label.

But why do you want this ?
It will just be more complex than letting QLabel do it
You will also need to map coordinates as else it wont draw where u press as mainwindows x,Y is not the same
for label. so you must alter the x,y to draw inside QLabel.

Kira

@jsulm @mrjj : Guys thanks for your support. Got the issue resolved.
Actually there was issue with the mouse drag functionality where i was passing the event of the main widget.
It got resolved by mapping the coordinates of the mainwindow to global coordinate system.

Will implement the functionality by creating subclass of the label and implement the rubberband as stated earlier as the correct approach.

Just wanted to see whether the implementation is possible by this approach.

Thanks again for your help and support.

mrjj

Super :)
for at quick start, u could use
https://wiki.qt.io/Clickable_QLabel

Kira

@mrjj : thanks buddy.
Best supportive forum with best people and special thanks to @SGaist