緩動函式與動畫

搬運

用它來做動畫, 實際上就是將這個函式離散化

比如在x軸上取100個點, 計算得到f(x)值 就是得到了這個動畫在這100步的變化過程

緩動函式需要四個引數

b 函式開始值

c 函式結束值

d 結束時間(實際上這裡並不是真正意義上的時間, 而是離散時的取樣)

t 一般為0 也就是從開始值開始變化

例如我將d值設定為100 就是講這個連續的函式離散為100個點 根據t值(x軸位置)的不同得到不同的結果( f(x)的值 )

兩個簡單的例子

function timeoutmove() 

}run();
}

function raqmove()  else 

}run();
}

來看個緩動函式大集合

接下來和動畫集合一下

util = else

}var d = math.ceil(time / (1000/60)), //計算次數
t = 0;
var b = 1, c = 0.1
function run() else
}t++;
if (t <= d) else
}run();
}}

util.animate(cube, , 1000, 'easeinout');

常見動畫的緩動函式

大多時候，我們的動畫都是線性變化的。例如，乙個點從0運動到1，假如中間有8個點，那就應該是0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8。但有的時候，我們需要一種非線性的變化。例如我們做一架飛機起飛，它的變化應該是從慢到快的。又比如乙個小球落地，它的軌跡應該是拋物線，而且還會彈起。要...

用緩動函式模擬物理動畫

1 緩動函式簡介 1 緩動函式的動畫效果是建立在calayer層級的關鍵幀動畫基礎之上 也就是說用普通的uiview的animation是無法直接實現緩動函式 2 緩動函式是一系列模擬物理效果 如拋物線 方程式的統稱，用以計算給定兩點之間的插值 3 兩點之間插的值越多，效果越好，但是會耗費更多的效能...

用緩動函式模擬物理動畫

用緩動函式模擬物理動畫 1 緩動函式簡介 1 緩動函式的動畫效果是建立在calayer層級的關鍵幀動畫基礎之上 也就是說用普通的uiview的animation是無法直接實現緩動函式 2 緩動函式是一系列模擬物理效果 如拋物線 方程式的統稱，用以計算給定兩點之間的插值 3 兩點之間插的值越多，效果越...