Tweens(補間動畫)

補間動畫有很多種：

這里以Tween Height為例：

項目層次：

btn為一個按鈕，group為一組圖片精靈，預覽圖如下：

第一步：先為每個item附加一個Tween Height腳本，設置如下：

form表示起始的高度，to表示最終高度，play style表示播放類型：once只播放一次，loop循環播放，ping pong也是循環播放，不過兩個肯定是有區別的，區別就在于：

假如對象的Tween Height腳本的from到to設置的值為（20~60），那么loop循環播放就是當對象的高度從20變到60，這個過程是緩慢變化的，而當進入第二次循環的時候，對象會立馬變為20的高度，而看不到60變為20的過程，而ping pong則能看到，效果圖，分別如下：

? ??

Animation Curve 動畫曲線：用來與微調這兩個值的變化過程，后面會舉例說下他的作用

Duration：播放動畫的時間

Start Delay：延遲時間

tween group：可以控制在同一個對象上的多個tween觸發。播放時指定group ID，，后面也會舉例說下他的作用

ingnore timescale：忽略timescale

On finished：播放完成后執行哪些事件

這里的三個item的finished的Notify分別設置成下一個的item即可，

當然每個item的Tween Height是不需要勾選的，是通過On Finished來觸發下一個item的，而第一個則是通過btn的onclick函數來調用的！

ResetToBeginning：表示手動復位Tweener至開始狀態，如果補間動畫是forward的，這意味著補間動畫的開始，如果補間動畫正在reverse，這意味著補間動畫的結束。PlayForward：表示播放補間動畫（Play已被playforward取代，看UITweener這個補間動畫的父類就知道了，但playforward內部還是通過play來實現的）

還有其他方法，您可以查看UITweener類來了解一下

ResetToBeginning和PlayForward的方法是根據Notify對象附加的腳本來查找的，是此腳本中的方法或者是繼承的，并且是公共的！

第二步：設置btn的onclick如下（但是先必須綁定第一個執行的方法是ResetToBeginning，不然無法實現還原狀態）：

最終效果：

?

?Animation Curve?動畫曲線

?

可以看出動畫曲線默認的x與y軸方向是從0.0到1.0的，x軸表示時間比，y軸表示高度比，僅對當前的Tween Height而言，這個固定點位置分別是0.0和1.0，不可以再增加固定點，但是可以增加key，雙擊動畫曲線或者在動畫曲線上右擊可以增加key，key的作用就是設置這一秒對象的高度和變化效果，也可以設置此key左邊和右邊曲線的狀態，下面展示通過增加key改變曲線來達到不同的效果

左邊是增加key來改變曲線的狀態，右邊是默認曲線的狀態

??

與上面的曲線圖對應的效果圖：

看下圖，可以看出可以設置此時key的效果，有free smooth（自由光滑），flat（水平的），broken（斷續的），同時也可以設置左邊，右邊或者兩邊的切線效果，有free（自由），linner（線性的），constant（恒定的）

可以直接用tween的Begin()函數來創建tween：

TweenPosition.Begin(tweenGameObject, duration, targetPosition);

如果你想使用高度補間動畫，那你就要用TweenHeight.Begin?(UIWidget widget, float duration, int height)

?

tween group?補間動畫組別設置

假如現在給item1和item2的Tween Height的Tween Group設置為1，而item3還是默認為0

并且所有item的OnFinished不附加任何對象，為None

為btn附加UIPlay Tween腳本

此時Tween Group設置為2，其他的選項沒什么好說的，直接看效果圖，可以看出只有item1和item2動了，而item3沒，達到了我們想要的效果

利用Tween Scale實現類似抖屏效果：

曲線圖：

效果圖：

轉載于:https://www.cnblogs.com/MrZivChu/p/Tweens.html

總結

以上是生活随笔為你收集整理的NGUI-Tweens的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。