QGraphicsView possible bug? - c++

The example code is from my project. I've tried to make it as short as possible and to the point.
The overlay is used to draw over all the other widgets in the app. This works for most widgets, but today I've started to notice that QAbstractScrollArea subclasses are giving me a hard time. The problem is that the overlay appears not on top, and whatever drawing that happens is blocked.
#include <QtGui/QApplication>
#include <QtGui/QVBoxLayout>
#include <QtGui/QGraphicsView>
#include <QtGui/QPushButton>
class View : public QGraphicsView{
public:
View(){
//delete viewport(); setViewport(new QWidget);
}
};
class Widget : public QWidget{
QWidget* overlay_;
public:
Widget(){
resize(512, 512);
QVBoxLayout* layout = new QVBoxLayout;
QPushButton* button = new QPushButton(" Click Me! ");
layout->addWidget(button);
layout->addWidget(new View);
overlay_ = new QWidget(this);
overlay_->installEventFilter(this);
connect(button, SIGNAL(clicked()),
overlay_, SLOT(show()));
overlay_->hide();
setLayout(layout);
}
bool eventFilter(QObject* target, QEvent* event){
if(target == overlay_){
if(event->type() == QEvent::Paint && overlay_->isVisible()){
overlay_->resize(size());
QPainter painter(overlay_);
painter.setPen(QPen(QColor(1, 102, 192, 255), 1, Qt::SolidLine,
Qt::FlatCap, Qt::MiterJoin));
painter.drawRect(rect().adjusted(60, 0, -60, 0));
return true;
}
}
}
};
int main(int argc, char *argv[]){
QApplication a(argc, argv);
Widget w;
w.show();
return a.exec();
}
To fix this in this example and have overlay go on top of View, you'll need to uncomment the commented line at the top. So my question is this: why do I need to delete and assign a new viewport widget in the constructor in order for overlay not get overdrawn?

This isn't a bug with QGraphicsView, it will happen if you use a standard QScrollArea as well.
The issue, I think, is the order in which Qt draws child widgets. Sibling widgets are drawn in the order they are added to the parent (although you can't rely on this).
The reason that resetting the viewport "solved" the problem is because when you do that you create a new QWidget that has no background to be the viewport. The QGraphicsView is still being drawn over the overlay_, it just has a transparent viewport. Notice how it's still drawn behind the pushbutton, however.
If you want to draw an overlay only over the QGraphicsView, you can override QGraphicsView::paintEvent() and do it there. If you want to draw the overlay over your entire widget, I would embed your layout inside a second QWidget and then try using QWidget::raise() to force the overlay visually to the top.

Related

How to fix display problem when I use QGraphicsView and QGraphicsEffect together in Qt?

I have a problem when use QGraphicsView and QGraphicsBlurEffect in my project. When I put them together, my program does not work normally. I wrote a tiny program to reproduce this problem.
The Widget class is inherited from QGraphicsView.
Widget::Widget(QWidget *parent)
: QGraphicsView(parent)
{
scene = new QGraphicsScene(this);
this->setScene(scene);
label = new QLabel;
QPixmap pixmap = QPixmap("../partly_cloudy.png").scaledToWidth(200);
label->setPixmap(pixmap);
label->setGeometry(100,100, pixmap.width(), pixmap.height());
label->setStyleSheet("border:3px;border-color: rgb(255, 100, 0); border-style:solid;");
/* ********image won't show when adding following comment code********
QGraphicsBlurEffect *blur = new QGraphicsBlurEffect;
blur->setBlurRadius(10);
label->setGraphicsEffect(blur);
******* */
QGraphicsProxyWidget *proxyWidget = new QGraphicsProxyWidget;
proxyWidget->setWidget(label);
proxyWidget->setPos(10,10);
scene->addItem(proxyWidget);
}
and main.cpp is as follows.
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
Widget w;
w.show();
return a.exec();
}
This is a screenshot when QGraphicsBlurEffect is not used.
However, this is a screenshot when QLabel uses setGraphicsEffect() to bind blur effect.
To solve this problem, I tried to use a QWidget to wrap QLabel. When I did this, QLabel was rendered. However, it seems to be bounded by a rectangle area.
Widget::Widget(QWidget *parent)
: QGraphicsView(parent)
{
scene = new QGraphicsScene(this);
this->setScene(scene);
/* ********/
container = new QWidget;
container->setStyleSheet("border:3px;border-color: blue; border-style:solid;");
/******** */
label = new QLabel(container);
QPixmap pixmap = QPixmap("../partly_cloudy.png").scaledToWidth(200);
label->setPixmap(pixmap);
label->setGeometry(100,100, pixmap.width(), pixmap.height());
label->setStyleSheet("border:3px;border-color: red; border-style:solid;");
QGraphicsBlurEffect *blur = new QGraphicsBlurEffect;
blur->setBlurRadius(10);
label->setGraphicsEffect(blur);
QGraphicsProxyWidget *proxyWidget = new QGraphicsProxyWidget;
proxyWidget->setWidget(container);
proxyWidget->setPos(80,80);
qDebug() << proxyWidget->boundingRect();
scene->addItem(proxyWidget);
this->setSceneRect(0,0,640,480);
}
The screenshot of the result is.
I tried to set proxyWidget position to {0,0}, and it works normally. it seems that the position of effect rectangle will not influenced by proxyWidget position.
By the way, the version of Qt is 5.14.2.
I've searched for a long time on net. But no use. Please help or try to give some ideas how to achieve this.

