Here we are again with a new chapter of my Unity 3D adventure. In one hand I’m still missing all those code files and class diagrams, but in the other hand, testing the game with a single click, and edit some objects dragging and dropping them around the scene panel is quite wonderful.
In this post I want to introduce the main reason that made me switch from the stable 4.5 Unity version to the 4.6 beta some time ago: the new UI objects and functions! Something the community was waiting for a long time
The beta version was working fine, but all those new fancy things are now in the latest stable version, so it’s time to get familiar with them.
canvas introduction
New UI objects!
In the Game Objects menu now there is a new menu called UI full of new objects ready to be part of almost any UI you can imagine.
These are still Game Objects, so they can be combined and associated between them to create complex structures, and also all of them can be edited from the scene and inspector panels like any other Game Object in Unity… or that’s how it looks like at first sight!
new UI objects
As soon as you create the first UI element, you might find one Object called canvas you didn’t create before. This object is the main topic of this post, and it’s usually the container of all those new UI objects. A canvas is somehow an object to rule them all (or at least all its UI object childs)
canvas and UI quick example
The canvas object
The canvas object is usually the main container of some of the new UI objects. Sometimes it works like a fixed camera covering the whole viewport, sometimes it’s like an overlay of some camera, and sometimes it’s just like a container with some child objects, it depends on the value of the canvas’s property “Render mode”.
The “render mode” property changes dramatically how the entire UI contained by the canvas will be shown. It allows a huge amount of possibilities and turns an apparently simple object like the canvas into a powerful tool. Let’s check how each render mode value works:
Screen Space – Overlay
The canvas is shown over any other objects by default, no matter what camera is active or if the camera have the canvas within its range or not. While using this render mode, the canvas cannot be scaled or moved; it will fit the entire viewport, scaling any child if needed.
This option can be useful for pause screens, designing them outside the camera range without messing with additional cameras.
Overlay mode. The canvas object is outside the camera range
Even with the canvas outside the camera range, the UI is displayed
Screen Space – Camera
This mode requires a camera as a parent and a plane distance to set the distance between the camera and the UI overlay. Using this method means the canvas will depend on the camera and it will be rendered using the same camera as reference. Again, the canvas cannot be moved or scaled, but if the camera is transformed in any way, the canvas object will fit to the new conditions.
In this case, if the assigned camera is not active, the UI objects inside the canvas won’t be rendered as well.
Canvas size depends on the camera size and the panel distance set in the canvas properties
World Space
This last render mode is in my opinion a great improvement that allows a good amount of new effects and possibilities. This time, the canvas object becomes a normal Game Object; all the transform options are now available and can be sorted and rendered as a normal Game Object.
Creating 2D dialogs and information panels is quite simple with using some canvas with this render mode enabled, even in 3D games, and that’s only one simple example.
This time the canvas can be moved behind the plane like any other Game Object
Here is the complete list of chapters of this Unity3d canvas series where you can find the entire process:
- Unity 3D new UI features
- More Unity 3D! Using it all together
- Creating a 3D world and a playable character in Unity3D
- Animating a game interface in Unity
- UI ingame messages in Unity3D
- Basic raycasting in Unity3D
Enough for now! I recommend learning a bit of all the new UI features. It’s something we have been waiting for a long time, and if you are using Unity, better get used to these awesome new features before Unity 5 comes out!