Qt Balloon Window from QFrame

Question

I would like to create my own Balloon window for tips in Qt. I'm starting by creating a window with round corners.

I'm using a class inherited from QFrame. The class's constructor contains:

this->setWindowFlags(Qt::Window | Qt::FramelessWindowHint);
Pal.setColor(QPalette::Background, Qt::yellow);
this->setAutoFillBackground(true);
this->setPalette(Pal);
this->setStyleSheet("QFrame {border-style: solid; border-width: 10px;"
                    "border-radius: 100px;"
                    "min-width: 10em; background-clip: padding; background-origin: content;}");

But this is not creating round corners when showing using the show() member function. I'm getting this:

enter image description here

How can I get rid of those rectangular edges and have them transpararent colored?

If you require any additional information, please ask.

I doubt what you want is possible without some custom drawing in paintEvent(). — Greenflow, Apr 19 '15 at 02:20

score 2 · Accepted Answer · answered Apr 19 '15 at 08:53

2

If my guess is correct you are looking for something like setMask !

Basically what you need to do is draw a rectangle with your desired radius and then convert it to QRegion to use it with setMask. See below one way:

QPainterPath path;
path.addRoundedRect(rect(), 100, 100);
QRegion region = QRegion(path.toFillPolygon().toPolygon());
setMask(region);

And that will be the result:

enter image description here

Hope that helps!

answered Apr 19 '15 at 08:53

Antonio Dias

2,751
20
40

Works. But only for top-level widgets. – Greenflow Apr 19 '15 at 09:03
The OP are trying to do it with a frameless window. It not satisfy? – Antonio Dias Apr 19 '15 at 09:10
Yep. I was overthinking it. Nowadays I do all my gui stuff with qml. Much easier to do stuff like that. – Greenflow Apr 19 '15 at 09:17
Thank you. This works, except that the window is smaller than the original one. Do you know how the size of this can be determined? – The Quantum Physicist Apr 19 '15 at 10:01
The minimum size should be the diameter associated to the radius of the rounded corner, in your case the minimum size should be 200 for both width and height (and this way you'll get a circle). – Antonio Dias Apr 19 '15 at 10:58

score 0 · Answer 2 · edited Sep 11 '19 at 05:36

0

auto frame = new QWidget(parent, Qt::Popup); 
frame->setStyleSheet("background-color: red; border: 1px solid green; border-radius: 6px;");

QPainterPath path; 
path.addRoundedRect(frame->rect(), 6, 6); 
frame->setMask(path.toFillPolygon().toPolygon());

frame->show();

edited Sep 11 '19 at 05:36

eyllanesc

235,170
19
170
241

answered Sep 11 '19 at 05:33

Ajax313

1
1

1

While this code may solve the question, [including an explanation](https://meta.stackexchange.com/q/114762) of how and why this solves the problem would really help to improve the quality of your post, and probably result in more up-votes. Remember that you are answering the question for readers in the future, not just the person asking now. Please [edit] your answer to add explanations and give an indication of what limitations and assumptions apply. – Artog Sep 11 '19 at 05:54

Qt Balloon Window from QFrame

2 Answers2