Qt Application with layout's, QPushButton and QGraphicsItem

I am trying to draw various shapes like rectangle, ellipse, text etc uisng QGraphicsView and QGraphicsScene. For that I am trying to create an interface where there will be a vertical layout and besides that there will be few buttons. On clicking those buttons, I can show various QGraphicsItem's on screen. I want to create this interface programatically but not using ui.
I tried and ended up this way.
I wanted buttons on the right side and verticalLayout on the left side and both should filled up the whole screen.
Here is my current implementation :
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
QGraphicsScene* scene = new QGraphicsScene(this);
QGraphicsView* view = new QGraphicsView(this);
view->setScene(scene);
QWidget* mainWidget = new QWidget(this);
QHBoxLayout *mainLayout = new QHBoxLayout();
QVBoxLayout *buttonLayout = new QVBoxLayout();
QVBoxLayout *vlayout2 = new QVBoxLayout();
vlayout2->addWidget(view);
QPushButton *btn1 = new QPushButton("Rectangle");
btn1->setSizePolicy( QSizePolicy::Expanding, QSizePolicy::Preferred );
QPushButton *btn2 = new QPushButton("Ellipse");
btn2->setSizePolicy( QSizePolicy::Expanding, QSizePolicy::Preferred );
QPushButton *btn3 = new QPushButton("Text");
btn3->setSizePolicy( QSizePolicy::Expanding, QSizePolicy::Preferred );
buttonLayout->addWidget(btn1);
buttonLayout->addWidget(btn2);
buttonLayout->addWidget(btn3);
buttonLayout->addStretch();
mainLayout->addLayout(buttonLayout);
mainLayout->addLayout(vlayout2);
mainWidget->setLayout(mainLayout);
}
Can anyone guide me ?
Actually, it should work with the hints given in my comments.
I made an MCVE to convince myself:
#include <QtWidgets>
int main(int argc, char **argv)
{
qDebug() << "Qt Version:" << QT_VERSION_STR;
QApplication app(argc, argv);
// setup GUI
QWidget qMain;
qMain.setWindowTitle("Test Box Layout");
qMain.resize(640, 320);
QHBoxLayout qHBox;
QVBoxLayout qVBoxBtns;
QPushButton qBtnRect("Rectangle");
qVBoxBtns.addWidget(&qBtnRect);
QPushButton qBtnCirc("Circle");
qVBoxBtns.addWidget(&qBtnCirc);
QPushButton qBtnText("Text");
qVBoxBtns.addWidget(&qBtnText);
qVBoxBtns.addStretch();
qHBox.addLayout(&qVBoxBtns);
QVBoxLayout qVBoxView;
QGraphicsView qView;
qVBoxView.addWidget(&qView, 1);
qHBox.addLayout(&qVBoxView, 1);
qMain.setLayout(&qHBox);
qMain.show();
// runtime loop
return app.exec();
}
Output:
Thus, there must be something else in OP's code…
Unfortunately, OP didn't expose an MCVE.
Thus, it's not clear how OP's Widget is instanced. Is it the widget which becomes the main window? Is there another widget where the Widget's instance becomes child of?
It's just guessing but the latter would explain what OP described.
To confirm my guess, I modified the above code a bit:
// setup GUI
QWidget qMain0; // main window widget
QWidget qMain(&qMain0); // child widget of main window widget
⋮
qMain.setLayout(&qHBox);
qMain0.show();
// runtime loop
return app.exec();
Please, note that qMain is now a child of qMain0 but there is no layout which adjusts the size of qMain when qMain0 is resized.
Hence, the size of view stays the initial size while the window is resized.

Move a window by clicking an internal widget instead of title bar

