NGUI Clip Animation (UI动画)

效果预览

视频：http://pan.baidu.com/s/1ntr3XSt

运行环境

Unity 4.5, NGUI3.5, iTween

场景搭建

创建一个UIPanel，UIPanel下再创建一个UISprite，UIPanel选择SoftClip,然后给Panel绑定上PanelController.cs，拷贝4份。结构如下图

MaskManager

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

MaskManager代码

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));
    }
}

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;
    }
}