Game Development Reference
In-Depth Information
5.
Name
is basically the name of this style, which the box is the default style of the
GUI.Box. Next, we will start by seing our custom UI to this GUI Skin; click on
the arrow in front of
Normal
to bring up the drop-down, and you will see two
parameters
Background
and
Text Color
.
6. Click on the circle icon at the right of the
Background
line to bring up the
Select
Texture2D
window and choose the
boxNormal.png
texture, or you can drag
the
boxNormal.png
texture from our
Chapter2/UI
folder and drop it to the
Background
space.
We can also use the search bar to find our texture by going to
the
Project
view and typing
boxNormal
in the search bar, as
shown in the following screenshot:
7. Then under the
Text Color
line, we leave the color as the default color—because
we will not have any text shown in this style—and repeat the previous step with
On
Normal
by using the
boxNormal.png
texture.
8. Next, click on the arrow in front of
Hover
under the
Background
. Choose
boxActive.png
texture, and repeat this step for
Active
and
On Active
.
9. Then, go to each property in the
Box
style and set the following:
Border
:
Left: 14
,
Right: 14
,
Top: 14
,
Bottom: 14
Padding
:
Left: 6
,
Right: 6
,
Top: 6
,
Bottom: 6
For the other properies in this style, we will leave them as default.
10. Next, we go to the following properies in
GUISkin inspector
and set them
as follows:
Label
Normal
|
Text Color
:
R: 27
,
G: 95
,
B: 104
,
A: 255
Window
Normal
|
Background
:
myWindow.png
On Normal
|
Background
:
myWindow.png
Border
:
Left: 27
,
Right: 27
,
Top: 55
,
Bottom: 96
Padding
:
Left: 30
,
Right: 30
,
Top: 60
,
Bottom: 30