[solved] setStyleSheet to QPushButton - rounded corners
-
wrote on 23 May 2014, 14:10 last edited by
Hi,
I have problem with rounding corners of buttons. I am using setStyleSheet:@
newButton->setStyleSheet(QString::fromUtf8("QPushButton{background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,"
"stop: 0 white, stop: 1 grey);"
"border-style: solid;"
"border-color: black;"
"border-width: 2px;"
"border-radius: 10px;}"));
@And everything will be ok, because border of button is rounded, but the corners of background are out of the border and they are visible. Is there any way to get this corners rounded?
And second question: is there any way to learn more about setting custom styles? Is there some examples which widget has which attributes that I could change ie. in pushbutton I can chage border-style, border-width etc.
-
wrote on 23 May 2014, 17:28 last edited by
Hi,
I guess you should work with padding to decrease the size of your background area.
You may find references "here: ":http://qt-project.org/doc/qt-5/stylesheet-reference.html and examples to all widgets "here: ":http://qt-project.org/doc/qt-5/stylesheet-examples.html
-
wrote on 28 May 2014, 07:55 last edited by
Sorry, but it doesn't work. More, I found sth like that about padding:
bq. padding uses the background-color specified for whatever it is padding
So I think padding it's not the thing I should use or I use it wrong.
I add:@
padding: 10 px 10px 10px 10px;
@ -
wrote on 28 May 2014, 08:32 last edited by
Hi, I've just drawn a QPushButton with your settings:
@
QPushButton{
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 white, stop: 1 grey);
border-style: solid;
border-color: black;
border-width: 5px;
border-radius: 10px;
}
@and all corners are perfectly filled - even if I increase the radius.
What Qt/OS version are you using?
-
wrote on 28 May 2014, 08:39 last edited by
Qt 5.2.1, visual 2012, Win7
I create this buttons dynamically - if that change sth?
And this buttons are added to QGraphicsScene, where I have set image in background -
wrote on 28 May 2014, 08:46 last edited by
It should not - but it's possible.
What happens, if you try a button using the designer?I will test with 5.2.1 and win7+mingw48 soon.
-
wrote on 28 May 2014, 08:51 last edited by
In the designer I have only widget window with QGraphicsView expanded to whole window. And I can't add button to QGraphicsView.
-
wrote on 28 May 2014, 09:39 last edited by
I've just checked with win7 and 5.2.0 and designer - mounted the QPushButton on top of a QGraphicsView and the styleSheet looks good.
-
wrote on 28 May 2014, 10:00 last edited by
Could you put the code, how did you do this? Maybe I do sth wrong.
EDIT:
Ok, I should write everything: I use not only QGraphicsView, but also QGraphicsScene where I add pixmap and buttons.Probably, I should set QGraphicsView as a parent to the PushButton, but how I should do this if I have my own class that inherits QPushButton class?
-
wrote on 28 May 2014, 10:32 last edited by
I have no experience in using QGraphics... yet and I guess there lies the reason for your issues with the rounded corners.
That's what I've done to see if styleSheet works:
I've simply put a QGraphicsView on a QDialog and a QPushButton on top of that using the Designer. Then I modify the Stylesheet in the Designer. -
wrote on 29 May 2014, 10:31 last edited by
Ok, I found where the problem was. In my first solution I created button and then I added it to the scene. Now I do not do this, the only thing I change is to set graphicsView as a parent of that button. And now it works fine.
-
wrote on 13 Nov 2019, 08:04 last edited by
Try this and also check this https://doc.qt.io/qt-5/stylesheet-examples.html and https://doc.qt.io/qt-5/stylesheet-reference.html
QPushButton {
color: #333;
border: 2px solid #555;
border-radius: 20px;
border-style: outset;
background: qradialgradient(
cx: 0.3, cy: -0.4, fx: 0.3, fy: -0.4,
radius: 1.35, stop: 0 #fff, stop: 1 #888
);
padding: 5px;
}QPushButton:hover {
background: qradialgradient(
cx: 0.3, cy: -0.4, fx: 0.3, fy: -0.4,
radius: 1.35, stop: 0 #fff, stop: 1 #bbb
);
}QPushButton:pressed {
border-style: inset;
background: qradialgradient(
cx: 0.4, cy: -0.1, fx: 0.4, fy: -0.1,
radius: 1.35, stop: 0 #fff, stop: 1 #ddd
);
}