2016-05-17 1 views
0

J'ai choisi d'utiliser Qt pour gérer l'interface graphique d'un projet sur lequel je travaille.L'arrière-plan de QWidget appliqué à tous ses enfants QWidget

Après avoir trouvé comment appliquer une image au bas de mon QWidget, j'ai remarqué qu'il a un impact sur tous les composants qui y sont ajoutés.

Quel que soit le style appliqué par la méthode setStyleSheet ou même avec un QPixmap, l'arrière-plan de ces éléments est toujours l'image définie pour le conteneur QWidget.

Comment puis-je éviter ce comportement?

Voici mon code:

MainMenu::MainMenu(QWidget* Parent, const QPoint& Position, const QSize& Size) : QWidget(Parent) { 

    QString qwidgetStyle = "QWidget {background-image: url(background.jpg); border: 5px solid rgba(3, 5, 28, 1);}"; 
    QString buttonStyle = "color: rgba(73, 123, 176, 1); font-size:30px; background-color: rgba(73, 123, 176, 1);"; 

    move(Position); 
    resize(Size); 
    setStyleSheet(qwidgetStyle); 

    // Menu title 
    QLabel *title = new QLabel(this); 
    title->setText("Menu"); 
    title->setStyleSheet(buttonStyle); 
    title->setAlignment(Qt::AlignCenter); 

    // Menu buttons 
    // Play 
    buttonPlay = new QPushButton("Play"); 
    (*buttonPlay).setEnabled(true); 
    (*buttonPlay).setStyleSheet(buttonStyle); 
    connect(buttonPlay, SIGNAL(clicked()), this, SLOT(handleButton())); 
    // Option 
    buttonOptions = new QPushButton("Options", this); 
    (*buttonOptions).setEnabled(true); 
    (*buttonOptions).setGeometry(250, 175, 100, 50); 
    (*buttonOptions).setStyleSheet(buttonStyle); 
    connect(buttonOptions, SIGNAL(clicked()), this, SLOT(handleButton())); 
    // Quit 
    buttonQuit = new QPushButton("Quit", this); 
    (*buttonQuit).setEnabled(true); 
    (*buttonQuit).setGeometry(250, 275, 100, 50); 
    (*buttonQuit).setStyleSheet(buttonStyle); 
    connect(buttonQuit, SIGNAL(clicked()), this, SLOT(handleButton())); 

    // Layout 
    QGridLayout *layout = new QGridLayout; 
    layout->setMargin(50); 
    layout->addWidget(title, 0, 0, 1, 5); 
    layout->addWidget(buttonPlay, 3, 1, 2, 3); 
    layout->addWidget(buttonOptions, 4, 1, 2, 3); 
    layout->addWidget(buttonQuit, 5, 1, 2, 3); 
    setLayout(layout); 

    show(); 
} 
+0

Est-ce que [this] (http://www.qtcentre.org/threads/14099-How-to-stop-child-widgets-from-inheriting-parent-s-StyleSheet-and-use-system-default) Aidez-moi? Il semble suggérer d'utiliser le nom du widget dans la feuille de style et d'utiliser la méthode 'setObjectName'. –

+0

Souhaitez-vous écrire une réponse @PaulRooney? C'est la solution actuellement – IAmInPLS

+0

@AlexisP. S'il vous plaît répondez si vous voulez. Je n'ai pas vraiment le temps de faire une bonne réponse pour le moment. –

Répondre

1

Le comportement que vous rencontrez est tout à fait normal, à cause des lignes suivantes:

QString qwidgetStyle = "QWidget {background-image: url(background.jpg); border: 5px solid rgba(3, 5, 28, 1);}"; 
... 
setStyleSheet(qwidgetStyle); 

Ici, vous venez de dire Qt pour appliquer qwidgetstyle à tous les QWidget de votre application, avec le mot-clé QWidget. C'est pourquoi dans Qt, il vaut mieux définir un nom pour votre objet si vous voulez appliquer un style à cet objet particulier.

Dans votre code, QLabel et QPushButton héritent de QWidget, de sorte qu'ils auront le style défini pour un QWidget, à moins que vous leur nom ou que vous spécifiez le style pour chacun.

Si vous souhaitez définir la feuille de style pour votre MainMenu qui hérite directement de QWidget (qui est ce que vous faites en premier lieu), vous devez définir un nom, et ensuite appliquer le style:

setObjectName("MainMenu"); 
QString qwidgetStyle = "QWidget#MainMenu {background-image: url(background.jpg); border: 5px solid rgba(3, 5, 28, 1);}"; 
setStyleSheet(qwidgetStyle); // here, only your MainMenu will have the style "qwidgetstyle" 

Notez que vous pouvez, par exemple, définir la même feuille de style pour chaque QWidget, et d'ajouter seulement une couleur particulière pour votre MainMenu:

// this is in a CSS, but you can apply it directly from the MainMenu constructor of course 
QWidget, QWidget#MainMenu { 
    background-image: url(background.jpg); 
    border: 5px solid rgba(3, 5, 28, 1); 
} // aplied to all QWidget 

QWidget#MainMenu { 
    color : #9b9b9b; // a nice grey, only applied to MainMenu 
} 

Encore une fois, soyez précis lorsque vous utilisez des feuilles de style ou vous finirez h Aving des couleurs/alignements étranges partout dans votre application :). J'espère que cela pourra aider! NB: vous pouvez également remercier @PaulRooney qui a donné un très bon lien dans les commentaires.

+0

Merci beaucoup !! ça marche merveilleusement !! – MelodyBibi