Advanced theme options

Reverse Gradient Bevels

Both options here refer to the border and highlight drawn around resizable widgets. The first option is for reverse gradient bevels. Usually when you specify a highlight it causes KDE to draw a shaded bevel around the widget. You can also have it draw a reverse gradient instead. This gives a more sophisticated look. You configure reverse gradient widgets the same as normal gradient ones, except you use the value "ReverseBevel" for the Gradient key. You also have an additional key you can use called "BevelContrast". This is an integer value gets specifies how much to dim (subtract from each RGB component) the high color and how much to brighten (add to each RGB component) the bevel. This creates a contrast from the widget's primary gradient. Here is an example:
[PushButton]
Background=190,190,190
Foreground=0,0,0
Gradient=ReverseBevel
GradientLow=230,230,230
GradientHigh=150,150,150
BevelContrast=20
Highlight=2
[PushButtonDown]
Background=190,190,190
Foreground=0,0,0
Gradient=ReverseBevel
GradientHigh=230,230,230
GradientLow=150,150,150
BevelContrast=20
Highlight=2
[KDE]
widgetStyle=basicstyle.la

This creates PushButtons that look like:

Some things to take note of is that with reverse bevels usually you will use the darker color for the gradient high color and the lighter one for the low color, then reverse them when pressed. This is the opposite of what usually happens. Also, remember that the bevel contrast is a integer value that is subtracted from the low color and added to the high color for each RGB component. Since the size of one component is one byte, the result must not be lower than 0 or exceed 255 for any of the RGB gradient entries. Thus you cannot specify a gradient high color of 230,230,230 and a bevel contrast of 50 because 230+50 > 255.

Pixmapped Borders

Important: I had this feature disabled prior to the Krash KDE alpha release. Everything described here works and has been re-enabled, but it is being significantly extended to support even more radical masking options. In order to use this feature you need to use a post-Krash KDE snapshot such as those available at www.mosfet.org. The same of course applies to users of your theme. Otherwise the border will be a default black rectangle.

When implementing pixmapped borders I decided that just being able to set a pixmap for the highlight's dark and light shade is not enough. You need to be able to draw custom images for each of the sides, as well as the corners. This could of been done in two ways, either making you specify 8 pixmaps - or having one pixmap that KDE can automatically break up into the sides and corners. I decided on the latter.

In order to do this, you can just draw a pixmap with your border on the edges. Then you specify how big the border is. For example, lets take this pixmap:

It has a border of 5 pixels on all sides. Thus we would tell KDE that and it should break up the pixmap like this when tiling it for resizable widgets:

The white space in the middle is discarded. In order to use this pixmap for a border you specify the border pixmap with the PixmapBorder key and the border width with the PixmapBWidth key. So to use the above pixmap (named appropriately border.png) I would do the following:


[PushButton]
Background=190,190,190
Foreground=0,0,0
Gradient=Vertical
GradientHigh=230,230,230
GradientLow=150,150,150
PixmapBorder=border.png
PixmapBWidth=5
[KDE]
widgetStyle=basicstyle.la

Which produces buttons like the following:

Note that you can use all the same pixmap and gradient options for the button itself that you normally have access to. To make how things are separated even more clear lets use an even uglier pixmap:

Now it should be very evident how KDE handles the pixmap ;-)

Pixmap Borders And Masks

You can use masks with pixmap borders in order to define transparent parts of the mask. The inside of the widget background will then show through the border. For a very simple example, if I use the pixmap:

where the blue color is an alpha mask it will produce the following border:

Not a pretty example, but you can easily see how the transparent parts in the middle of each side show up. Note that this mask does not control the widget *shape*, just what parts of the border are transparent. For that look at the "Future" section.

<< Previous Page | Next Page >>

Mail Mosfet