日々是好日~every day is a good day~

日常の中の非日常の備忘録

【Unity】カウントダウンを表示

前回までに2種類のオブジェクトを回転させる方法をアップしました
カードめくる(Y軸を中心に回転)
everydayisagoodday.hatenadiary.com
ルーレットをまわす(Z軸を中心に回転)
everydayisagoodday.hatenadiary.com
なのでもう一つX軸を中心にオブジェクトを回転させる例としてカウントダウン表示を作ってみます
1.画像を準備

ちなみにこの画像は『ぴよたそ』さんの画像を使わせて頂いてます
hiyokoyarou.com
2.ヒエラルキーの+をクリックし空のオブジェクトを作成

3.インスペクターの位置X Y Zは0にしておく
次にコンポーネントを追加をクリックし検索にSpと入力する候補が表示されるのでSprite Rendererを選択

4.Sprite Rendererのスプライトに3をドラッグ&ドロップ
オブジェクトのスケールはX Yとも0.5にする

5.プロジェクトタブにカーソルを持っていき右クリックでCountDownDispというスクリプトを作成

6.CountDownDispを編集

using System.Collections;
using System.Collections.Generic;
using System;
using System.Threading.Tasks;
using UnityEngine;

public class CountDownDisp : MonoBehaviour
{
    [SerializeField] float speed = 140f;
    [SerializeField] Sprite[] sprites;
    
    private bool isStart = false;
    Vector3 angle;

    private void Start()
    {
        angle = this.transform.eulerAngles;
    }
    async void Wait()
    {
        await Task.Delay(1000);
        isStart = true;
    }

    void Update()
    {
        if (Input.GetKeyDown(KeyCode.Space) && !isStart)   //スタート
        {
            GetComponent<SpriteRenderer>().sprite = sprites[0];   //3
            angle.x = 0;
            transform.eulerAngles = angle;
            Wait();
        }
        
        if (isStart)   //回転
        {
            angle.x += Time.deltaTime * speed;
            if (angle.x > 540f)
            {
                angle.x = 540f;
                isStart = false;
            }
            else if (angle.x > 450f)
            {
                GetComponent<SpriteRenderer>().sprite = sprites[3];   //OK
                angle.y = 180f;
                angle.z = 180f;
            }
            else if (angle.x > 270f)
            {
                GetComponent<SpriteRenderer>().sprite = sprites[2];   //1
                angle.y = 0;
                angle.z = 0f;
            }
            else if (angle.x > 90f)
            {
                GetComponent<SpriteRenderer>().sprite = sprites[1];   //2
                angle.y = 180f;
                angle.z = 180f;
            }
            transform.eulerAngles = angle;
        }
    }
}

7.CountDownDispをコンポーネントを追加にドラッグ&ドロップ

8.スクリプト内のSpritesの数を4に設定し要素の欄にそれぞれの画像をドラッグ&ドロップ

これで実行しスペースキーを押すとカウントダウンが表示されます

ただオブジェクトを回転させてるだけですがどの軸を中心に回転させるかによって印象が全然違いますね