Hello everyone,
I might start writing some articles with technical information in order to spread information that I consider them obvious but in KDE community might not be.
Many of you might find them boring but in the end I consider them just easy to read technical information.
Contents;
- Myth 1: Qt/QML Client Side Decoration buttons are hard to implement and draw them consistently
- Myth 2: Plasma Themes can not have rounded corners
Myth 1: Qt/QML Client Side Decoration buttons are hard to implement and draw them consistently
Based on Maui Weekly Report #3 I show there is interest for Qt/QML applications that can draw window buttons in window internal space. I even like them in some apps such as music and video players.
For those that want a flame war between SSDs and CSDs I actually dont even care. You can argue as much as you want, this article is not about choosing a winner, it is about technology and solutions that already exist.
Plasma/Qt/KDE technologies have already solved this, so Maui can just use the following proposed solution and in the end provide the most magical client side window buttons that will also be consistent between different apps and they could be even better than other provided solutions.
I dont want to take all the credits for this because the person that really solved it is the KWin maintainer Martin Gräßlin . Even though Martin is always in favor of SSDs (Server Side Decorations) it created and provided a technology that can support CSDs drawing beautifully; that is KDecoration2 library.
One and a half year ago I wanted an applet that could draw window buttons consistently with window titlebars with their animations etc... In the end I discovered the kwin kcm that you can use to configure your titlebar buttons order and placement. That was actually enough. I took that implemention, I adjusted it for plasma applets use and I supported also Aurorae theming. From user point of view KDecoration2/c++ decorations and Aurorae/svg/png are not distinguished.
The applet is called Window Buttons Applet [source] and provides a c++ library that makes it very easy to support window buttons in qml side. Biggest advantage of course is that Window Buttons is NOT drawing and DOES NOT animate the window buttons by itself! All drawing and animations are provided through KDecoration2 at the original decoration implementation. So when the Breeze buttons are drawn and be animated in Window Buttons applet that is actually the Breeze creators implementation. That of course applies to ALL decorations that are based to KDecoration2 library.
How powerful is that:
| - youtube presentation - |
In the video you can see five different Window Buttons Applets insize a plasma panel and for demonstration purposes I change color schemes for the Oxygen window buttons. Decorations used in order are:
- Breeze
- Sierra Breeze Enhanced
- BreezeEnhanced
- UniQ
- Oxygen
So my advice to Maui developers is to take a look at Window Buttons applet... Take the library found there and use it to provide the most consistent and beautiful CSDs :) ... Buttons will look identical for the simple reason that are drawn directly from their creators.
For those that are going to start requesting from me to help and take it upon my shoulders etc... So sorry but I have too many projects that I really like and I want to maintain and improve... Of course and I can provide advice but I am sorry but I can not take up the task. I am pretty sure that the Window Buttons qml code can be used directly with no real adjustments... Someone could even install the Window Buttons applet and use its library to draw window buttons for every QML window.
Myth 2: Plasma Themes can not have rounded corners
I have read that myth so many times in user blogs, reddit articles etc. that in the end I investigated to see what is going on. The findings were pretty clear, Plasma Themes can support rounded corners just fine almost 10 years now but it is up to the designer to support them correctly.
As it appears all designers in kde store were taking the Breeze Plasma theme implementation as a template that did not change too much in order to not break things. The file in question was "widgets/panel-background.svg" . I had even asked some months ago some kde developers what was going on but I did not get a concrete response how this was achievable.
The solution was pretty easy, if your theme provides 2px. rounded corners and you want a bigger one; only thing you need to do is to scale up all the elements in the svg file. So if I scale up everything in the svg file by x2 I will get 4px. roundness, if I scale them by x4 I will get 8px. roundness etc...
I am not such a good designer so I asked the great @varlesh to provide such a plama theme in order to be a reference for all plasma theme designers. The first theme appeared was: ROUNDED @ varlesh
Lately you can find more than three plasma themes that provide big rounded corners in kde store.
 |
| - ROUNDED plasma theme with 24px. rounded corners - |
Latte reference:
Latte is doing something magical here that I believe it should be mentioned. I wanted in Latte to provide autocoloring. So I wanted a way to draw the panel background based on user/window preferences and the user should not notice any breakage. In order to do that Latte must know exactly the plasma theme roundness. That information is not provided in plasma theme metadata. The solution was to draw the svg file and calculate the gap that is created in its background corners. So if you run latte in debug mode with:
"latte-dock -d"
at some point you can read:
[debug 18:07:20.691691] - Plasma theme is dark...
[debug 18:07:20.699699] - COMPOSITING ROUNDNESS ::: 4 _ 4 _ 4 _ 4
[debug 18:07:20.699699] - COMPOSITING ROUNDNESS ::: 4 _ 4 _ 4 _ 4
so that theme is dark and provides 4px. roundness for its four corners.
Donations:
You can find Latte at Liberapay if you want to support,
or you can split
your donation between my active projects in kde store.
