유니티

페이드인 이펙트

파란색까마귀 2022. 2. 15. 09:49

2016. 12. 8. 18:08

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
using UnityEngine;
using System.Collections;
 
public class FadeInEffect : MonoBehaviour {
    
    //걸리는 시간(초)
    public float m_ElapsedTime = 1.0f;
 
    void OnEnable()
    {
        this.GetComponentInChildren<CanvasGroup>().alpha = 0;
        StartCoroutine("SetActiveFadeIn");
    }
 
    IEnumerator SetActiveFadeIn()
    {
        float timer = 0;
        float alphaVar = this.GetComponentInChildren<CanvasGroup>().alpha;
        while (alphaVar < 1)
        {
            timer += Time.deltaTime / m_ElapsedTime;
            alphaVar = Mathf.Lerp(01, timer);
            this.GetComponentInChildren<CanvasGroup>().alpha = alphaVar;
            yield return null;
        }
    }
 
    void OnDisable()
    {
        this.GetComponentInChildren<CanvasGroup>().alpha = 0;
    }
 
 
    public bool isEffactEnd()
    {
        if (this.GetComponentInChildren<CanvasGroup>().alpha >= 1)
        {
            return true;
        }
        else
        {
            return false;
        }
    }
 
}
 
cs

 

ㅇㅇㅇ

유니티 UI인 canvas에서 canvas내에 모든 오브젝트들의 alpha값을 관리해주는

'CanvasGroup'를 조절하는 스크립트다

 

사용법은 페이드인(점점 나타나는 효과)를 주고싶은 오브젝트에 해당 스크립트를 넣어주고,

canvasGroup스크립트(유니티 기본제공)을 붙여주면 된다

 

그러면 해당 오브젝트가 활성화될때마다 페이드인 효과와 함께 켜진다

 

핵심은 두가지다

void OnEnable()
    {
        this.GetComponentInChildren<CanvasGroup>().alpha = 0;
        StartCoroutine("SetActiveFadeIn");
    }
 void OnDisable()
    {
        this.GetComponentInChildren<CanvasGroup>().alpha = 0;
    }

 

각각 오브젝트가 활성화될때, 비활성화 될때 동작하는 기본함수다

 

해당 오브젝트가 활성화될때 오브젝트의 canvasgroup의 alpha값을 0으로 바꿔준뒤,

코루틴을 사용해서 아래의 함수를 alpha값이 1이 될때까지 Math.Lerp를 이용해서 돌려준다

 

 while (alphaVar < 1)
        {
            timer += Time.deltaTime / m_ElapsedTime;
            alphaVar = Mathf.Lerp(01, timer);
            this.GetComponentInChildren<CanvasGroup>().alpha = alphaVar;
            yield return null;
        }

그리고 alpha가 1이되서 완전히 선명해지면 끝

 

 

 

728x90