wxSkin - first preview

Do you like to promote your wxWidgets based application or component!? Post it here and let's see what the critics have to say. Also, if you found that ONE wx component the world needs to know about, put it here for future reference.
Post Reply
upCASE
Site Admin
Site Admin
Posts: 3176
Joined: Mon Aug 30, 2004 6:55 am
Location: Germany, Cologne

wxSkin - first preview

Post by upCASE » Fri Oct 06, 2006 2:10 pm

Hi all!

Because of a recent discussion about wxWidgets and the ability to "skin" applications I reviewed one of my everlasting projects called wxSkin.

wxSkin is a set of controls that use images to "skin" them. Apart from creating each control and pass it a skin image, wxSkin features a central class called wxSkinEngine that automates most of the skinning by using a simple XML file as a skin definition and is able to load these files either from disk or out of a zip archive. wxSkinEngine parses these files and is able to assign skins to specific windows. Thus loading a different skin during runtime is possible and does not require to reload the application.

wxSkin has two basic top level windows.
wxSkinSimpleFrame is a frame that uses only one image for skinning. It can't be sized in a good way.
wxSkinFrame uses 4 borders, 4 window edges and a body to create the whole GUI. These frames can be sized.
Both frame classes offer support for working with sizers that can be added to special "client" areas.

Apart from these frame classes Buttons, Checkboxes, Gauges and Radiobuttons are implemented. What's still missing are sliders and some transparent static text controls, as well as some "convenience" controls like toggle buttons.

There still is work to do. Currently wxSkin controls only have two states, hovering and disabled states will be added soon. In addition to that the code needs some cleanup and a documentation needs to be written. The GTK port works to some extent, but there are minor issues with that.

Anyway, I decided to give you all a small glimpse of what skinning with wxWidgets might look like once I finished this. I created a small example application to demonstrate wxSkin. Guess what: It's a media player :)

Currently only two skins exist, both are modified skin from VLC to match wxSkins format. Credit for these skins go to the original authors.

Example skin 1:
Image
Example skin 2:
Image
Both skins use PNG files, but all formats wxWidgets is able to handle are supported.

If you want to try this example app for yourself you may download it here:
http://www.upcase.de/stuff/wxSkin_example.zip
Note: This is a Windows binary only version! It uses wxMediaCtrl with Directshow. It comes with both skins and can change the skins during runtime by pressing a button (you'll find out which one :) Hint: It has something to do with "settings").

To see what the skin files look like, simply open the archives. I could have created a folde structure inside the archives, but I was to lazy :)
I added some comments in the skin files.

If you're curious how wxSkin works in the applications, here's some example code:

Code: Select all

    //Get the skin engine, the master of process
	//load a skin file
	//a skin file is either a valid xml file
	//or a zip archive. archives may contain a folder structure for subgrouping elements
	wxSkinEngine::Get()->Load("skin.zip",true);

	//create a "simple" frame
	//a simple frame only uses one image as a skin
	//there are also "complex" frame that have 4 borders, 4 window edges and a body
	frame = new wxSkinSimpleFrame(NULL,-1,wxSkinEngine::Get()->GetSkinName());
	media = new wxMediaCtrl(frame,-1,"",wxDefaultPosition,wxDefaultSize,0,wxMEDIABACKEND_DIRECTSHOW );

	//create some buttons and a checkbox
	wxSkinButton* btnOpen = new wxSkinButton(frame,ID_OPEN);
	wxSkinButton* btnNext = new wxSkinButton(frame,ID_NEXT);
	wxSkinButton* btnPrev = new wxSkinButton(frame,ID_PREV);
	wxSkinButton* btnStop = new wxSkinButton(frame,ID_STOP);
	wxSkinButton* btnPlay = new wxSkinButton(frame,ID_PLAY);
	wxSkinButton* btnSup = new wxSkinButton(frame,ID_SUP);
	wxSkinButton* btnSdown = new wxSkinButton(frame,ID_SDOWN);
	wxSkinButton* btnPlist = new wxSkinButton(frame,ID_PLIST);
	wxSkinButton* btnPrefs = new wxSkinButton(frame,ID_PREFS);

	wxSkinCheckBox* chkMute = new wxSkinCheckBox(frame,ID_MUTE);

	//assigne the elements to skin with names used as identifiers in the skin file
	wxSkinEngine::Get()->AssignWindow("PlayerFrame",frame);
	wxSkinEngine::Get()->AssignWindow("button_open",btnOpen);
	wxSkinEngine::Get()->AssignWindow("button_next",btnNext);
	wxSkinEngine::Get()->AssignWindow("button_prev",btnPrev);
	wxSkinEngine::Get()->AssignWindow("button_stop",btnStop);
	wxSkinEngine::Get()->AssignWindow("button_play",btnPlay);
	wxSkinEngine::Get()->AssignWindow("button_speedup",btnSup);
	wxSkinEngine::Get()->AssignWindow("button_speeddown",btnSdown);
	wxSkinEngine::Get()->AssignWindow("button_playlist",btnPlist);
	wxSkinEngine::Get()->AssignWindow("button_prefs",btnPrefs);
	wxSkinEngine::Get()->AssignWindow("mute",chkMute);

	//initialize the skin
	wxSkinEngine::Get()->InitializeSkin();

	//add the wxMediaCtrl in a sizer that will be handled "special" when added to a skinned frame
	wxBoxSizer* b = new wxBoxSizer(wxVERTICAL);
	b->Add(media,1,wxEXPAND,0);
	frame->SetSizer(b);

	frame->Show();
