UGUI-组件

2015-06-22

UGUI 组件

Canvas 画布

The Canvas component represents the abstract space in which the UI is laid out and rendered. All UI elements must be children of a GameObject that has a Canvas component attached. When you create a UI element object from the menu (GameObject > Create UI), a Canvas object will be created automatically if there isn’t one in the scene already.
Canvas组件代表存放和渲染UI控件的空间，所有的UI元素必须是包含Canvas组件对象的子元素，如果单独从菜单中创建一个UI元素，如果Scene场景中没有Canvas，系统会自动为元素创建一个Canvas父对象。

Render Mode：渲染模式

1.ScreenSpace-OverLay：UI覆盖整个屏幕,所有的GameObject对象都在UI的后方（由于UI场景非常大，将GameObject放大才能明显观查到）
　可以将OverLay渲染模式看做"Screen Space-Camera"渲梁方式集合中的一个对象（其中Render Camera=MainCamera，PlaneDistance=0）
　Pixel Perfect：不使用抗锯齿功能，使每个像素清晰的显示，防止在某些情况下产生的模糊。如果场景中有大量的元素需要缩放，移动，或者包含较精细的动画，不使用Pixel Perfect功能（不禁用抗锯齿功能），可以使动画、移动等平滑。
　Sort Order：排序次序，Sort Order越大，在平面上的显示越靠前；
　
2.ScreenSpace-Camera：用一个像机接收UI内容(把一个含有控件的平面放在距相机一定位置来显示UI，UI和其前后的GameObject对象会互相产生遮挡效果)
　Render Camera：用来渲染UI的Camera（且this.Canvas所含的UI内容只能在Render Camera中才能渲染），即使UI在场景中其它相机的范围内，其它相机也不会渲染；
　Plane Distance：Canvas到相机的垂直距离，Canvas在场景中的尺寸和位置决定于Render Camera 的Field of View 和 Plane Distance，
　Plane Distance更重要的作用是决定了场景中的GameObject对象在UI(this.Canvas所渲染的UI)的前方还是后方；
　Sorting Layer：Canvas所属的层（层的分类在：Menu->Edit->Project Setting->Tags and Layers->Sorting Layers 在SortingLayers中排序越靠下的层，在屏幕上显示越靠前）
　Order in Layer：在所属层中的排序次序，值越大，在所属层中越靠前

　
3.WorldSpace：将UI做为3D场景的一部分，类似gameObject 
　Event Camera：事件相机，UI中的交互事件（如点击，输入等）能且只能被Event Camera执行(在WorldSpace模式下如果UI在Scene场景中的任何像相机范围内，则相机可以观查到UI)
　

Canvas Scaler：画布内容缩放

The Canvas Scaler component is used for controlling the overall scale and pixel density of UI elements in the Canvas. This scaling affects everything under the Canvas, including font sizes and image borders.
Canvas Scaler 组件用来控制画布中全部元素的缩放和像素密度。这个缩放影响画布中的所有元素包括字体大小和图片边框

1.Constant Pixel Size: 确保画布中的元素保持不变的像素大小，不考虑屏幕的尺寸
　Scale Factor（缩放系数）:Canvas中的所有元素按Scale Factor进行缩放（Scale FactorScales all UI elements in the Canvas by this factor.）
　Reference Pixels Per Unit(每个单元所引用(包含)的像素数):
　(If a sprite has this ‘Pixels Per Unit’ setting, then one pixel in the sprite will cover one unit in the UI.如果一个精灵（Sprite子图片）有自已的Pixels Per Unit设置，将以精灵自身的设置优先)
2.Scale With Screen Size: 确保画布中的元素和屏幕适配，元素宽度随屏幕宽度缩放，元素高度按元素宽高比随宽度缩放
　Math=0时按宽度缩放，Math=1时按高度缩放
3.Constant Physical Size: 不变的物理大小，不考虑屏幕的尺寸和缩放，使用Constant Physical Size进行布局，无论不同计算机的像素尺寸是多少，图像的物理宽度都是固定的

Graphic Raycaster

?

Image

Image Type:
　　Simple:常规缩放（Preserve Aspect：保持宽高比）
　　Slice:图片在ImageEditor中修改边框数据后，图片会产生边框
　　Tiled:平铺，如果有边框，内部平铺