UI Elements in Unity
The U stands for User and the I stands for Interface. Thus UI is ‘User Interface’
Unity UI is a UI toolkit for developing user interfaces for games and applications. It is a GameObject-based UI system that uses Components
and the Game View to arrange, position, and style user interfaces.
Definition:
UI stands for an interface between a human and computer or a computer program. It can take many forms. A screen, keyboard or a mouse is technically an interface. And so is a website or an application.
UI usually refers to a software interface and more often than not, it is Graphical User Interface that comes to mind. This however need not be the case.
In Unity, the Canvas is also a Game Object with a Canvas component attached to it. This Canvas component acts as the master of all UI elements on the screen. That’s why all UI elements are required to be the child gameObject of the Canvas .
How to create Canvas ?
Right click in the hierarchy panel and create Canvas. The first segment in the Canvas’s scripting is the Canvas itself. It has properties which change where and how the Canvas is rendered on screen.
The second segment, the Canvas Scaler, is used to set the size and scaling of UI elements according to different screen sizes.
Screen Space — Overlay :
This render mode is often used by the developer.It is always rendered at the top of the screen.UI elements like health bar , score and other static elements …It scales UI elements to the required size as per the screen size.
Screen Space -Camera:
This is quite similar to how the Overlay mode works, but here, we specify a camera which renders our UI. As such, changing properties in the camera like its shape, size, area of coverage or resolution will change the way the UI looks on the screen.
World Space
This one is different from theother mode.In world space this UI elements are treated as gameObject of the game such as enemies ,
coins our UI elements are alsothe part of the game. so the Canvas is set to Screen space-overlay and Canvas scaler to Scale with Screen size.
Drag all you assets and change the images to sprite 2d and preserve the aspect ratio .Enter the width and height in the canvas.
Duplicate the BG two times and change to Title and Symbol. Just change in the image source to the respective images. Change in the rect transform panel , it can be in the right ,left or center aligned .
In the rect transform change the width and height of each image
That’s it a simple UI for the game is ready now.