Heinitz-it. Shape widgets with Qt

Download demo project - 32 Kb
Download demo project for Qt4 - 32 Kb
Qt-4 porting is kindly provided by Falko Buttler (fbuttler[At]web(Dot)de)

ShapeWidgets in action

Introduction

Qt doesn't provide classes for widgets with not rectangular shape. If the design of your GUI needs more than standard forms of Qt, you have to paint the shape of the graphic elements, place the picture on a Qt widget and place transparency bitmask upon the widget.
Unfortunatelly Qt (3.2) doesn't provide an easy and efficient method for creating transparency mask for a pixmap. There is only QImage::createHeuristicMask(). Which is rather slow. Besides, it creates the transparency only in surrounding but not in the inner areas.

I changed a little bit this method. You can specify, which color should be transparent, or by default the transparent color will be taken from the position 0x0 (left:upper pixel).
For easy usage of non rectangular widgets I wrote 3 klasses ShapeWidget, ShapeButton and ShapeForm. The code shows a constructor of my sample mp3-player application.

MP3::MP3( QWidget *p, const QString &iname ): ShapeForm( p, iname),
    _bplay(this, "img/mp3_butplay.png"),
    _bforw(this, "img/mp3_butfw.png"),
    _bbackw(this, "img/mp3_butbw.png"),
    _bclose(this, "img/mp3_butclose.png")
    {
     //set geometry of all members
    }

that's all! The buttons _bplay, _bforw,... are created with the picture name as parameter. This pictures shape the form of the buttons.

Using the code

Create a ShapeWidget with an image. Usefull, if Images are embedded in code (e.g as xpm)

ShapeWidget(QWidget *, const QImage  &, long=-1);

Create a ShapeWidget with an image name as parameter. Usefull, if loading images from files.

ShapeWidget(QWidget *, const QString &, long=-1);

Set or reset the shape of ShapeWidget.

void setShape( const QImage  &, long =-1);
void setShape( const QString &, long =-1);

Static. Set or reset the shape of any QWidget.

void setWidgetShape( QWidget *, const QString &, long =-1);
static void setWidgetShape( QWidget *, const QImage  &, long =-1);

The class ShapeForm is for using as QApplication's main widget. It can be moved by mouse if mouse button is pressed and moved.
The class ShapeButton have additional methods for defining button shape in pressed state.

void setPressedShape( const QImage  &, long =-1);
void setPressedShape( const QString &, long =-1);

Beyond, the button sends the signal clicked with an int-parameter for easier event dispatching.

History

The original project was: http://www.heinitz-it.de/projects/fancy_but/index.html
As Alexander Atamas from codeskipper.com offered me to write an article for codeskipper.com about it, I made the code user friendlier through ShapeWidget - "library".
There is a very similar article "A Skinnable Qt Application" on codeskipper.com.