CODEWITHSUNDEEP
qtqt-creator
TheDarkKnight
TheDarkKnight

Reputation: 27611

Setting the style of QFrame

I have a QFrame, titled 'bannerframe' embedded in a dialog, with other widgets.

I want to dynamically change the background of the frame. If I use a stylesheet defined in the top level dialog (MessageDlg), it appears correctly, like this: -

Correct gradient

The stylesheet is defined as

#bannerFrame
{
    background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, 
                                    stop:0 rgba(195, 40, 9, 255), 
                                    stop:0.7 rgba(225, 121, 113, 255), 
                                    stop:1 rgba(237, 154, 152, 255));
}

However, if I remove this and add the style directly to the bannerframe widget, the gradient doesn't seem to work properly: -

Bad gradient

The same effect is seen, regardless of setting the stylesheet in the Designer, or in code:

QString style = QString("background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,\
                           stop:0 rgba(%1, %2, %3, 255),\
                           stop:1 rgba(%4, %5, %6, 255));").arg(red1).arg(green1).arg(blue1).arg(red2).arg(green2).arg(blue2);

ui->bannerFrame->setStyleSheet(style);

So, what's going on here?

Why does the gradient not work correctly around the frame's widgets when the stylesheet is set directly on the Frame, rather than on the top-level dialog?

Upvotes: 0

Views: 3596

Answers (2)

Megasa3
Megasa3

Reputation: 764

I've had to deal with that too until I discovered that Qt style is decided by the LAST line that sets a style. That means that if you have 

something->setStyleSheet(Style1);
something->setStyleSheet(Style2);
something->setStyleSheet(Style3);

Only Style 3 will remain (If they are equal but changing values. If there are diferences, i.e style1 puts text in Bold and style2 puts text in size 14, they will both work BUT if style3 says that text size is 17, then it will be 17.

To avoid that and be able to change it for every type of widget, you need to define for who is that style:

generallayout->setStyleSheet("NAME{css_code}");

like:

 myLayout->setStyleSheet("QLineEdit{background-color:#ff0066"};

with that only LineEdits will have that background. In your case, you just need to use QFrame or QFrame#bannerFrame depending on what you want.

Upvotes: 1

mikag
mikag

Reputation: 170

That's probably because the widgets in the frame will inherit their parents stylesheet. So what you see is the QLabel widget with the icon having a gradient background. Add a selector to limit the widgets your styles should apply to.

QString style = QString("QFrame {...}");

or

QString style = QString("QFrame#bannerFrame {...}");

Upvotes: 1

Related Questions