緩動函數
緩動函數指定動畫效果在執行時的速度,使其看起來更加真實。
現實物體照着一定節奏移動,並不是一開始就移動很快的。當我們打開抽屜時,首先會讓它加速,然后慢下來。當某個東西往下掉時,首先是越掉越快,撞到地上后回彈,最終才又碰觸地板。
- 緩動函數概覽參考博客:
名稱 | 描述 (速度與時間的關系) |
---|---|
倒退緩沖(BackEase) | 讓動畫在繼續之前往后退一點。這有點象在斜坡上啟動汽車,會往后倒退一點然后才前進。 |
彈跳緩沖(BounceEase) | 在我們前面的例子中,生成的就是個彈跳反沖。 |
圓緩沖(CircleEase) | 基於三角函數(圓函數)來加速動畫,一開始的加速度比較慢,越往后加速度越快。 |
立方體緩沖(CubicEase) | 與圓緩沖類似,但是是基於立方體函數的時間來產生一個一開始加速度較慢然后越來越快的動畫。 |
伸縮緩沖(ElasticEase) | 類似於彈跳緩沖(BounceEase),它會讓一個值擺動直到停下為止。 |
指數緩沖(ExponentialEase) | 類似於圓緩沖和立方體緩沖,只是加速度的值是按照指數來變化的。 |
乘方緩沖(PowerEase) | 這是一種指數緩沖,緩沖的值與時間的乘方成比例。 |
平方緩沖(QuadraticEase) | 非常類似於CubicEase,除了在這個緩沖中,值是基於時間的平方。 |
四次方緩沖(QuarticEase) | 類似於Cubic和Quadratic,只是值是基於時間的立方。 |
五次方緩沖(QuinticEase) | 類似於Cubic、Quadratic和Quartic,值基於時間的五次方。 |
正弦緩沖(SineEase) | 沿着正弦波來對值進行加速。 |
- EaseIn、EaseOut、EaseInOut:對於一個緩動函數,EaseIn是在開始是緩沖,即開始時變化較慢,EaseOut是在結束是緩沖,即結束時變化較慢,而EaseInOut是兩者兼有。
- 更多緩動函數細節可參照msdn介紹
- 緩動函數圖示可參照Easings緩動函數速查表
SetEase方法
SetEase(Ease easeType \ AnimationCurve animCurve \ EaseFunction customEase)
設置動畫的緩動。
如果應用於一個序列而不是Tweener,這個ease將被應用到整個序列,就好像它是一個單一的動畫時間軸。序列總是有緩動。默認情況下是線性的,獨立於全局默認設置.
You can pass it either a default ease (Ease – to see how default ease curves look, check out easings.net), an AnimationCurve or a custom ease function (see example).
此外,還可以設置以下可選參數:它們只在Back和Elastic的eases中工作。
overshoot
Eventual overshoot to use with Back ease (default is 1.70158), or number of flashes to use with Flash ease.amplitude
Eventual amplitude to use with Elastic ease (default is 1.70158).period
Eventual period to use with Elastic ease (default is 0), or power to use with Flash ease.
特例
Flash
, InFlash
, OutFlash
,InOutFlash
:這些緩動會對動畫應用一個閃爍效果,下面的圖片很清楚地表明了這點
overshoot
: Indicates the total number of flashes to apply. An even number will end the tween on the starting value, while an odd one will end it on the end value.period
: Indicates the power in time of the ease, and must be between -1 and 1.
0 is balanced, 1 fully weakens the ease in time, -1 starts the ease fully weakened and gives it power towards the end.
EXTRA: EaseFactory
EaseFactory.StopMotion
是一個額外的Layer,你可以添加到你的easings,使他們的行為就好像他們是在停止運動
EaseFactory.StopMotion(int fps, Ease\AnimationCurve\EaseFunction ease)
transform.DOMoveX(4, 1).SetEase(EaseFactory.StopMotion(5, Ease.InOutQuint));
DOTWeen緩動枚舉
public enum Ease
{
Unset = 0,
Linear = 1,
InSine = 2,
OutSine = 3,
InOutSine = 4,
InQuad = 5,
OutQuad = 6,
InOutQuad = 7,
InCubic = 8,
OutCubic = 9,
InOutCubic = 10,
InQuart = 11,
OutQuart = 12,
InOutQuart = 13,
InQuint = 14,
OutQuint = 15,
InOutQuint = 16,
InExpo = 17,
OutExpo = 18,
InOutExpo = 19,
InCirc = 20,
OutCirc = 21,
InOutCirc = 22,
InElastic = 23,
OutElastic = 24,
InOutElastic = 25,
InBack = 26,
OutBack = 27,
InOutBack = 28,
InBounce = 29,
OutBounce = 30,
InOutBounce = 31,
Flash = 32,
InFlash = 33,
OutFlash = 34,
InOutFlash = 35,
//
// 摘要:
// Don't assign this! It's assigned automatically when creating 0 duration tweens
INTERNAL_Zero = 36,
//
// 摘要:
// Don't assign this! It's assigned automatically when setting the ease to an AnimationCurve
// or to a custom ease function
INTERNAL_Custom = 37
}