おしぼりエンジニアブログ

おしぼり会社のボンボンがエンジニアで頑張っているお話

【Unity】iTweenの使い方 / お試し【入門】

iTween Unity

みなさん、こんにちは。

初めての記事は【iTween】というAssetを紹介していこうと思います。

iTweenはアニメーション全般が出来る、とても便利なAssetです。

早速、ダウンロードして使ってみましょう！

iTweenのAssetページはこちらです。

(今回は C#で書いていきます)

 

準備

確認用のプロジェクトを作り、iTweenをインポートしてください。

入れるのはiTween.csのみで大丈夫です！

そして、Hierarchyで右クリックをし、 GameObject->Cube を１つ生成します。

 次に、Cubeというスクリプトを作ってCubeにアタッチしてみましょう！

このキューブでアニメーションを試していきたいと思います。

ここで一度プロジェクトを保存しておきましょう。

（私は Assets/Scenes に Main  という名前で保存しました）
f:id:doggy_dog:20160208001603p:plain

使ってみる

早速、Cube.csに処理を書いていきたいと思います！
gist.github.com

上記のコードをCubeに書くと、このような動きになります。
「あれ？これだけのソースコードでこんな動きできるの！？」と思った方も少なくないかと思います。
これがiTweenの力です...。
https://i.gyazo.com/b750728c8cea33088de8f8dc782cd4ed.gif

iTween説明

では、先ほどのソースコードで何をやってるか説明していきたいと思います。
(この他にもありますが、今回は先ほどで使ったもののみの説明です)

iTween.MoveTo の引数1

iTween.MoveTo( ここ, iTween.Hash( "x", 1f ) );

動かす対象のオブジェクトを指定する引数です。
他のオブジェクトの参照を持ってきてここに指定し、動かしてあげることもできます。

iTween.MoveTo の引数2

iTween.MoveTo( this.gameObject, ここ );

どういった動きにするかを指定する引数です。

パターン１の様に、Hashテーブルを先に作っておき、後から登録するという方法もありますし、
iTween.Hashのようにパターン２で使っていたような書き方もできます。

パターン１

var moveHash = new Hashtable();
moveHash.Add ("x", 1f);
iTween.MoveTo( this.gameObject, moveHash );

パターン２

iTween.MoveTo( this.gameObject, iTween.Hash("x", 1f) ) );

私はいつもパターン２の書き方を使っています。
見易さで言えばパターン１な気もしますね。

上記はiTween.MoveToとなっておりますが、MoveToは気にしないでください。
今回のソースコードで使っているため、例としてあげています。

x・y・z

moveHash.Add ("x", 1f);
moveHash.Add ("y", 1f);
moveHash.Add ("z", 1f);

それぞれ、どの方向に力を加えるかを決められます。
引数２はどれだけ力を加えるか指定してあげます。

position

moveHash.Add ("position", new Vector3(0f, 0f, 0f));

x・y・zと同じ用途で使えます。
ポジションを２つ以上動かすのであれば、こちらの方が綺麗かもしれませんね。

time

moveHash.Add ("time", 2f);

アニメーション完了までの時間を指定できます。
また、timeが追加されていない場合は１秒でアニメーションが完了します。

delay

moveHash.Add ("delay", 1f);

アニメーションの開始時間を指定出来ます。

easetype

moveHash.Add ("easetype","easeInOutBack");

アニメーションに緩急をつけることができます。
(例えば、値をちょっとずつ加速するようにしたり、一気に減速するようにしたり...等)
色々な種類があるので、こちらのサイトを参考にするといいと思います。
easing_demo
また、上記のような書き方もあれば、iTweenクラスのものを使用した書き方もあります。

moveHash.Add ("easetype", iTween.easeType.easeInOutBack);

oncompletetarget

moveHash.Add ("oncompletetarget", this.gameObject);

アニメーションが終わった後に呼ぶメソッドを受け取るオブジェクトを指定してあげます。

oncomplete

moveHash.Add ("oncomplete", "AnimationEnd");

アニメーションが終わった後に呼ぶメソッド名を指定してあげます。
これを使う場合はoncompletetargetを指定してあげないと呼ばれないので注意です。

loopType

moveHash.Add ("loopType", "loop");

iTweenで指定した動きをループさせることができます。タイプは３つあります。

  • none : ループしない(このHashを入れない場合、これになります)
  • loop : ループさせる
  • pingPong : 往復アニメーションさせる。

まとめ

iTweenの実装はいかがでしたか？
UnityのAnimationも優秀なので事は足りますが、iTweenを使って拡張したスクリプトなども出来ますので、使い方を覚えて損はないと思います。
私もまだまだ、修行中の身なので一緒に覚えていきましょう！

また、MoveTo / RotateTo / ScaleTo 等のアニメーションメソッドについて今回は触れなかったので、次回のiTween記事に書こうと思います。

続きがこちら⇩
doggy.hatenablog.com

腐りかけたエンジニアがブログを始めました

趣味

こんにちは！初めまして、Doggyと申します。

去年からとある会社に入社したのですが、学生時代からの遊び呆け癖が治らず、2015年はほとんど勉強せず、遊んで終わってしまったのです・・・。 

このままでは腐ったエンジニアで人生が終わってしまうと不安になってきました。

そこで、今年はUnityを本格的に始めることにしました！

またそれに伴い、ブログも始めてみることに。

技術力は乏しいですが、ブログの内容としては

  • Unityで勉強した内容
  • Unityの実装方法
  • ゲームアルゴリズム
  • 趣味(ゲームや音楽...etc)

大体、こんな感じの内容を書いていこうと思っております。

ブログ自体初めてなので、見にくかったりすると思いますが、よろしくお願い致します！