Background image changes all my widgets appearance.

[Retourned]

Hi guys,

First of all sorry for my english, I can speak it but definitely I am not a professional. I am using QT + Python (Pyside2) on Mac OSX. Anyway, I don't think my problem has relation with my operating system or programming language.

I need to put a background image to some windows of my project, and I've created them. I created a .qrc file, added the images there, the paths are correct, etc. I compiled the .qrc and used the images on the Designer, more specifically in the Stylesheets of the main QWidget.

I pressed "Add resource --> Background Image --> Select the image", and when I preview the window the background image is here BUT every button, text field, slider, etc, is affected by this background. I mean, the buttons don't keep their design, the slider changes his color a bit, the text fields change their appearance...

And of course when I run the program, these strange things are there. I will show you some examples:

When the image is not placed:

As you can see, the central button is blue, etc. It has kinda a "modern" design, the widgets I mean. But when I put the image in the background, following the steps QT recommend:

You can see the central selector is more squared, the buttons don't keep their color, they have more squared form... etc

How can I solve this? I am literally going crazy, 2 days trying to solve this, because this affect me in every window.

Thank you in advance.

[Bonnie]

Add ID selector to your style sheet

#ObjectName{
background-image: url(:/images/background.jpg);
}

[mrjj]

Hi
Its important to understand stylesheets are cascading -
meaning it will affect the parent and all its children.

So as @Bonnie shows, one has to limit what widgets that should be affected and for that the programmer
can use widgets name ( the # syntax ) and also its type like

QLabel {....}
or both 
QLabel#mylabel {....} 

[Retourned]

@Bonnie @mrjj So, talking about backgrounds, I just should put it for example like that, right?:

QWidget#centralwidget{
background-image: url(:/resources/Imagenes/fondoPrincipal.png);
}

[Bonnie]

@Retourned

1. You don't need to write "QWidget" because any widget is a QWidget.
   Type selector in style sheet is more useful for subclass of QWidget.
   But if you want to match a QWidget exactly, not any subclass, you can use ".QWidget".
2. You need to make sure that there won't be any child widget having the same object name.