To design your own skins you can do it in two ways, starting from a skin file and to modify it, or directly to create a new one.
A skin file has the following look:
You can copy this image and modify it respecting the dimensions and position of the buttons and the parts corresponding to the title bar and body.
You can give the look you wish to the buttons, you also could give the shape to the edges, since there is a color that will be transparent.
In following illustrations you will see a description of the parts that compose the image and are used to define the skin:
1: left side of the title bar, it is the top left corner of the form.
2: middle section of the title bar, this image stretches according to the length of the form, transparency is not allowed in this part.
3: right side of the title bar, it is the top right corner of the form.
4: color box that define the text color in the title bar.
5: color box that define the text color in the body of the form, which corresponds to the change that vbSkinner makes automatically to the ForeColor properties of the controls, as long as the ChangeControlsForeColor property value is set to True.
6: color box that define the color that will be considered transparent. To have a transparent color is useful to give a roundness to the corners of the form. Transparency is only valid in sections 1,3,8,10,13 y 15; all the other sections do not allow transparency.
7: color box that define the body color of the form, corresponding to the change that takes place in the BackColor property of the same one.
8: top left section of a form when it doesn't display the title bar. This happens when the BorderStyle property is set to 0 or when the properties ControlBox is False and Caption = ""
9: Top middle section of the form when it doesn't display the title bar.
10: Top right corner of the form when it doesn't display the title bar.
11: left side of the form.
12: right side of the form.
13: bottom left corner of the form, it allows transparency color.
14: bottom middle section of the form.
15: bottom right corner of the form, it allows transparency color.
a: close button
b: close button pressed
c: close button disabled
d: restore button
e: restore button pressed
f: restore button disabled
g: maximize button
h: maximize button pressed
i: maximize button disabled
j: minimize button
k: minimize button pressed
l: minimize button disabled
m: minimize to title bar button
n: minimize to title bar button pressed
o: minimize to title bar button disabled
p: restore from title bar button
q: restore from title bar button pressed
r: always on top button
s: always on top button pressed
t: change skin button
u: change skin button pressed
v: custom button
w: custom button pressed
x: help button
y: help button pressed
As you can see, due to the operation there are some buttons that do not need a disable picture, since this state never takes place.
The skin image is a bitmap of 207 pixel with by 52 pixel height. The size of the parts that compose it are as follows:
Sections 1, 2 y 3 corresponding to the title bar: 18 width by 30 height.
Sections 8,12,13 y 15 corresponding to the form corners: 14 width by 14 height.
Sections 11 y 12 corresponding to the sides of the form body: 9 width by 19 height.
Sections 9 y 14 corresponding to the from top and bottom sides: 19 width by 9 height, always in pixels.
The square corresponding to the buttons are 13 pixel width by 13 height.
Also the positions must be respected, since vbSkinner reads every part from the image and it have to find in the right position for every one, and so the size.
You can work in the skin files with an image editor, and then include them into the setup file of your project for making it available to the user, and to tell the user that he could design his own ones like he likes.
Read the related topic: Changing skin
|See also:||Changing skin|