動き物を作る時に使えると便利なアニメーションなのですが、
ケロは全然使ってませんでした。(- ．-)ヾ ポリポリ
アニメーターのフローがどうも馴染めなくて、
触ろうともしてませんでした。
(;^_^A
動き物を作ろうと思うと必要になるので、
勉強していきたいと思います。
(°-°;)ヾ(-_- ；) 今更かよ…
簡単なアニメーションなら作成した事はあったのですが、
キャラクターの動作など作った事がなく、使い方を知りませんでした。
一から勉強と言う事で、お勉強をしてみたいと思います。
(;^o^) ＼(ToT )小学生か！
既にご存じの方は傍観して頂けると幸いでっす。(..*) オハズカシイ・・
Unityのアニメーションは、Mecanimと言う機能でアニメーション作成から
実行までをエディターで一貫して操作できる機能です。
本来、複雑なスクリプトを組まないとできないアニメーションですが、
Unityなら簡単に作成できるようになっています。
アニメーションの再生は、時間経過に沿ってパラパラ漫画の様に
設定した絵が上書きされて行く感じになります。
ざっくりと説明するとこんな感じなんですが、
実際にどんな感じの物が作れるか試したので、動画にしてみました。
ケロたんコーラス隊でっす。
再生できない場合、ダウンロードは🎥こちら
スクリプトを組まなくても、これくらいなら簡単に作れる所が魅力です。
作り方は、アニメーションウィンドウを開いて時間グラフに
座標などを入力して、記憶させればPLAYと同時に実行してくれます。
実際に作ってみないと分からないので、
簡単な物を作りながら説明していきたいと思います。
設定はandroidです。
Imageを追加して、UFOのスプライトをアタッチします。
このUFOを動かすアニメーションを作ります。
UFOのオブジェクトを選択した状態で、
ウィンドウ→アニメーション→アニメーションを開きます。
なにやら開きました。これがAnimationウィンドウです。
このままでは、何もできないので初期設定をします。
まずは、作成のボタンを押さないと始まらないのですが、
ボタンを押すと、AnimationとAnimatorコントローラーの
二つのファイルが作成されます。
保存先を作っておくと分かりやすいので、
Resourcesフォルダ内にAnimationsフォルダを作成して、
そこに二つのファイルを保存するようにします。
保存先を用意したので、作成をクリックします。
ファイル名と保存先を聞いてくるので、用意したフォルダを指定して
名前はなんでもいいです。
今回は、UFO@moveにしておきます。
保存ができたら、
Animationウィンドウの表示にグラフが追加されて、
フォルダ内には、二つのファイルが作成されます。
Animatorコントローラー
これがAnimationを管理してくれます。
UFOのインスペクターを見ると
Animatorコンポーネントが追加されて、
コントローラーに、このファイルがアタッチされています。
この部分は、Animationを作成すると自動的にセットされる部分なので、
気にしなくてもいいですが、他のアニメーションを呼び出したい時などは、
変更する事もできます。
Animation
このファイルが作成されたアニメーションになります。
Animationファイルのインスペクターでは、
ループの設定が行えます。
単純にループを解除したい場合は、ループ時間のチェックを外すと
一度だけの再生を行えます。
コントローラーが、必要な時にAnimationを呼び出し、
呼び出されたAnimationは、設定された情報を再生する。
二つのファイルは、こんな感じで機能しています。
それでは、UFOを使ってアニメーションを作って行きます。
ウィンドウ→アニメーション→アニメーションで開きます。
アニメーションウィンドウでは、
タイムラインに必要な動きを設定する事で再生が行われます。
UnityのPLAYを押すとセットしたObjectが生成されますが、
生成された所がタイムラインの開始点0:00秒となります。
SetActiveで隠していたObjectを表示した場合、表示した時が0:00秒となります。
プレハブも生成された時が0:00秒です。
タイムラインには、座標などのTransform、ObjectのImageを時間毎に設定できます。
生成されたObjectは、タイムラインに沿って指定された動きを再生していきます。
それでは、UFOの動きを作ってみたいと思います。
UFOの初期座標をX-550、Y0に移動させて、Animationウィンドウを開きます。
プロパティを追加からRectTransformのAnchoredPositionの+を押します。
0:00秒と1:00秒にひし形のマークが追加されましたが、
これはkeyと言う物で、keyの部分で座標などを切り替えるようにします。
keyは追加・削除ができるので、切り替えポイントの増減が可能です。
UFOを左側によせたので、1秒で右はしに移動させてみます。
タイムラインの秒の帯をクリックして下さい。（赤枠部分）
分かりにくいのですが、白いグリッド線がクリックした秒に移動すると思います。
これがタイムラインのカーソルになります。
グリッド線をkeyのある1:00秒に移動させます。
1秒後のUFOの座標を、X550、Y0の位置に移動させたいので、
Positionを登録しないといけないのですが、このままでは登録できません。
登録の方法はレコーディングと言って、スクショの矢印のボタンを押す必要があります。
Recボタンを押すと秒の帯と対応した部分、今回はPositionなのですが、
赤い表示に変わります。
この状態でグリッド線の位置の座標を入力してやるとRecされる仕組みになっています。
実際にUFOのX座標を550に変更します。
変更後は、もう一度Recボタンを押して確定させます。
表示が水色に戻れば完了でっす。
座標登録が終わったので、ウィンドウの再生ボタン▶を押してみます。
シーンビューのUFOがタイムラインに合わせて動いたと思います。
1秒だと動きが早すぎるので、少し遅くしてみます。
1秒のkeyの上側をドラッグして、3秒まで移動させます。
タイムラインの尺が1秒ほどしか表示されてない場合は、
マウスのホイールを回すと尺の拡縮ができるので、必要にあわせて広げて下さい。
この状態で再生すると右端まで行ったUFOが左端にワープします。
アニメーションは初期設定でループ再生になっているので、
設定された秒まで終了すると再度0:00秒からの再生になります。
なので、UFOを左端に戻す設定をします。
6:00秒にkeyを追加します。
keyの追加は、赤丸の部分をダブルクリックすると追加できます。
追加したkeyの部分にグリッド線を移動させて、
Rec→座標入力をします。
座標は、X-550、Y0
これで再生するとUFOが左右に移動するようになります。
ただ、移動するだけではUFOっぽくないので、揺れを入れてみます。
揺れてるようにみせるには、傾きが必要になるので、
プロパティ追加からRotationを追加します。
傾きは、0.5秒毎に反転させたいので、
Rotationの帯上で0:30のライン上をダブルクリックしてkeyを追加します。
0:30に追加したのは、タイムラインは1:00=0:6秒に設定されているので、
0.5秒に設定したい時は、0:30に合わせる必要があります。
0:30にグリッド線を移動させて、Rec開始です。
回転のZ軸を10度に変更します。
ここからは、0.5秒毎に-10度、次は10度と交互に設定します。
UFOが両端、0:00秒、3:00秒、6:00秒の時は、傾き0度にします。
全てのkeyが設置できると、こんな感じになると思います。
これで設定が終わったので、Recボタンを押して確定させます。
実際の動画を
再生できない場合、ダウンロードは🎥こちら
本物のUFOを見た事がないので、こんな感じで動くかわかりませんが、
雰囲気はだせたかなと思います。
動作の処理は、こんな感じで作る事ができるのですが、
正直、keyを追加するだけで手間が掛かります。
これならDoTween使った方が早くない？となります。
なので余りAnimationを使う事もないのですが…
実は、Animationを使う場面があります。
歩行や動作などの処理は、Animationが重宝します。
実際にAnimationを作ってみます。
3枚のロボのスプライトを用意しました。
動作の3パターンです。
この3枚のスプライトを時間経過で切り替えて、
動いているように見せる事をAnimationでやります。
まず、androidの設定をして、Imageを追加します。
Imageはロボにリネームして、スプライトに一枚目のロボをアタッチします。
ロボをクリックしてAnimationウィンドウを開きます。
3枚のスプライトを選択して、タイムライン上にアタッチします。
アタッチするとスプライトがタイムライン上に表示されます。
スプライトに連動するkeyをドラッグすると任意の秒数に移動させる事ができます。
足の踏みかえを表現したいので、
1枚目と3枚目のスプライトを追加でアタッチして、
スクショのように配置します。
スプライトの間隔は、一動作0:20秒で設定しています。
この機能は、Imageコンポーネントのスプライトを
タイムラインで指定した時間に、アタッチしたスプライトに
自動的に差し替えをしてくれる便利なものです。
これを再生すると
再生できない場合、ダウンロードは🎥こちら
タイムラインのスプライトの間隔を広げれば、ゆっくりした動きに
狭ければ早い動きになります。
アクション系の動作などには、必要不可欠かと思います。
移動のアニメーションは、座標が固定されるので使いにくいのですが、
スプライトの差し替えは、移動中のオブジェクト上で再生されるので、
動作のアニメーションは重宝します。
他にも設定はできるのですが、説明してると終わらないので、
基本的な使い方は、これくらいにしておきます。
次回は、複数の動作Animationクリップを作成して、
条件にあわせて切り替える事をまとめたいと思います。
(o・・o)/~マタネェ
この記事へのコメント