loopIn/loopOutを極める

はじめに

"cycle" だけじゃない！意外と知らない人が多い、ループのエクスプレッションについて。

パラメータを見る前に...loopInとloopOutの違い

loopOutはなぜかみんな使うのに、loopInを使わない人が多い。違いは次の通り。

• loopOut：最後のキーフレームを過ぎた後に繰り返す。

• loopIn：最初のキーフレームが来るまで繰り返す。

これだけである。

「1,2,3,1,...」のときはloopOutでループする人は多いが、「1,2,3,1,...1,2,3,4,5,6」のときにloopInしない人が多い。「1,2,3,1,...1,2,3,4,5,6,7,8,9,7,...」はloopInとloopOut両方を使うことでループ分のキーを打たなくて済む。

どちらもプロパティにキーフレームを打っていることが前提。2つ以上打っていて初めて意味を成す。

どっちかしか使えない？

loopを覚えたてのときは楽しくて仕方がない。しばらくすると次に思うのが「loopIn、loopOut同時に使えないのか」。エクスプレッション初心者だと１つのプロパティに対して1つのコマンドしか書けないと思い込みがち。

それはエクスプレッションの最終結果が1つの値でないといけないわけで、同時に使えないわけではない。と言うと、こう書く人がいる。

loopIn();

loopOut();

そして言う「loopOutしかされないんだけど！」。そりゃあ、そうでしょう。

エクスプレッションはいろいろ書いても最終結果を採用するので、上のエクスプレッションだと常に loopOut(); で評価された値になる。

どうするか。

正直に条件を設定するならば、

if( time < key(1).time ){ loopIn(); } //A区間。1つめのキーフレームより前のときloopIn

else if( key(numKeys).time < time ){ loopOut(); } //C区間。最後のキーフレームより後ろのときloopOut

else{ value; } //B区間。上記どちらでも無いとき、つまり、最初と最後のキーフレームの間にいるときvalue

一番丁寧な書き方。

これで

1. loopInしてきて、

2. キーフレーム通りに動いて、

3. loopOut

という動きが作れる。

これでもよいが、まだ短縮できる。

loopInでもloopOutでもloopしていないときはどっちにしろ value を取るので、else{ value; } は要らないのでは？

ということを考えると三項演算子を使って次のように書ける。

( time < key(1).time )? loopIn() : loopOut();

のように書く。日本語にすると、

「現在の時間」(time)が、「このプロパティの1番目のキーフレームの時間」(key(1).time)よりも前のとき、loopIn()。そうじゃないときloopOut()。

という感じ。

これの場合、B区間はloopOut()の結果（それはつまりvalueなのだが）を採用している。

typeについて詳しく

違いを見ていくにあたって、グラフで表示するのが一番わかり易い。ただし、「速度グラフ」では意味がない。「値グラフ」で見たとき初めて違いがわかる。