スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

キーフレームアニメーションの解説

【リンク】 ◆解説系TOP◆

とりあえず、キーフレームアニメーションは成功したので、
今日はそのやり方を書こうかなと思います!(`・ω・´)


まず、キーフレームアニメーションというのは、
-----------------------------------------------
最初の状態最後の状態を定義しておき、
その中間は最初と最後の状態から補間で求める。

-----------------------------------------------
というものです。

例えば、
-------------------------------------------------------
0秒 の時に 0m     (最初)
10秒 の時に 150m     (最後)

-------------------------------------------------------
という情報が決まっているとします。

この時、5秒の時は何mのところに居るの?という質問には
下記の様にして答えられます。

----------------------------------------------------------------
【1】最初から最後までの、時間の長さを求める。
【2】最初から最後までの、変化量を求める。
【3】最初から現在の時刻までの長さを時間の長さで割り、全体の長さとの割合を出す。
【4】変化量に、出てきた割合をかける。
【5】初期の値に、計算した変化量を足す

----------------------------------------------------------------

実際にやってみましょう!

↓計算の流れ
-------------------------------------------------
【1】 10秒 - 0秒 = 10秒
【2】 150m - 0m = 150m
【3】 (5秒 - 0秒) ÷ 10秒 = 0.5
【4】 150 × 0.5 = 75
【5】 0 + 75 = 75m ←答え!

-------------------------------------------------

計算の結果、75mが答えだと分かります。

こういうのは よく 5秒は10秒の半分。 150mの半分は75m!と言う風に、
感覚的に答えは出せるものの、答えを出す計算式はすぐに思いつかなかったりします。

なので、上記の【1】 ~ 【5】の手順で求められるという事は覚えておきましょう。


で、Xファイル上でアニメーションキーは このように定義してあります。
キーフレームXファイル

さっきは最初と最後の2つのみでしたが、
見ても分かるように、Xファイルでは大抵 2つ以上の状態があります。
(上記のXファイルでは、全部で5つあります。)

なので、補間をするにしても、
-----------------------------------------
0 と 59 の補間をするのか?
59 と 119 の補間をするのか?
119 と 179 の補間をするのか?
179 と 239 の補間をするのか?

-----------------------------------------
このように、どれとどれの補間をするのか?から求める必要があります。
さっきの最初と最後の状態から補完する方法の応用編みたいな感じになりますね。

2つ以上の状態がある場合のやり方は、
-----------------------------------------------------------------
【1】どれとどれの補間をすべきなのかを求める。
【2】2つの状態の、時間の長さを求める。
【3】2つの状態の、変化量を求める。
【4】最初から現在の時刻までの長さを時間の長さで割り、全体の長さとの割合を出す。
【5】変化量に、出てきた割合をかける。
【6】2つの状態の、初期の方の値に、計算した変化量を足す。

-----------------------------------------------------------------
こんな感じになります。
【2】~【6】は色々と文章は変わってますが、
やってる事はさっきの【1】~【5】の処理と同じです。

※ただし、さっきと求めるものが違う。
さっきは何m?だったのに対し、今回は座標なのでx、y、zの3つの要素の計算をする。



同じように、
89の時はx、y、zの座標はどうなるの?という質問に対する
答えを出してみましょう。

【1】まず、どれとどれの補間を出せば良いのか?を調べる。

やり方はこんな感じなります。↓
----------------------------------------------------------------------
現在の時刻より大きいキーフレームがあったら、それと
それの一つ前の補間を出すようにする

----------------------------------------------------------------------

で、時刻が89の場合は、
--------------------------------------
0  <  89
59  <  89
119    89  ←現在の時刻よりも大きい!

--------------------------------------
現在の時刻より大きい119と、それの一つ前の59
つまり59と119の補間をすればよいと言う事になります。

どれとどれの補間をすれば良いのかが分かったので、後は同じように計算するだけです。
--------------------------------------------------
【2】 119 - 59 = 60
【3】 
    4 - 4 = 0  (x)
    1 - 0 = 1  (y)
    0 - 0 = 0  (z)
【4】 (89 - 59) ÷ 60 = 0.5
【5】
    0 × 0.5 =  0  (x)
    1 × 0.5 = 0.5  (y)
    0 × 0.5 =  0  (z)
【6】
    4 + 0 = 4
    0 + 0.5 = 0.5
    0 + 0 = 0

答え x y z = (4 0.5 0)
--------------------------------------------------
上記の計算の結果、
時刻が89の時の座標は、(4 0.5 0)という事が分かります。

で、後はこの結果を用いて、
x軸の4、y軸の0.5、z軸の0 に移動する行列を生成し、
その行列を使って3Dモデルを描画すればOK!と言うわけです。

※拡大・縮小、回転のアニメーションも存在するのならば、当然それについても
同じように計算する必要があります。


ただし、Xファイルの場合 回転にはクォータニオン(四元数)という
意味の分からない小難しいモノ(概念)が使われてます。

計算が本当にややこしいので、今回は扱いません。
クォータニオンの解説を作る機会があったら、その時に
キーフレームアニメーションにおいて回転の補間をする方法も書きたいと思います。


最後に。
変換の順番は、拡大・縮小回転オフセット(平行移動)です。

この順番にしないと、3Dモデルの形がおかしくなるのです。

例えば、マリオを y軸方向に2倍して、Z軸中心に90度回転させれば
身長が高くなったマリオが仰向けになっている状態になります。

しかし、回転を先にして、
Z軸中心に90度回転、その後 y軸方向に2倍という風にすると、
マリオデブになって横たわっているだけになります。 

コレでは駄目ですね。
ピーチ姫「もう助けに来なくていい」とか言い出すかもしれません。

なので、
拡大・縮小⇒回転⇒オフセット(平行移動)という順番で変換するようにしましょう。
スポンサーサイト

テーマ : ゲーム製作 関連 - ジャンル : ゲーム

コメント
コメントの投稿
管理者にだけ表示を許可する



上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。