When loading a new skin, all it does is

Code: Select all

    wxSkinEngine::Get()->ClearSkin();
	wxSkinEngine::Get()->Load(skinfile,true);
	wxSkinEngine::Get()->InitializeSkin();
That's it.

I'll work some more on this and maybe create an example showing a "real", meaning complex, frame. But for now I guess this is enough eye-candy :)

I hope you like it and think that it is a good idea. Comments and suggestions are welcome, flaming and emails like "gimme da source" are not. I will release wxSkin once I'm done or decide to make it public. Right now I want some more time to develop it further.
OS: OpenSuSE, Ubuntu, Win XP Pro
wx: svn
Compiler: gcc 4.5.1, VC 2008, eVC 4

"If it was hard to write it should be hard to read..." - the unknown coder
"Try not! Do. Or do not. There is no try." - Yoda

stevelam
Earned some good credits
Earned some good credits
Posts: 114
Joined: Fri Apr 14, 2006 11:01 am

Post by stevelam » Fri Oct 06, 2006 6:37 pm

Well I have tried out the samples and looked through the code and I think that this is an excellent project. I really think that this is the way forwards regarding skinning for wxWidgets (even if it is in a platform limited way) and I am looking forward to see how the project progresses!

buildere
Super wx Problem Solver
Super wx Problem Solver
Posts: 358
Joined: Thu Oct 28, 2004 3:45 pm
Location: Costa Rica

Post by buildere » Mon Oct 09, 2006 4:29 pm

Very nice job upCASE!

I guess this will work on every platform, .... ?

User avatar
Ryan Norton
Moderator
Moderator
Posts: 1319
Joined: Mon Aug 30, 2004 6:01 pm

Post by Ryan Norton » Tue Oct 10, 2006 12:32 am

Wow! Amazing work - it really works, even in Vista :D!

The see-through part of the first example skin is neat as well!
[Mostly retired moderator, still check in to clean up some stuff]

Jorg
Moderator
Moderator
Posts: 3971
Joined: Fri Aug 27, 2004 9:38 pm
Location: Delft, Netherlands
Contact:

Post by Jorg » Tue Oct 10, 2006 7:02 am

Very impressive! I am glad you decided to go on with it, it is a very valuable contribution to wxWidgets .. I think you should also announce this on the mailing list. If you wish I can post an announcement there, and provide a link to the forum here ..

- Jorgen
Forensic Software Engineer
Netherlands Forensic Insitute
http://english.forensischinstituut.nl/
-------------------------------------
Jorg's WasteBucket
http://www.xs4all.nl/~jorgb/wb

upCASE
Site Admin
Site Admin
Posts: 3176
Joined: Mon Aug 30, 2004 6:55 am
Location: Germany, Cologne

Post by upCASE » Tue Oct 10, 2006 7:41 am

