View Full Version : Skinned Windows (own TitleBar and Borders)

26th June 2007, 06:37
This two little classes let you use own windowframes and titlebars.
the windows which are created with this class can be resized and moved like normal windows
and have three buttons on top. For an own skin you will need 9 pixmaps:
-> left border(sl), left-bottom corner(elu), right-bottom corner(eru), right border(sr),
titlebar(so), bottom corner(su)
-> maximize (maxButton), minimize(minButton), close(quiButton)
if you want to skin your application just set QSkinWidget as Parent. if you want to skin a MainWindow use something like this:

QSkinMainWindow *wid = new QStyleMainWindow();

MainWindow mainWindow;
wid->setCentralWidget (&mainWindow);

enjoy working with this classes, even its somekind of "murx".
please let me know if you find better ways to realyze things i did in the classes and use them only for opensource-software.
i hope i will get some feedback!;)
P.S. Sorry for my bad english and no comments, i will type them as far as i can...

26th June 2007, 09:31
i've added resizing on every side an on the edges.

27th June 2007, 06:14
Now i've optimized the drawing of the Frame-Pixmaps and the resizing of the windows.

30th June 2007, 09:56
Ok. I wonder that nobody shoutet at me, because the classes didn't work on linux...
but now they should work on all platforms.
Please some feedback...

30th June 2007, 10:35
but now they should work on all platforms.
Really? Well I got a few comments :

Packaging is *REAL* bad... put all three (lib, test and config) in a single package
Why do you feel the need to put the lib in a subfolder of its sources instead of in a subfolder of top dir?
there are unneeded files in test : makefile, lib bin and headers... use LIBS += -L.. (or -L../QSkinWindows/lib if you keep your current layout) and INCLUDEPATH += ../QSkinWindows
there is a convention to use lower case filenames to avoid errors under UNIX systems which are case-sensitive...
The test program crashes... It says "Floating point exception"
I've not seen any pixmaps anywhere... How do you style the test program?I guess that's all for now...

30th June 2007, 11:18
ok... now it should be better.

30th June 2007, 11:49
I do not understand... what are you "distributing"? The zip does not contain a mainlevel project file, and the project file available on the SkinConfig does not compile.

Did you test the release? What do you expect me to do with it?

30th June 2007, 12:01
yes i tested it. download the newest version (tar.bz2 file). it works. with this "distribution" which is a class for adding own titlebars and borders to your application.

30th June 2007, 13:20
Just wanted to tell you that it compiles and works pretty good. Thanks.

Whats the license of this work? Can I use it on non GPL applications?

30th June 2007, 13:48
no you can't.only for open source software, please.

30th June 2007, 15:48
The new package compiles well and looks pretty good. however the handling of mouse events (to click on buttons) doesn't seem to work well : I got warnings about QWidget::grabMouse(), the buttons are not animated and whatever the one clicked the applications gets closed... Am I missing something?

1st July 2007, 07:44
i dont know:confused:. on my system everything wotks well, try this test-code for buttons:

#include <QtGui>
#include "../QSkinWindows/QSkinWidget.h"
#include "../QSkinWindows/QSkinMainWindow.h"
int main(int argc, char* argv[])

QApplication a(argc, argv);
QSkinWidget *wid = new QSkinWidget();
QHBoxLayout *g = new QHBoxLayout();
QPushButton* pb = new QPushButton("test", wid);

QSkinMainWindow *mw = new QSkinMainWindow();
QWidget centralWidget;
QHBoxLayout *g2 = new QHBoxLayout();
QPushButton* pb2 = new QPushButton("test", &centralWidget);

return a.exec();

the application should only close if you click on the "X"-Button. and i don't us grabMouse... could you post a snippet of your code or are you using my test-application?

1st July 2007, 11:00
are you using my test-application?
Sure! I can afford testing something but not writing an app to test it... See I'm rather busy ATM. ;)

11th August 2007, 12:33
hey, back with something great:
The skin-classes with argb support on windows. no faking, and no cpu overhead.
atm the classes are ONLY FOR WINDOWS, for linux use the old ones, i will fix this and add argb support for linux, too.
have fun.

15th August 2007, 10:53
all happy with this? nothing i could make better?
if there are any people who are great in designing could make same skins. that would be great.

27th September 2007, 19:24
Excellent idea! Congratulations!

This comes to prove that you don´t need vista OS to make well finished windows, Qt on windows 2000 is plenty enough. :)

Now that it is implemented i have a few ideas...

************************************************** *********
Why do you include <window.h> when there is an implemented <qt_windows.h> for those functions?

see this example from russia:
link: http://www.opennet.ru/docs/RUS/qt3_prog/c7922.html

#define _WIN32_WINNT 0x0501

#include <qapplication.h>
#include <qt_windows.h> // <----- ********** here**********

int main(int argc, char *argv[])
QApplication app(argc, argv);
QLabel *label = new QLabel("Hello Qt!", 0);

