[Unity] 인트로 로딩 씬 만들기

프로그램을 시작할 때 프로그램 이름이나 제작자 등을 표시하기 위한 인트로 로딩 씬을 만들어 보았다.

 

1. Intro 씬과 Main 씬을 만든다.

  - Intro 씬에서 프로그램이 실행되면 원하는 시간동안 로딩이 진행된 후 자동으로 Main 씬으로 넘어가도록 할 것이다.

  - 나중에 Main 씬임을 알아볼 수 있도록 아무 이미지나 올려두자.

 

Main 씬임을 알기 쉽도록 아무 이미지나 올려두었다.

 

2. Intro 씬에서 UI > Canvas를 추가한다.

 

3. Canvas에 배경이 될 Panel을 올린다.

 

4. Panel에 Image나 Text(TMP)를 올린다.

 

여기까지 진행한 결과는 다음과 같다.

 

Image와 Text(TMP)가 차례로 나타났다가 사라지도록 하기 위해서 겹치게 배치했다.

 

5. IntroManager라는 C# 스크립트 파일을 하나 만든다.

---

using UnityEngine;
using UnityEngine.UI;
using TMPro;
using System.Collections;
using UnityEngine.SceneManagement;

public class IntroManager : MonoBehaviour
{
    // can ignore the update, it's just to make the coroutines get called for example

    [SerializeField] Image image = null;
    [SerializeField] TextMeshProUGUI text = null;

    void Start()
    {
        StartCoroutine(FadeTextToFullAlpha(1.5f, image, text));
    }

    void Update()
    {
    }

    public IEnumerator FadeTextToFullAlpha(float t, Image i, TextMeshProUGUI j)
    {
        i.color = new Color(i.color.r, i.color.g, i.color.b, 0);
        j.color = new Color(j.color.r, j.color.g, j.color.b, 0);

        while (i.color.a < 1.0f)
        {
            i.color = new Color(i.color.r, i.color.g, i.color.b, i.color.a + (Time.deltaTime / t));
            yield return null;
        }
        i.color = new Color(i.color.r, i.color.g, i.color.b, 1);
        while (i.color.a > 0.0f)
        {
            i.color = new Color(i.color.r, i.color.g, i.color.b, i.color.a - (Time.deltaTime / t));
            yield return null;
        }
        
        while (j.color.a < 1.0f)
        {
            j.color = new Color(j.color.r, j.color.g, j.color.b, j.color.a + (Time.deltaTime / t));
            yield return null;
        }
        j.color = new Color(j.color.r, j.color.g, j.color.b, 1);
        while (j.color.a > 0.0f)
        {
            j.color = new Color(j.color.r, j.color.g, j.color.b, j.color.a - (Time.deltaTime / t));
            yield return null;
        }

        SceneManager.LoadScene("Main");
    }

}

 

- 변수 t는 이미지나 텍스트가 나타나거나 사라지는 데 소요되는 시간을 의미한다. 즉, Image i가 1.5초동안 천천히 나타났다가 1.5초동안 천천히 사라지고, 이후 Text(TMP) j가 1.5초동안 천천히 나타났다가 1.5초동안 천천히 사라진다.

- 이미지나 텍스트의 r, g, b 값은 그대로 두고, 투명도를 의미하는 a값을 0에서 1까지 증가시켰다가 1에서 0까지 감소시키는 방식으로 나타남과 사라짐을 구현하였다.

---

 

6. Create Empty 버튼을 이용해 IntroManager라는 빈 오브젝트를 생성한 후 IntroManager 스크립트를 적용한다.

 

7. Inspector에서 Image 칸과 Text 칸에 아까 Panel에 올려두었던 Image와 Text(TMP)를 적용한다.

 

여기까지 진행한 결과는 다음과 같다.

 

우측 inspector에서 Image와 Text(TMP)가 적용된 것을 볼 수 있다.

 

8. 실행 전에, File > Build Settings에서 실행할 모든 씬을 Scenes In Build에 추가해야 한다.

  - 그냥 마우스로 드래그하면 된다.

 

Intro 씬과 Main 씬을 끌어다 넣고 창을 닫으면 된다.

 

9. 실행한다!

 

Image가 나타났다가 사라지고, Text(TMP)가 나타났다 사라진 후 Main 씬으로 넘어가는 것을 확인할 수 있다.

 

 

끝!! 다음시간에는 로딩 진행 현황을 보여주는 프로그레스바도 추가해보자~!~!!