【Unity】アイテム取得時の拡大アニメーションを作成してみた

脱出ゲームでアイテムをゲットした時にアイテムが拡大されるアニメーションを作ってみました。

方法としては、

  1. 透明のImageをUIに配置しておく
  2. クリックされたらアイテムの画像をImageに表示してiTweenで拡大する
  3. 拡大アニメーションが終わったら再度透明にする(Imageは縮小して元に戻す)

と言う方法でやっています。

Imageの透明・不透明の設定はColorを使って4番目の引数を0(透明)、1(表示する)で切り替えることにしました。

ImageをsetActiveで非表示にすることもできたんですけど、Findで探すことができなくなるので都合が悪く。

今回は透明・不透明の切り替えで対応しました。

    private void showImage()
    {
        // 1fで不透明にする。
        gameObject.GetComponent<Image>().color = new Color(1f,1f,1f,1f);
    }

拡大アニメーションについてはiTweenのScaleToを使っています。

    void GetItemAnimation(Item item)
    {
        showImage();
        gameObject.GetComponent<Image>().sprite = item.image;
        iTween.ScaleTo(gameObject,
            iTween.Hash(
            "x", 5,
            "y", 5,
            "time", 3f,
            "oncomplete", "itemset",
            "oncompleteparams", item
            )
            );
    }

3秒かけて縦横のスケールを5倍にし、アニメーションが終わったら、itemを引数にしてitemset関数を呼び出し、アイテムボックスの更新を行なっています。

ただしこのやり方だと、透明画像の部分がクリックできなくなるので注意が必要です。

おわり。

ABOUTこの記事をかいた人

個人アプリ開発者。Python、Swift、Unityのことを発信します。月間2.5万PVブログ運営。 Twitter:@yamagablog