int exstyle = GetWindowLong(label->winId(), GWL_EXSTYLE);
exstyle |= WS_EX_LAYERED;
SetWindowLong(label->winId(), GWL_EXSTYLE, exstyle);
SetLayeredWindowAttributes(label->winId(), 0, 128,

return app.exec();

isn´t it better to use qt_windows header? or more compatible maybe......

i think the behavior of the skinned windows can be improved.

the problem with resizing is the following:

the mouse switches to resize mode far from the apparent window border right at the end of the surrounding shadow which makes difficult to resize it.

i think that the resizing could be bette is instead of this, resizing mouse icon could appear in the thin white border around the cyan dialog, or at least ther should be a value to extend the resizing area some pixels more inside the frame.

in my opinion picking on the outside outer shadow limit for resizing is not the better behavior.

the white border with rounded corners is very nice and there should be some way of making it thicker so it can be used for resizing.
************************************************** ******
also the mouse is switching only to vertical and horizontal icons for resizing, when it´s pointed to a corner, it doesn´t properly switch to diagonal resizing icons.

as an example i made a graphical explanation
the attachment shows the skinned windows against a sample notepad/windows background

27th September 2007, 22:22
i just came with an idea for a theme with thicker borders and no shadow, tell me what you think.

perhaps a complex task is simulating 3d border frames, the only way i have achieved this was using predefined png bitmaps inserting them in the style of a button but those are usefull for rounded rectangle shapes only.

see attached

i´ve just noticed that in the skinned (close, minimize, maximize) window the buttons are not real QButton objetcs.

they are pixmaps, so they don´t have the same behavior of a button. (change appearance when clicked).

is it possible to replace those pixmaps with real QButton widgets to add basic button behavior to them? ( i suppose it´s possible because you´re operating inside an invisible frame widget)

is it possible to create an example that uses a custom made form with form designer?

how can i pick up an *.ui file and merge it with the skinned window?

the starting point could be assuming in form designer thet it would have no parent frame.

i think it could start with a qframe transparent object.

then, inside this qframe there would be two frames, one for the title bar and its buttons (necessary because this ui form would be set with a framelesswindowhint atribute) and a content frame under the titlebar.

see this interesting example on how to remove windows titebar and using your own custom made titlebar widget in qt. (it basicaly does the aproach mentioned above)

"How can I handle events in the titlebar and change its color etc ?"

(this example uses real qbutton objects for the titlebar)

best regards

28th September 2007, 04:07
ok, here it goes :)

i´ve just created a test form UI with title bar.

How can i use this linked to the skin lib? (making the yellow to pink gradient transparent)

see attached
(to load correctly the zip files should be created in c:\customform folder)
(strange bug loading styles)

************************************************** **************

just noticed another inprovement.

when the maximize button is clicked the application doesn´t really maximizes to the fullest.

IMO when maximizing the window should have the shadow removed so it can maximize just on the limit of the thin white border with rounded corners.

************************************************** **************

one of the few examples in qt is the shaped clock example.

in this example qt presents one of it´s weak points, because when it deals with masks, those masks are black and white only. (no alpha mask with the setmask command)

this results in god finishing inside the application but bad finishing with applications that are different than the "typical" rectangle.

is it possible to make an example using the lib for the shapedclock where the outer border is antialiased? or maybe even better... showing just the tick marks and the pointers without the grey background.

see image attached

28th September 2007, 06:48
1. the problem with resizing is because of the shadow. if you don't have any shadow you can even resize at the corners.
2. you can use all skins you want to they only have to be applied in the skin.dat file.
3.i don't want to use real buttons, because the user of the class shouldn't have access to them only through the skin.dat file. But the problem with no hover and press actions i will fix.
4. For picking up a ui File handle it like in normal Widgets. Sublcass QSkinWidget and subclass from your Form :

class MyWidget : public QSkinWidget, public Ui::myForm
5.I think you don't need a designer plugin. You just have to Subclass your form from QSkinWidget instead of QWidget and the skin is applied. wherefore a designer plugin?
6.maximize is the sam problem with shadow.
7. For the shaped clock try my Argb-Widget in the Wiki. The skin classes are only for real applications that should have borders.

PS: pls send me emails^^ it's pain to read all this in the forum....

Master Loda
10th July 2011, 23:33
its Good project
but Is there a solution with Maximize Application
The Application Hide The Task Bar ( I dont see The Task Bar )
Look Img
Excuse my English is bad :crying:



16th July 2011, 11:42
From what I've read I guess you'll have to implement it yourself using the QScreen framework to workout how big it should become once maximized to not overlap the taskbar. But im curious if it's possible to have Windows 7s snap into grid functionality working with a custom window-frame? Does anyone know if this can be implemented?

17th July 2011, 00:15
Master Load,

I implemented a window today with maximizing capabilities with the borderless-flag set (so from scratch). What you have to do is retriving the availableGeometry rect from the QDesktopWidget class.

QRect availableGeometry = qApp->desktop()->availableGeometry(mainWindow);

This will give you the geometry of the available screen area (minus the taskbar).

Then you could do something like this to maximize and move the window to the correct location:

mainWindow->setMaximumSize(availableGeometry.width(), availableGeometry.height());
mainWindow->move(availableGeometry.x(), availableGeometry.y());

On top of that I used QSettings to remember the nonmaximized state so that I could recover it later when the window is minimized.

Hope this helps :)