Game Development Reference
In-Depth Information
Classified intel
In this section, we applied the UI graphics to
GUISkin
. You might have a question
here—how does it work? Here, we will go through the basic concept of how to create a
custom UI in Photoshop and get the right texture to use in our
GUISkin
.
First, let's take a look at the
myWindow.png
in our
MenuInRPGGame/Resources/UI
folder. If we select this file, we will see something similar to the following capsule-shaped
image. You might be curious—how are we going to create a window graphics with this
capsule shape? Well, the trick is the properties of
Border
in which we can set the paramet-
ers,
Left
,
Right
,
Top
, and
Bottom
. It uses these parameters to set the number of pixels that
will be shown in the fixed image. On the other hand, the pixels in the middle will get re-
peated depending on the width and height of the settings similar to the
HTML
style or
scale9grid
in Flash (the concept is to draw the pixel perfectly on the four corners and then
repeat them in the middle to match the size we need).
The following figure shows us how the Unity
GUIStyle
works:
