Tag Archives: graphics

Update of Polyester 2

Graphics

Published an updated version of the polyester widget style for Qt4/KDE4. Actually it was a pretty long time i didn’t touch that, but was too lazy to release the last state somewhere 🙂

Now i’m pretty happy with it, it seems to work pretty well, and is good, because i really don’t want to spend much time on it, it has a really high amount of hacks in it and i get bored quickly of things 🙂 however, how does it look? here it is:

Polyester 2

There will still be some updates for the time being, to correct most annoying bugs etc, btw 🙂

4.1 times more Prettyness

Graphics

Ladies and gentlemen, let me introduce you the brand new shiny Plasma theme that will be used for KDE 4.1:

Plasma theme for KDE 4.1

Here you can see the new applet and krunner backgrounds, the new panel, our brand-new carbon fiber clock and some items that once upon a time weren’t themed at all, like the pager and the taskbar.

This is the wonderful work of Nuno, i did some work in the code in the last month to make the theme support even more extensive, to have all your nice plasma widgets with more SVG prettiness, so let’s start thing by thing 🙂

  • The pager: the mini-desktops now have 3 different backgrounds, and when the mouse goes over the widget the mini desktops fades in and out with a neat animation

  • The panel: when composite is disabled his borders must be nice even if we don’t have antialiasing and when its width is the 100% of the screen it’s really a different beast, so a different svg it’s used, one different for each edge of the screen the panel can be

  • Dialogs and krunner: they have the same styleas the applets, but when composite is disabled we don’t have antialiasing for border, so it’s drawn in a nice retro-style

  • Taskbar: it now supports SVG backgrounds for several task states, there was some performance issues but we hope we will be able to enable the neat animations on mouse over also here 🙂

  • System tray: yeah even that now has a SVG background to make it look coherent with the other panel plasmoids like the taskbar (and the pager, if the size is enough)

  • The analog clock: KDE4 is all about analog clocks, right? 😛 so how could we neglect it? Absolutely not, so it now has cool drop shadows under each hand, that are always projected in the right position when the hands rotate

  • The folder view: due to its very nature it must have a more translucent background, to be easier on the eyes. Do you want to use that background on your applet? just call setBackgroundHints(TranslucentBackground) et voil

A simple way to test Plasma themes

Graphics

Some time ago when testing the code that draws the svg themes in Plasma (like applet backgrounds, panels and tooltips) i wrote a very simple plasmoid that its sole purpose was to test that code, its very uninspiring name was SvgPanelTest, because surprise surprise it was a test for the class named SvgPanel:P
It turns out this applet can be actually useful also for theme designers that wants to test the themes they’re doing without killing plasma all the times.

Since now there is a contest to make Plasma even more gorgeous, i’ve decided to publish it in an easily buildable source package, and i hope that it could somewhat help you (yes, YOU :P) to make a beautiful theme that will make vista and osx to look as they are coming straight from the 80’s (well even if it’s a very little help :D)

You can download it here (also a kde-look page here) or from KDE’s svn in /playground/plasma/applets/svgpaneltest

Some notes:

To build it a KDE4 developing environment is needed (see the techbase article)
at least KDE 4.0.2 is required, but a recent svn snapshot is preferred.

A plasma restart could be needed to see it listed among the plasmoids, or you can also start it with the command
plasmoidviewer svgpaneltest
or, with a very recent svn snapshot (from some minutes ago actually :P)
plasmoidviewer svgpaneltest /path/to/your/theme.svg

Crisp Plasma dialogs borders

Graphics

Since yesterday The border of plasma dialogs like the clock popups have got rounded borders also when the composite is disabled, just like tooltips before,ok not a big deal.
But what is changed is that before tooltips shape was an hardcoded rounded rectangle with a fixed shape and an also hardcoded white border and that kinda sucked…

A second problem connected to that was when compositing was active the windows only faked a non rectangular shape, but they still were stupid rectangles, so for instance you couldn’t click on a totally transparent area to make the popup go away.

Now the window shape is computed from the alpha channel of the background svg, it means now the windows have a shape similar to the one you would expect seeing the fancy transparent svg.

And it causes another problem if not well-managed, because if you use a fancy svg with cool antialiased borders, without composite you will get something awful like that (here zoomed 2x):

ugly borders

See that two black pixels on each edge? and if the radius is bigger the problem gets worse.
This because the semi-transparent pixels will become fully opaque. Fortunately the way Plasma::Theme works comes to rescue, because when compositing is not active it will load a different set of svgs when available (they are all the files in the “opaque” folder in the theme path), so for instance with tooltips when compositing is disabled it will load the following svg (here with an huge zoom):

good borders

Here you can see that the outer borders are made of big blocks that will be rendered with a size of exactly one pixel and will make the illusion of a perfectly round line, while the inner border is still round and antialiased.
So if you will make a sexy plasma theme don’t forget to provide an “opaque” version of the relevant svgs, that at the moment are widgets/tooltip.svg and dialogs/widget.svg (probably in the future there will be also krunner.svg).
these svgs must not have semi-transparent areas and they must have a pixelated border, There are some nice tutorials around on how to make a convincing pixel-based path, like this one.

What? very 90’s or eve 80’s you say? Eh, true, this is where the desktop without compositing comes from 😀