Style a QToolBoxs Page with QSS: Difference between revisions

Latest revision as of 15:13, 24 March 2016

Targeting a QToolBox's page widget with QSS selectors can be tricky. Our intuitive mind would try

QToolBox > QWidget { }

But that won't work. The correct way to do it is

QToolBox > QScrollArea > QWidget > QWidget { }

@@ Line 1: / Line 1: @@
-=Style a QToolBoxs Page with <span class="caps">QSS</span>=
+[[Category:HowTo]]
+Targeting a QToolBox's page widget with QSS selectors can be tricky. Our intuitive mind would try
-==Solution==
+<code>
+QToolBox > QWidget { }
+</code>
-==Why?==
+But that won't work. The correct way to do it is
-[http://doc.qt.io/qt-5.0/qtwidgets/qtoolbox.html QToolBox] ''[qt.io]'' creates a new [http://doc.qt.io/qt-5.0/qtwidgets/qscrollarea.html QScrollArea] ''[qt.io]'' for every page as a container to provide scrollbars if necessary. Additionally '''QScrollArea''' also creates another widget as a viewPort. So our [http://doc.qt.io/qt-5.0/qtwidgets/qwidget.html QWidget] ''[qt.io]'' page will be the direct child of that '''viewPort'''.
+<code>
+QToolBox > QScrollArea > QWidget > QWidget { }
-===Categories:===
+</code>
-* [[:Category:HowTo|HowTo]]