Discussion:
[Interest] Styling tab background in QTabWidget
Muhammad Bashir Al-Noimi
2013-08-30 00:47:31 UTC
Permalink
Howdy,

As you can see in this screenshot
<Loading Image...> I styled QTabWidget but
I couldn’t set tab’s background to transparent although I used:

1.
QTabWidget#tabWidget_sidebar {
2.
background-color: rgba(255, 255, 255, 0);
3.
}


How can I fix this issue?


--------


BTW, The complete QSS of QTabWidget is:

1.
QMainWindow#MainWindow {
2.
background-image: url(:/theme/bg.jpg);
3.
}
4.
5.
QWidget#centralWidget {
6.
background-color: rgba(255, 255, 255, 0);
7.
}
8.
/**************** SIDE BAR ****************/
9.
QTabWidget#tabWidget_sidebar {
10.
background-color: rgba(255, 255, 255, 0);
11.
}
12.
13.
QTabWidget#tabWidget_sidebar::tab-bar {
14.
alignment: center;
15.
}
16.
17.
QTabWidget#tabWidget_sidebar::pane {
18.
background-color: rgb(255, 255, 255, 0);
19.
}
20.
21.
QTabBar::tab {
22.
background-color: rgb(0, 0, 0, 0);
23.
padding: 2px;
24.
border: 2px;
25.
text-align: center;
26.
height: 64px;
27.
width: 64px;
28.
}
29.
30.
QTabBar::tab:selected {
31.
background-color: rgba(255, 255, 255, 100);
32.
}
33.
34.
QTabBar::tab:hover {
35.
background-color: rgba(255, 255, 255, 150);
36.
}
--
Best Regards,
Muhammad Bashir Al-Noimi
Muhammad Bashir Al-Noimi
2013-09-03 13:39:51 UTC
Permalink
Post by Muhammad Bashir Al-Noimi
As you can see in this screenshot
<Loading Image...> I styled QTabWidget
QTabWidget#tabWidget_sidebar {
background-color: rgba(255, 255, 255, 0);
}
How can I fix this issue?
Guys I'm really depressed of this issue, may I get some help from you? I
read ton of pages and made many tests till arrived to dead end :(

I created a repository contains on demo application for testing
QTabWidget stylesheet https://github.com/mbnoimi/test

I tried to use widget->setAttribute(Qt::WA_TranslucentBackground) as
SGaist suggested but it didn't work!

I tried to use:
QStackedWidget <http://qt-project.org/doc/QStackedWidget.html> *stack =
tabWidget->findChild<QStackedWidget
<http://qt-project.org/doc/QStackedWidget.html> *>();
stack->setStyleSheet("background-color: rgba(255, 255, 255, 0)");
stack->setAttribute(Qt
<http://qt-project.org/doc/Qt.html>::WA_TranslucentBackground);

it didn't work too!
--
Best Regards,
Muhammad Bashir Al-Noimi
Konrad Rosenbaum
2013-09-04 06:45:09 UTC
Permalink
Hi,
Post by Muhammad Bashir Al-Noimi
As you can see in this screenshot
<http://img90.imageshack.us/img90/7582/6iyt.png> I styled QTabWidget but
Please define what you mean by "transparent" - what do you expect to see
behind that widget?

BTW: what you actually told Qt was "make the widget transparent so I can see
the beautiful grey background of my own window".

I'm not entirely sure whether you could make the window itself transparent -
at best it would be a simulation of transparency.


Konrad
Muhammad Bashir Al-Noimi
2013-09-04 21:51:10 UTC
Permalink
what do you expect to see behind that widget?
I expect to see a transparent tab similar to QListWidget and QTabBar.
--
Best Regards,
Muhammad Bashir Al-Noimi
Muhammad Bashir Al-Noimi
2013-09-09 00:36:16 UTC
Permalink
Post by Muhammad Bashir Al-Noimi
what do you expect to see behind that widget?
I expect to see a transparent tab similar to QListWidget and QTabBar.
Any suggestion guys?
--
Best Regards,
Muhammad Bashir Al-Noimi
Loading...