Game Development Reference
In-Depth Information
Orthographic Size
If you are a 2D purist, you already know that the sprites will be “pixel perfect” only at certain screen
resolutions. If the screen size varies from the optimal size, the sprites will be drawn to fit the size and
may not scale cleanly. In a fully 2D game, this can be an important issue, especially if the 2D assets
are small. For HUD elements, it is probably not as crucial, but it's worth covering.
The orthographic size denotes how many [2D] world units are contained in the top
half
of the camera
projection. For example, with an orthographic size of 5, the vertical extents of the viewport will
contain 10 units of world space. The horizontal size is dictated by the aspect ratio.
1.
Select the Battery asset in the Project view.
2.
In the Inspector, locate the “Pixels to Units” value.
It tells you that 100 pixels equal 1 unit. With an orthographic Size of 5, you could stack ten 100-pixel-high
sprites vertically in the viewport and they would be displayed at their native size. As long as the sprites
or the orthographic size are increased in multiples of 2, the sprites should retain a clean appearance.
It is essential to make sure that all of your sprites are the same scale or at least in multiples of 2 so they
can be sized in the game using the orthographic size. For a more in-depth discussion on this topic,
His article was written before Unity revamped its 2D features, but it remains a valuable source of
2D information.
The remainder of the sprites created for this game are meant to be used with the default 5
orthographic size, so let's get that locked in and adjust the battery size accordingly.
3.
Select the Camera GUI, and set the Size to
5
.
While you are scripting the energy bar's animation, it will be useful to have it display larger.
4.
Select both battery sprites in the Hierarchy view, and set their X and Y
Scale to
2
.
5.
Move the battery sprites to the top left. Don't worry about the text.
6.
Set Battery_1's Color to a fully saturated green.
At this point, you should make an executive decision about where the text should be rendered. With
the Camera GUI rendering the text, the text is rendered on top of the sprites. If you wanted it behind
the sprites, you would have to turn on the Main Camera's GUILayer and remove the text from the
Sprite layer.Let's continue with the battery setup.
1.
Select the Battery Life object.
2.
Set its X Position transform to
0.02
and its Y Position transform to
0.71
.
3.
Set its Text parameter to “
00%
” and its Font Size to
24.
4.
Move the battery sprites above it.
With the battery in place, you can go ahead and script the functionality.
5.
Open the BatteryHealth script.