タイムライン上の一定区間を指定して、それ以降の動きの繰り返しと繰り返し方を指定するのが、loopOut、それ以前をループさせるのがloopInです。実際はloopOutを多用すると思います。
4種類あるループ
loopOut、loopInにはタイプが4種類用意されています。
- cycle
- pingpong
- continue
- offset
どれも非常に便利です。
上が実際にレンダリングしたアニメーションです。いずれもキーフレームすべて同じで、3つのみ。最後のキーフレーム後の動きが、loopOutで設定された動きになります。
cycle
loopOut(type = "cycle");
一番基本的なloopOutスタイルです。最後のキーフレームから最初のキーフレームへ戻ります。位置情報も回転情報も最初のキーフレームになります。
pingpong
loopOut(type = "pingpong");
最後のキーフレームに到達すると最初のキーフレームまで逆戻りしていきます。
continue
loopOut(type = "continue");
最後キーフレーム時の速さを維持します。
offset
loopOut(type = "offset");
動きは最初のキーフレームに戻りますが、位置は最後のキーフレームの時のものを維持します。相対的に動きだけループしていくイメージです。