Hi!
Thanks for the flowers :)
Jorg wrote:I think you should also announce this on the mailing list. If you wish I can post an announcement there, and provide a link to the forum here
Thanks Jorg, but please wait some more before posting. As you know I do have some mixed feelings about wxSkin and its acceptance, so I want to make sure that it is in a "usable" state. Some documentation and a proper example needs to be written. And there are still some parts missing which I think need to be implemented. Apart from that I'll need to skip to using CMake or bakefiles... Oh,yes, the website really needs anm update as it still features the "old" version. Once I'm done I'd be happy if you could announce it for me. I'll drop you a line.
buildere wrote:I guess this will work on every platform, .... ?
My major dev-platform is Windows, but I tested this on GTK as well. In general it works, but there are some parts I need to fix. With a little bit of luck I'll get access to a Mac and try it there. However, the general idea is to have this cross-platform, yes. There may be things that won't work on every platform, like opacity which I'd like to add, but I can't be sure unless I tried :)

Anyway, thanks for the positive response. This project dates back about 2 years now and I'm happy that now that I revamped it, it finally seems to get some acceptance.
OS: OpenSuSE, Ubuntu, Win XP Pro
wx: svn
Compiler: gcc 4.5.1, VC 2008, eVC 4

"If it was hard to write it should be hard to read..." - the unknown coder
"Try not! Do. Or do not. There is no try." - Yoda

K39
In need of some credit
In need of some credit
Posts: 4
Joined: Tue Sep 05, 2006 11:42 pm

Post by K39 » Tue Oct 10, 2006 8:14 pm

Cool! I just tested it on w2k, and aside some flicker issues it works well, i would certainly have a use for this, specially if it is cross-platform.

keep it up!

upCASE
Site Admin
Site Admin
Posts: 3176
Joined: Mon Aug 30, 2004 6:55 am
Location: Germany, Cologne

Post by upCASE » Fri Oct 13, 2006 11:56 am

Hi guys and gals!

I thought I could give you another updated preview of wxSkin just before the weekend :)

I iimplemented some of the sutff I wanted to have before a release. Controls can now have four states: normal, over, pressed/checked, disabled.
In addition I added radiobuttons, a slider control, a progressbar, a panel with a background skin and a transparent static text control with optional image. Choosing skins is now a bit more simple as I added a "skin chooser". This will change skins during runtime when double clicking a skin in the chooser.

I had another go on GTK and finally got it working. There are some minor issue with getting sizers to work correctly. Apart from that it behaves just fine. I wanted to post some screens on GTK, but unfortunatly my Virtual PC install just f*** up.

Anyway: You can donwload a new sample at http://www.upcase.de/stuff/wxSkin_example.zip
It's still a simple media player, but a better working one than last time. To choose skins simply hit the "prefs" button.

I hope you like the new sample. Please tell me what you think and what you think is missing.

Jorg: I thought about integrating optional support for GUIBuilder within skin files, so that the layout inside the skins "sizer-able" area could be layouted as well. Would you mind if I included GUIBuilder with wxSkin?
OS: OpenSuSE, Ubuntu, Win XP Pro
wx: svn
Compiler: gcc 4.5.1, VC 2008, eVC 4

"If it was hard to write it should be hard to read..." - the unknown coder
"Try not! Do. Or do not. There is no try." - Yoda

Jorg
Moderator
Moderator
Posts: 3971
Joined: Fri Aug 27, 2004 9:38 pm
Location: Delft, Netherlands
Contact:

Post by Jorg » Fri Oct 13, 2006 12:16 pm

Hi upCASE,

Not at all! Go ahead! I do not have much of a dev-env here on my download PC (that's all it does actually) so when I can I will take a look ..

ps. If there are patches for wxGuiBuilder that I need to apply for your wxSkin to work, let me know..

Have a nice weekend!
- Jorgen
Forensic Software Engineer
Netherlands Forensic Insitute
http://english.forensischinstituut.nl/
-------------------------------------
Jorg's WasteBucket
http://www.xs4all.nl/~jorgb/wb

upCASE
Site Admin
Site Admin
Posts: 3176
Joined: Mon Aug 30, 2004 6:55 am
Location: Germany, Cologne

Post by upCASE » Fri Oct 13, 2006 2:45 pm

Jorg wrote:ps. If there are patches for wxGuiBuilder that I need to apply for your wxSkin to work, let me know..
Great!
I'm not really sure how I will implement that, but I thought that this might be a good idea. I guess there would be no patches I'd need, but let me finish the other stuff first and then I'll concentrate on GUI builder.
Jorg wrote:Have a nice weekend!
You too!
OS: OpenSuSE, Ubuntu, Win XP Pro
wx: svn
Compiler: gcc 4.5.1, VC 2008, eVC 4

"If it was hard to write it should be hard to read..." - the unknown coder
"Try not! Do. Or do not. There is no try." - Yoda

Post Reply