Day 21 | Ease of Building UI Elements in Unity

Ted Lim
3 min readApr 17, 2021

Unity makes it easy to build quick boilerplate UI elements by providing its own UI primitives. In this article, we’ll cover some of the UI elements that Unity offers, and we’ll cover some of their important attributes.

The Canvas

Whenever you create UI elements, you will also create a Canvas element. UI elements will be children of the Canvas element since Unity draws all the UI on this Canvas object.

One of the most important attributes of the Canvas gameobject is the Render mode. There are 3 types:

  • Screen Space: Overlay

This render mode places UI elements on the screen rendered on top of the scene.

  • Screen Space: Camera

The Canvas is placed a certain distance in front of a specified Camera.

  • World Space

The Canvas will behave like any other object in the scene.

You’ll likely use Screen Space: Overlay for most UI; however, some games will use the other render modes to create different effects.

The UI Elements

Here is a quick list of the different UI elements Unity has to offer:

The best way to learn about these elements is to try them out on your own. The most commonly used elements are Text, Button, and Image. We can see by clicking Button that Unity already provides basic button capabilities for us to hit the ground running as they provide default images, text, and more.

Layout Tools

What’s more difficult than creating the UI elements is actually placing them where you want. Unity provides Anchor Presets so that you can place UI at relative positions on the screen.

You can use the Canvas Scaler component in your Canvas object with the Anchor Presets to adapt your UI to different screen sizes. The Canvas Scaler will scale your UI appropriately, while the Anchor Presets keeps your UI locked at a relative position. This is only a cursory overview of Unity UI elements, so have fun exploring the rest on your own!

--

--