How make Skins?


06-12-2007 20:45:40

This is another question...i am a very noob... :oops:
well, i read in the wiki that i can make my own skin component like buttons, textnox background etc...simply editing the images and respecting the conventions in names (ex. qgui.button.png etc...).
But, in media of quick gui, there's a file named "SkinSet.qgui.png" that group all the components together...i have to do also this?if yes, how i can?


06-12-2007 22:18:03

I would outline this in the wiki, but the current method will change in the near future, at least that is what I would like to accomplish. :wink:

Right now, you can make your own skin, lets call it "artic".

So you would make a bunch of images that follow the naming conventions I have in place, but replacing "qgui" with "artic". When you want to use the Skin, you will make the following call:


I have made a restriction that all images be of the same type, for a given skin. This *limitation* is easily surpassed, because you can have as many skins as you want. For example, you could make an "artic_png", "artic_jpg", or whatever you want.

When loadSkin is called, it checks to see if a *.skinset file exists. If it doesn't, it will create one, as well as the SkinSet.artic.png file. In the future, you will probably use a SkinSet Editor to make the SkinSets, but for now, its done in the background by the SkinSet class.

To use the skin, you would call:


To put it simply, you shouldn't have to worry about the .skinset and Skinset.*.png files. Although I encourage you to look at them. The skinset file will outline the UV coordinates of the images, as they are shown in the generated png file.

Let me know if you have more questions.


06-12-2007 22:22:09

you have to create all the arts you need. When your are sure that you have everything for the gui created then you can delete all qgui.*.png files and the qgui.skinset file.
then run the app and i will create your own SkinSet.qgui.png file.

But a better way is to overright the qgui.*.png files which you have created by your self and let the other files untouched.

Then delete the SkinSet.qgui.png and the qgui.skinset and run your program.
this step might be unnecessary...

here is an example of my gui which is done by the steps above.


07-12-2007 11:05:03

Qbound, your gui is very cool!!!!!
did you make it with QuickGUI?

@kungfoomasta: thanks for the i understand how skins works.

But for "myWidged" what do you mean?a widget that i have created or is a variable like the mSkinSet (i don't rimember this is it's name...) of the Demo example?
If i have other questions or troubles i will tell you! :D


07-12-2007 17:49:36

QuickGUI::Button* myButton = defaultSheet->createButton();

It's just any widget that you have created, they all support the "setSkin" function.


07-12-2007 20:27:10

ok. but for example, if i call the setSkin()for the button, i have to make all the states images (button,button.over,button.down,button.disabled)?


07-12-2007 21:01:32

yep. You need to have the skinset loaded, which refers to the Skinset.*.png and *.skinset files, which are created from the various png images. I believe a blank image will result, if the image does not exist. If the skin does not exist, an exception is thrown. So for example, if you didn't make a *.disabled.png image, and you disabled your button, it would not be visible.


09-12-2007 00:02:03

thank you :D and yes it is made with quickgui and the auto function for creating the atlas texture... very usefull and absolut easy to use... :)