[prev in list] [next in list] [prev in thread] [next in thread]
List: pykde
Subject: Re: [PyQt] How to find the default style sheet parameters for a given QWiget?
From: Maurizio Berti <maurizio.berti () gmail ! com>
Date: 2020-04-23 18:47:58
Message-ID: CAPn+-XTyA1b0kx9Ko1m6Y0jP-Pnfcdtiho4WDKCfkHUB5NSoMA () mail ! gmail ! com
[Download RAW message or body]
[Attachment #2 (multipart/alternative)]
You are assuming that there is a "default" stylesheet, but there isn't any.
Exactly like with web browsers, if you don't specify a stylesheet, the
engine will render the elements using its own "basic" implementation:
stylesheets allow to modify the default appearance of elements only by
specifying "what you want to change".
When you apply a stylesheet, each one of its elements *overrides* of the
default appearance.
Exactly like when overriding a method in a subclass, you are expected to
provide an implementation that behaves like the original method does,
otherwise you'll get unexpected results.
Appearance (and, therefore, the user interaction based on it) of graphical
elements is generally based on two main aspects: font and colors. They are
often requested to the system by the "drawer" (the browser, the programming
framework like Qt or Gtk, etc), but that's not mandatory. The point is that
those are the most important and simple basis for everything else.
Qt does almost the same as browser do: if you apply a stylesheet, its
contents override the default painting behavior of the current QStyle
(which is the one responsible of the drawing and user interaction of every
widget). What happens "under the hood" is that when a stylesheet is set Qt
will use the current QStyle and add a "proxy" for the css: if some css
property requires a different behavior, it will use its own, otherwise the
current QStyle behavior will be used.
When you apply simple modifications like the foreground or background
color, those modifications will be applied on the current style, but
besides those colors, the overall appearance of the widget will not change.
Similarly, the same happens when changing the font: obviously, using a
different font won't alter how a button appears.
Now, when you want to modify other aspects, things change, because those
aspect override the default painting implementation.
If you set the border for a button, you are saying the underlying painting
system to ignore the default border and use your own: the result is that
using "border: 1px solid black" on a button will make its border *always*
black, no matter if it's pressed or not. To ensure that the button status
is always intelligible, you need to specify different properties using the
pseudo CSS selectors (:hover, :pressed, etc).
The more widgets become complex, the more you need to be specific about
their styling.
A checkbox is basically composed of two elements: the check indicator and
its label.
The check indicator is just a graphic element that is drawn differently
according to its different states (exactly like a button): when you see a
checked box you might be led to think that it's composed by a square and a
checkmark, but those two elements are actually a single painted object.
When you use the ::indicator selector, you are telling the style to
override the default painting of the indicator with your own, which means
that you have to provide *all* of its aspects: how should it appear when
checked, how should it appear when unchecked, etc.
Coincidentally, even the styling of HTML checkboxes is not as easy as it
might seem.
The same happens for widgets which are even more complex, like scrollbars.
Again, by setting a stylesheet, you're overriding the default painting
mechanism, so if you want to style a scrollbar, you have to provide *all*
of its aspects: the "groove" (the background), the handle, the buttons.
In conclusion, if you want to use stylesheets, you have to consider how
widgets are structured and understand what each "override" involves.
I suggest you to study the documentation of QStyle and read the source code
of widgets, especially their paintEvent methods: you will better understand
"what widgets are made of" and how they are drawn.
Maurizio
Il giorno gio 23 apr 2020 alle ore 10:45 Marius Pfeifer <mapfus@gmx.de> ha
scritto:
> Hi,
>
>
>
> I already asked the question on stack overflow
> <https://stackoverflow.com/q/61344290/5472354>, but I thought maybe it
> actually makes more sense to ask the question here. For details, please
> look at the post. If you have the answer, maybe you could also post it to
> stack overflow, so more people can benefit from it.
>
>
>
>
>
> Kind regards
>
>
> _______________________________________________
> PyQt mailing list PyQt@riverbankcomputing.com
> https://www.riverbankcomputing.com/mailman/listinfo/pyqt
>
--
È difficile avere una convinzione precisa quando si parla delle ragioni del
cuore. - "Sostiene Pereira", Antonio Tabucchi
http://www.jidesk.net
[Attachment #5 (text/html)]
<div dir="ltr">You are assuming that there is a "default" stylesheet, but \
there isn't any.<div><br>Exactly like with web browsers, if you don't specify \
a stylesheet, the engine will render the elements using its own "basic" \
implementation: stylesheets allow to modify the default appearance of elements only \
by specifying "what you want to change".</div><div><br>When you apply a \
stylesheet, each one of its elements *overrides* of the default \
appearance.</div><div>Exactly like when overriding a method in a subclass, you are \
expected to provide an implementation that behaves like the original method does, \
otherwise you'll get unexpected results.</div><div><br></div><div>Appearance \
(and, therefore, the user interaction based on it) of graphical elements is generally \
based on two main aspects: font and colors. They are often requested to the system by \
the "drawer" (the browser, the programming framework like Qt or Gtk, etc), \
but that's not mandatory. The point is that those are the most important and \
simple basis for everything else.</div><div><br></div><div>Qt does almost the same as \
browser do: if you apply a stylesheet, its contents override the default painting \
behavior of the current QStyle (which is the one responsible of the drawing and user \
interaction of every widget). What happens "under the hood" is that when a \
stylesheet is set Qt will use the current QStyle and add a "proxy" for the \
css: if some css property requires a different behavior, it will use its own, \
otherwise the current QStyle behavior will be used.</div><div><br></div><div>When you \
apply simple modifications like the foreground or background color, those \
modifications will be applied on the current style, but besides those colors, the \
overall appearance of the widget will not change. Similarly, the same happens when \
changing the font: obviously, using a different font won't alter how a button \
appears.<br><br></div><div>Now, when you want to modify other aspects, things change, \
because those aspect override the default painting implementation.</div><div>If you \
set the border for a button, you are saying the underlying painting system to ignore \
the default border and use your own: the result is that using "border: 1px solid \
black" on a button will make its border *always* black, no matter if it's \
pressed or not. To ensure that the button status is always intelligible, you need to \
specify different properties using the pseudo CSS selectors (:hover, :pressed, \
etc).</div><div><br></div><div>The more widgets become complex, the more you need to \
be specific about their styling.</div><div><br></div><div>A checkbox is basically \
composed of two elements: the check indicator and its label.</div><div>The check \
indicator is just a graphic element that is drawn differently according to its \
different states (exactly like a button): when you see a checked box you might be \
led to think that it's composed by a square and a checkmark, but those two \
elements are actually a single painted object.</div><div><br></div><div>When you use \
the ::indicator selector, you are telling the style to override the default painting \
of the indicator with your own, which means that you have to provide *all* of its \
aspects: how should it appear when checked, how should it appear when unchecked, \
etc.<br></div><div>Coincidentally, even the styling of HTML checkboxes is not as easy \
as it might seem.</div><div><br>The same happens for widgets which are even more \
complex, like scrollbars. Again, by setting a stylesheet, you're overriding the \
default painting mechanism, so if you want to style a scrollbar, you have to provide \
*all* of its aspects: the "groove" (the background), the handle, the \
buttons.</div><div><br></div><div>In conclusion, if you want to use stylesheets, you \
have to consider how widgets are structured and understand what each \
"override" involves.<br><br>I suggest you to study the documentation of \
QStyle and read the source code of widgets, especially their paintEvent methods: you \
will better understand "what widgets are made of" and how they are \
drawn.</div><div><br></div><div>Maurizio</div></div><br><div class="gmail_quote"><div \
dir="ltr" class="gmail_attr">Il giorno gio 23 apr 2020 alle ore 10:45 Marius Pfeifer \
<<a href="mailto:mapfus@gmx.de">mapfus@gmx.de</a>> ha \
scritto:<br></div><blockquote class="gmail_quote" style="margin:0px 0px 0px \
0.8ex;border-left:1px solid rgb(204,204,204);padding-left:1ex"><div lang="DE"><div \
class="gmail-m_1953274042886777503WordSection1"><p class="MsoNormal"><span \
lang="EN-US">Hi,<u></u><u></u></span></p><p class="MsoNormal"><span \
lang="EN-US"><u></u> <u></u></span></p><p class="MsoNormal"><span lang="EN-US">I \
already asked the question on <a href="https://stackoverflow.com/q/61344290/5472354" \
target="_blank">stack overflow</a>, but I thought maybe it actually makes more sense \
to ask the question here. For details, please look at the post. If you have the \
answer, maybe you could also post it to stack overflow, so more people can benefit \
from it.<u></u><u></u></span></p><p class="MsoNormal"><span lang="EN-US"><u></u> \
<u></u></span></p><p class="MsoNormal"><span lang="EN-US"><u></u> \
<u></u></span></p><p class="MsoNormal"><span lang="EN-US">Kind \
regards<u></u><u></u></span></p><p class="MsoNormal"><span lang="EN-US"><u></u> \
<u></u></span></p></div></div>_______________________________________________<br> \
PyQt mailing list <a href="mailto:PyQt@riverbankcomputing.com" \
target="_blank">PyQt@riverbankcomputing.com</a><br> <a \
href="https://www.riverbankcomputing.com/mailman/listinfo/pyqt" rel="noreferrer" \
target="_blank">https://www.riverbankcomputing.com/mailman/listinfo/pyqt</a><br> \
</blockquote></div><br clear="all"><div><br></div>-- <br><div dir="ltr" \
class="gmail_signature">È difficile avere una convinzione precisa quando si parla \
delle ragioni del cuore. - "Sostiene Pereira", Antonio Tabucchi<br><a \
href="http://www.jidesk.net" target="_blank">http://www.jidesk.net</a></div>
[Attachment #6 (text/plain)]
_______________________________________________
PyQt mailing list PyQt@riverbankcomputing.com
https://www.riverbankcomputing.com/mailman/listinfo/pyqt
[prev in list] [next in list] [prev in thread] [next in thread]
Configure |
About |
News |
Add a list |
Sponsored by KoreLogic