In Windows when I create a QMainWindow I can move it around the screen by clicking the title bar and dragging it.
In my application I've hidden the title bar by using setWindowFlags(Qt::CustomizeWindowHint) and I'm trying to build a custom title bar using a widget and setting it in the menu space with setMenuWidget(myWidget).
Now I want to reproduce the original behaviour: I want to click on my MyWidget widget inside the QMainWindow and, while mouse is pressed, dragging the mouse moves the window.
Is there a way to do it?
This is an example on how to implement a fake title bar, that has standard buttons (minimize, maximize, close), and can be dragged to move the whole window (this is based on the approach in #Kevin's answer).
#include <QtWidgets>
class FakeTitleBar : public QWidget{
Q_OBJECT
public:
explicit FakeTitleBar(QWidget* parent= nullptr):QWidget(parent){
label.setSizePolicy(QSizePolicy::Expanding,
QSizePolicy::Expanding);
layout.addWidget(&label);
layout.addWidget(&buttonMinimize);
layout.addWidget(&buttonMaximize);
layout.addWidget(&buttonClose);
//connecting buttons' signals to slots
connect(&buttonMinimize, &QPushButton::clicked,
this, &FakeTitleBar::MinimizeWindow);
connect(&buttonMaximize, &QPushButton::clicked,
this, &FakeTitleBar::MaximizeWindow);
connect(&buttonClose, &QPushButton::clicked,
this, &FakeTitleBar::CloseWindow);
//setting vertical fixed size policy
//so that the title bar does not take up any additional space
setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Fixed);
//a bit of styling
setStyleSheet("QPushButton {margin:0px; padding:5px;}"
"QWidget {background-color:blue; color:white;}");
}
public slots:
//slots for corresponding buttons
void MinimizeWindow(){
window()->showMinimized();
}
void MaximizeWindow(){
if(!window()->isMaximized())
window()->showMaximized();
else
window()->showNormal();
}
void CloseWindow(){
window()->close();
}
protected:
void mousePressEvent(QMouseEvent* event){
//save the press position (this is relative to the current widget)
pressPos= event->pos();
isMoving= true;
}
void mouseMoveEvent(QMouseEvent* event){
//isMoving flag makes sure that the drag and drop event originated
//from within the titlebar, because otherwise the window shouldn't be moved
if(isMoving){
//calculate difference between the press position and the new Mouse position
//(this is relative to the current widget)
QPoint diff= event->pos() - pressPos;
//move the window by diff
window()->move(window()->pos()+diff);
}
}
void mouseReleaseEvent(QMouseEvent* /*event*/){
//drag and drop operation end
isMoving= false;
}
//double-clicking on the title bar should maximize the window
void mouseDoubleClickEvent(QMouseEvent* /*event*/){
MaximizeWindow();
}
//in order for the style sheet to apply on this custom widget
//see https://doc.qt.io/qt-5/stylesheet-reference.html#qwidget-widget
void paintEvent(QPaintEvent *)
{
QStyleOption opt;
opt.init(this);
QPainter p(this);
style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}
private:
QHBoxLayout layout{this};
QLabel label{"Fake Title Bar"};
QPushButton buttonMinimize{"-"};
QPushButton buttonMaximize{"M"};
QPushButton buttonClose{"X"};
QPoint pressPos;
bool isMoving{false};
};
//sample usage
class Widget : public QWidget{
public:
explicit Widget(QWidget* parent= nullptr):QWidget(parent){
setWindowFlags(Qt::CustomizeWindowHint);
layout.addWidget(&titleBar);
layout.addWidget(&label);
layout.setContentsMargins(0, 0, 0, 0);
label.setAlignment(Qt::AlignCenter);
//default size for the window
resize(320,240);
}
~Widget(){}
private:
QVBoxLayout layout{this};
FakeTitleBar titleBar;
QLabel label{"this is a sample window"};
};
int main(int argc, char* argv[]) {
QApplication app(argc, argv);
Widget w;
w.show();
return app.exec();
}
#include "main.moc"
You just need to implement the necessary mouse event handling by overwriting MyWidget's mousePressEvent(), mouseMoveEvent() and mouseReleaseEvent() handlers.
Detect the mouse down, get current mouse position
While moving, get current mouse position, calculate difference, save new position, move window by diff
You can get the window (top level widget) from inside MyWidget through the window() method.

Create a window in qt with shape from an image

