Unity学习笔记|Unity学习笔记 - uGUI Unity学习笔记-uGUI

uGUI就是Unity原生自带的UI制作系统，unity 4.6之后才有的。据说比NGUI好用，毕竟是unity亲生的嘛~
学习目标：
1. UI图片的摆放与正常显示
2. 按钮-点击按钮动画；点击后界面跳转；点击后触发脚本中设定的功能
3. 窗口-窗口弹出/消失动画
4. 屏幕适配
5. 美术资源规划与性能优化

一. UI图片的摆放与正常显示

1. 创建UI图片

引自：http://blog.csdn.net/u012999985/article/details/50865335

点击菜单栏的GameObject标签——UI——Image

建立之后我们就能看到在左边的场景实体列表（Hierarchy）新生成了三个实体
Canvas：画布，相当于一个呈现界面UI素材的容器。
Canvas下的子实体Image：每个UI控件都是由美工设计的图片构成，这个就Image是放自己设计的图片的实体
EventSystem：监听UI相关的事件实体，用来支持点击触碰等。

Set Native Size 恢复图片原始尺寸

2. Canvas基本设置 Canvas - Render mode：Screen Space Camera
Canvas - Render Camera：Main Camera
Canvas Scaler - UI Scale Mode：Scale with screen size

二、按钮
1. 点击按钮的动画按钮会自带悬停、按下效果，在Button - Transition中可设置
ColorTink：点击效果靠颜色与Alpha透明度来调节

SpriteSwap：不同状态使用不同图片

Animation：利用Unity的动画系统来制作按钮的动画效果
关于Animation：
点击auto generate animation，创建animation controller文件；
选中加动画的button，打开Animation窗口，点击刚才创建的controller，这时Animation窗口中就可以看到4个动画状态了；
点击Add property就可以加动画效果了（或者点击红色录制按钮）。
* Image - Raycast Target 要勾选点击才会有效
2. 点击后界面跳转新建一个空的Game Object，比如叫Menu Ctrl
在Menu Ctrl上添加脚本MenuCtrl：

public void LoadScene(string sceneName)

{
SceneManager.LoadScene(sceneName);
}

On Click（）下面点击加号新建事件
将Menu Ctrl拖入，选中函数MenuCtrl.LoadScene，并输入需要跳转到的场景名
三、弹出窗口

创建panel，添加animator组件；
选中panel，打开animation窗口，新建动画。

四、屏幕适配
1. 关于Anchor四叶草参考：http://www.jianshu.com/p/5a11073e2b77

文章图片
四叶草是Anchor，Button是子矩形，灰色面板是父矩形 Anchor四角和父矩形四角的距离为比例固定；
子矩形四角和Anchor四角的距离为绝对距离固定；
Anchor四角合拢即Anchor大小永远为0，则父矩形大小变化时，子矩形大小不变，仅位置移动；
Anchor四角分开则父矩形大小变化时，Anchor大小随之变化，子矩形大小也同样变化；
调整Anchor四角的位置可使子矩形随父矩形形变的幅度有所不同（总之是会有各种不同的效果，数学不好原理似懂非懂，反正试试就知道了）。
下图这种将Anchor合拢置于父矩形左上角，则子矩形大小不会变，相对于左上角的绝对距离不会变

文章图片
现在只是知道uGUI屏幕适配的大概，有待进一步学习和尝试。

五. 美术资源规划与性能优化

这篇文章写的挺好：http://www.jianshu.com/p/061e67308e5f

补充资料：遮罩效果（Mask）

http://www.mamicode.com/info-detail-526038.html