NGUI Clip Animation

环境：

Unity 4.5,NGUI3.5,iTween

准备：

创建一个UIPanel，UIPanel下再创建一个UISprite，UIPanel选择SoftClip,然后给Panel绑定上PanelController.cs，类似下图

MaskManager

给UIRoot绑定PanelController.cs，Targets为上面创建的四个Panel，点击Play ，按数字键 0，1，2，3，4 切换效果

效果预览视频：http://pan.baidu.com/s/1ntr3XSt

using UnityEngine;
using System.Collections;
using System.Collections.Generic;

public class MaskManager : MonoBehaviour {
    public GameObject[] Targets;

    private List<PanelController> clipList;
    private float sw = 1024f;
    private float sh = 576f;

    // Use this for initialization
    void Start () {
        clipList = new List<PanelController>();
        foreach(var target in Targets) {
            clipList.Add(target.AddComponent<PanelController>());
        }

        Init();
    }

    // Update is called once per frame
    void Update () {
        if(Input.GetKeyDown(KeyCode.Alpha1)) {
            ShowFullImage(0);
        } else if(Input.GetKeyDown(KeyCode.Alpha2)) {
            ShowFullImage(1);
        } else if(Input.GetKeyDown(KeyCode.Alpha3)) {
            ShowFullImage(2);
        } else if(Input.GetKeyDown(KeyCode.Alpha4)) {
            ShowFullImage(3);
        } else if(Input.GetKeyDown(KeyCode.Alpha0)) {
            Init();
        }
    }

    void Init() {
        for(int i=0; i<clipList.Count; i++) {
            var size = new Vector2((sw / clipList.Count), sh);
            var offset = new Vector2(-sw * 0.5f + (i + 0.5f) * (sw / clipList.Count), 0f);
            clipList[i].UpdateOffset(offset);
            clipList[i].UpdateSize(size);
        }
    }

    void ShowFullImage(int id) {
        for(int i =0; i<clipList.Count; i++) {
            if(i != id) {
                clipList[i].SetDepth(i);
            } else {
                clipList[i].SetDepth(clipList.Count);
            }
        }
        clipList[id].UpdateOffset(new Vector2(0f, 0f));
        clipList[id].UpdateSize(new Vector2(sw, sh));
    }
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

using UnityEngine;
using System.Collections;

public class PanelController : MonoBehaviour {
    private UIPanel panel;
    static private float animTime = 0.6f;

    void Awake() {
        panel = GetComponent<UIPanel>();
    }

    // Use this for initialization
    void Start () {
    }

    // Update is called once per frame
    void Update () {

    }

    public void SetDepth(int depth) {
        panel.depth = depth;
    }

    public void UpdateSize(Vector2 size) {
        var current = new Vector2(panel.baseClipRegion.z, panel.baseClipRegion.w);
        iTween.ValueTo(gameObject, iTween.Hash("from", current, "to", size, "time", animTime, "onupdate", "OnUpdateSize"));
    }

    public void UpdateOffset(Vector2 offset) {
        iTween.ValueTo(gameObject, iTween.Hash("from", panel.clipOffset, "to", offset, "time", animTime, "onupdate", "OnUpdateOffset"));
    }

    private void OnUpdateSize(Vector2 size) {
        panel.baseClipRegion = new Vector4(0f, 0f, size.x, size.y);
    }

    private void OnUpdateOffset(Vector2 offset) {
        panel.clipOffset = offset;
    }
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

NGUI Clip Animation