(一) Canvas---画布
The Canvas is the area that all UI elements should be inside. The Canvas is a Game Object with a Canvas component on it, and all UI elements must be children of such a Canvas.
在画布的区域内包含所有的UI元素。画布对象拥有一个组件,并且所有的UI元素必须为画布的子物体。
Creating a new UI element, such as an Image using the menu GameObject > UI > Image, automatically creates a Canvas, if there isn’t already a Canvas in the scene. The UI element is created as a child to this Canvas.
创建一个新的UI元素,比如:创建Image,在菜单中的GamObject -> UI-> Image,如果在场景中不存在画布会自动的创建一个画布。即所创建的UI元素会作为其子元素。
Draw order of elements ----画布的元素
UI elements in the Canvas are drawn in the same order they appear in the Hierarchy. The first child is drawn first, the second child next, and so on. If two UI elements overlap, the later one will appear on top of the earlier one.
在层次视图中按一定顺序显示出已创建的UI元素。第一个创建的子物体会显示在第一个,依次往下。
在scene中,如果两个元素重叠,则后创建的一个会显示在另一个上面。
To change which element appear on top of other elements, simply reorder the elements in the Hierarchy by dragging them. The order can also be controlled from scripting by using these methods on the Transform component: SetAsFirstSibling, SetAsLastSibling, and SetSiblingIndex.
在层次视图中,改变元素的顺序可以通过简单的拖拽来改变。同样也可以通过这些方法的脚本组件来改变:SetAsFirstSibling,SetAsLastSibling,SetSiblingIndex。
Render Modes---渲染方式
The Canvas has a Render Mode setting which can be used to make it render in screen space or world space.
画布呈现的渲染方式设置,可以用来使它呈现为屏幕空间或世界空间。
Screen Space - Overlay ----屏幕显示UI
This render mode places UI elements on the screen rendered on top of the scene. If the screen is resized or changes resolution, the Canvas will automatically change size to match this.
这种渲染模式只呈现出UI元素的场景。如果更改屏幕的大小或分辨率,画布会自动的改变大小匹配。
Screen Space - Camera ----摄像机
This is similar to Screen Space - Overlay, but in this render mode, the Canvas is placed a given distance in front of a specified Camera. The UI elements are rendered by this camera, which means that the Camera settings affect the appearance of the UI. If the Camera is set to Perspective, the UI elements will be rendered with perspective, and the amount of perspective distortion can be controlled by the Camera Field of View. If the screen is resized or changes resolution, or the camera frustrum changes, the Canvas will automatically change size to match as well.
在这个渲染模式下,前面的画布上放置一个给定距离的摄像机。则UI元素会被摄像机渲染,意味着相机的设置影响用户界面的外观。如果相机设置为视角,UI元素将呈现的角度来看,和透视失真的数量可以控制摄像机的视野。如果屏幕大小或更改分辨率,或者相机锥范围变化,画布会自动改变大小匹配。
World Space ---世界空间
In this render mode, the Canvas will behave as any other object in the scene. The size of the Canvas can be set manually using its Rect Transform, and UI elements will render in front of or behind other objects in the scene based on 3D placement. This is useful for UIs that are meant to be a part of the world. This is also known as a “diegetic interface”.
此渲染模式下,场景中的任何物体均会被呈现出。互补的大小可以手动设置其矩形位置和UI元素将渲染场景中其他对象的前面或后面。