Unity知识点(UGUI)

一：使用Canvas时 EventSystem（系统事件）会和Canvas一起出现

1.Screen Space - Overlay（屏幕空间-覆盖）

        这种渲染模式表示 Canvas 下的所有的 UI 控件永远位于屏幕的前面 , 不管有没有相机 , UI元素永远在屏幕最前面 ，主要是2D效果。类似手机膜贴在手机屏幕的最上面，若是屏幕尺寸或屏幕分辨率发生变化，Canvas也会自动和当前屏幕尺寸相适应，这也就很好的解决了屏幕自适应问题。

 2. Screen Space - Camera（摄像机空间）

        这种渲染模式 Canvas 和 摄像机之间有一定的距离 , 可以在摄像机和 Canvas 之间播放一些粒子特效，主要是3D效果。利用这种渲染模式时需要设定一个摄像机并将其绑定到Canvas组件下的Rander Camera处，改变Camera则UI元素的渲染效果也会发生变化。

plus：

勾选"Pixel Perfect"，在Canvas中的模糊效果消失，变得相对清晰。

3. World Space（世界空间）

这种模式下 Canvas 就和普通的 3D 物体一样了 , 可以控制它的大小,旋转,缩放等 。这种渲染模式使得UI元素和3D世界中的物体产生遮挡效果。 一般用来做血条。

         Constant Pixer Size —— 恒定像素

这种模式下 UI以像素为大小，同样的像素在不同的分辨率下尺寸不一样 

        Scale With Screen Size —— 屏幕尺寸比例

这种缩放模式下的UI位置是根据屏幕的分辨率和设置的宽高比来调整UI的位置的，通常做屏幕UI自适应的时候都需要调整到这个缩放模式下。 

        Constant Physical Size —— 恒定尺寸

 这种模式下 UI以像素为大小，在不同的分辨率下尺寸不一样

        Graphic Raycaster：控制是否让UI响应射线点击

EventStystem 

 二：Text

四边锚点

 三：Panel

panel 控件又叫面板，面板实际上就是一个容器，在其上可放置其他 UI 控件。
        当移动面板时，放在其中的 UI 控件就会跟随移动，这样可以更加合理与方便地移动与处理一组控件。
        拖动面板控件的 4 个角或 4 条边可以调节面板的大小。
        一个功能完备的 UI 界面往往会使用多个 Panel 容器控件，而且一个面板里还可套用其他面板，如下图所示。

 当创建一个面板时，此面板会默认包含一个 Image（Script）组件，如下图所示。
其中，Source Image 用来设置面板的图像，Color 用来改变面板的颜色。

 四：Image

Source Image（图像源）：纹理格式为Sprite（2D and UI）的图片资源（导入图片后选择Texture Type为Sprite（2D and UI））。

Color（颜色）：图片叠加色。

Material（材质）：图片叠加材质。

Raycast Target（射线投射目标）：是否作为射线投射目标。

Image Type（图片显示类型）：Simple（基本的），图片整张全显示，不裁切，不叠加，根据边框大小会有拉伸。

Preserve Aspect（锁定比例）：针对Simple模式，勾选之后，无论图片的外形放大还是缩小，都会一直保持初始的长宽比例。

Image Type（图片显示类型）：Sliced（切片的），图片切片显示，在Project页面选中图片，切换为Sprite（2D and UI）模式后，点击Sprite Editor进入图片裁切模式，将图片裁切为上图的形状，使用Sliced模式后，根据图片边框拉伸，图片的四个角会保持原状，而1和4部分会随着图片的横向拉伸而拉伸，2和3部分会随着图片的纵向拉伸而拉伸，图片的中间部分会拉伸5进行填充。

 Image Type（图片显示类型）：Tiled（平铺的），若图片已经过裁切，则使用Tiled模式后，根据图片边框拉伸，图片的四个角会保持原状，而1和4部分会随着图片的横向拉伸而拉伸，2和3部分会随着图片的纵向拉伸而拉伸，图片的中间部分会用5进行平铺填充。若图片未裁切，则使用Tiled模式后，根据图片边框拉伸，图片保持原大小不做变化，只是用自身平铺填充。

Image Type（图片显示类型）：Filled（填充的），根据填充方式、填充起点、填充比例决定图片显示哪一部分。

Fill Method（填充方式）：分为水平、垂直、90度圆、180度圆、360度圆。

Fill Origin（填充起点）：根据填充方式不同有所变化。

Fill Amount（填充比例）：0是完全不显示，1是完全显示。

五：Raw Image

六：Input Field