Can some one explain me how to make a window in qt according to the shape of some object in an image , for example i have an image of a tree , using that i need to create a window in the shape of a tree ..
After a long search , myself found a good solution , check out this ..
#include <QtGui>
class myMainWindow:public QMainWindow
{
public:
myMainWindow():QMainWindow()
{
setMask((new QPixmap("saturn.png"))->mask());
QPalette* palette = new QPalette();
palette->setBrush(QPalette::Background,QBrush(QPixmap("saturn.png")));
setPalette(*palette);
setWindowFlags(Qt::FramelessWindowHint);
QWidget *centralWidget = new QWidget(this);
QGridLayout *layout = new QGridLayout();
centralWidget->setLayout(layout);
QPushButton* button1 = new QPushButton("Button 1");
button1->setFixedSize(80,50);
layout->addWidget(button1,0,0);
setCentralWidget(centralWidget);
};
~myMainWindow(){};
};
int main(int argc, char **argv)
{
QApplication app(argc, argv);
myMainWindow *window = new myMainWindow();
window->resize(600, 316);
window->show();
return app.exec();
}
Here is a recipe for making a widget with a semi-transparent background colour. Just expand from there by making the background fully transparent, then display the tree image on top of that as a background image. Note that the widget will still behave like a rectangular widget in regards to laying out its child elements, so you probably need to deal with this using some custom layout inside the tree shape.
Start from the docs for QWidget::setMask. It has a version which takes a QBitmap and one that takes a QRegion. This is the fundamental function in getting a transparent widget. The toolkit also includes a clock example using the QRegion version -- I suspect a bitmap is just as easy though.

How to draw a point (on mouseclick) on a QGraphicsScene?

I have the following code to set up a QGraphicsScene. I wish to click on the scene and draw a point at the location I've clicked. How could I do this? This is my current code:
MainWindow::MainWindow(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);
QGraphicsScene *scene;
QGraphicsView *view = new QGraphicsView(this);
view->setGeometry(QRect(20, 50, 400, 400));
scene = new QGraphicsScene(50, 50, 350, 350);
view->setScene(scene);
}
UPDATE: There is a new class called QGraphicsSceneMouseEvent that makes this a little easier.
I just finished an example using it here:
https://stackoverflow.com/a/26903599/999943
It differs with the answer below in that it subclasses QGraphicsScene, not QGraphicsView, and it uses mouseEvent->scenePos() so there isn't a need to manually map coordinates.
You are on the right track, but you still have a little more to go.
You need to subclass QGraphicsView to be able to do something with mouse presses or with mouse releases using QMouseEvent.
#include <QGraphicsView>
#include <QGraphicsScene>
#include <QGraphicsEllipseItem>
#include <QMouseEvent>
class MyQGraphicsView : public QGraphicsView
{
Q_OBJECT
public:
explicit MyQGraphicsView(QWidget *parent = 0);
signals:
public slots:
void mousePressEvent(QMouseEvent * e);
// void mouseReleaseEvent(QMouseEvent * e);
// void mouseDoubleClickEvent(QMouseEvent * e);
// void mouseMoveEvent(QMouseEvent * e);
private:
QGraphicsScene * scene;
};
QGraphicsView doesn't natively have dimension-less points. You will probably want to use QGraphicsEllipse item or simply, scene->addEllipseItem() with a very small radius.
#include "myqgraphicsview.h"
#include <QPointF>
MyQGraphicsView::MyQGraphicsView(QWidget *parent) :
QGraphicsView(parent)
{
scene = new QGraphicsScene();
this->setSceneRect(50, 50, 350, 350);
this->setScene(scene);
}
void MyQGraphicsView::mousePressEvent(QMouseEvent * e)
{
double rad = 1;
QPointF pt = mapToScene(e->pos());
scene->addEllipse(pt.x()-rad, pt.y()-rad, rad*2.0, rad*2.0,
QPen(), QBrush(Qt::SolidPattern));
}
Note the usage of mapToScene() to make the pos() of the event map correctly to where the mouse is clicked on the scene.
You need to add an instance of your subclassed QGraphicsView to the centralWidget's layout of your ui if you are going to use a form.
QGridLayout * gridLayout = new QGridLayout(ui->centralWidget);
gridLayout->addWidget( new MyQGraphicsView() );
or if your ui has a layout already it will look like this:
ui->centralWidget->layout()->addWidget( new MyGraphicsView() );
If you don't use a QMainWindow and a form, you can add it to a QWidget if you set a layout for it and then add your QGraphicsView to that layout in a similar manner. If you don't want a margin around your QGraphicsView, just call show on it and don't put it inside a different layout.
#include <QtGui/QApplication>
#include "myqgraphicsview.h"
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
MyQGraphicsView view;
view.show();
return a.exec();
}
And that's it. Now you are dangerous with QGraphicsView's and their interaction with the mouse.
Be sure to read and study about Qt's Graphics View Framework and the related examples to be effective when using QGraphicsView and QGraphicsScene. They are very powerful tools for 2D graphics and can have a bit of a learning curve but they are worth it.