Wystylowane menu w Qt

Niedawno pisałam o tym, jak stylizować elementy interfejsu w Qt za pomocą CSS. Dziś  natomiast inny przykład, jaki użyłam w mojej aplikacji, czyli wystylowane menu w Qt.

Żeby było widać wyraźnie, które elementy odpowiadają za poszczególne fragmenty kodu, można użyć kontrastowych kolorów:

Użyte w przykładzie menu w Qt z kolorowym CSS

Menu użyte w przykładzie z kolorowym CSS


QString style("QMenuBar{background-color: yellow;});
style+="QMenuBar::item{background-color: blue;}";
style+="QMenu::item{background-color: red;}"; 
menuBar()->setStyleSheet(style);

Implementacja właściwa

Efekt końcowy, na jaki się zdecydowałam – oczywiście nieco bardziej subtelny, niż w powyższym przykładowym kodzie:

menu w Qt wystylowane za pomocą CSS

Menu w Qt wystylowane za pomocą CSS.

Na koniec kod źródłowy odpowiadający za powyższy efekt:

QString style("QMenuBar{font-variant:small-caps;font-weight:bold;background-color:black;color:white;}");
style+="QMenuBar::item{border:1px solid white;padding:5px;}";
style+="QMenuBar::item:selected{background-color:#075ba5;color:white;}";
style+="QMenu{font-variant:small-caps;font-weight:bold;background-color:black;color:white;}";
style+="QMenu::item:selected{background-color:#075ba5;color:white;}";
menuBar()->setStyleSheet(style);

Podsumowując, CSS naprawdę świetnie się sprawdza i daje spore możliwości tam, gdzie zwykłe modyfikacje za pomocą Qt Creatora nie są wystarczające.