2024. 11. 20. 09:52ㆍ카테고리 없음
화면(씬) 전환 시 자연스럽게 암전 효과 넣는 순서
1. Canvas를 SceneManager로 만들고 MySceneManager 스크립트를 만들어서 붙여줬다.
1-1 Sort Order값을 다른 오브젝트보다 위로 둬야 한다.(나는 1로 설정해도 맨앞에 있어서 1로 설정했다.)
2. 자식으로 UI이미지를 FadeImg로 만들고 이미지의 크기를 정해준다.(나는 화면을 꽉 채울거라서 앵커를 화면전체로 해놨다.)
2-1. Image에 씬이 넘어갈때 화면에 띄웠으면 좋겠는 색으로 설정하면 된다.
2-2. Canvas Group를 만들어서 해당 사진과 같이 설정했다.
(Canvas Group은 투명도(Alpha)뿐만 아니라 Raycast 제어 기능도 제공하는 중요한 역할을 한다.이를 통해 blocksRaycasts 값을 설정하여 UI 요소들이 사용자의 입력을 차단하거나 허용할 수 있다. 즉, 화면을 덮는 검정색 배경을 만들 때, 사용자가 클릭하거나 터치할 수 없도록 할 수 있다.)
(Canvas Group에서 Alpha(투명도)에 값을 1로 만들면 화면이 검정색으로 바뀐다.)
이제 스크립트 작성 차례이다.
3. MySceneManager를 싱글톤으로 만들고 DOTween을 사용해서 화면을 까맣게 만든다.
(Canvas Group을 통해서(Alhpa) 화면을 점점 검정색으로 바꿔줄 수 있지만 DOTween을 사용하면 화면을 부드럽게 검정색으로 바꿀 수 있어서 사용한다.)
코드 ( 씬이 넘어갈떄 화면을 까맣게 만들기)
public class MySceneManager : MonoSingleton<MySceneManager>
{
public CanvasGroup fadeImg;
private float fadeTime = 2;
public void ChangeScene()
{
fadeImg.DOFade(1, fadeTime)
.OnStart(() =>
{
fadeImg.blocksRaycasts = true;
})
.OnComplete(() =>
{
//로딩화면 띄우며, 씬 로드 시작
});
}
}코드 설명
fadeImg.DOFade(1, fadeTime) :
- DOFade()는 CanvasGroup의 alpha 값을 일정 시간 동안 변화시키는 애니메이션을 생성한다. 이 메서드를 사용하면 페이드 인/페이드 아웃 효과를 부드럽게 만들 수 있다.
- 앞에는 alpha의 값을 뭘로 변화시킬건지 작성하는 곳이고(나는 1로 설정), 변화시킬때 걸리는 시간을 뒤에 작성한다.
.OnStart(() => : 애니메이션이 시작할 때 호출된다.
.OnComplete(() => 애니메이션이 끝났을 때 호출된다.
fadeImg.blocksRaycasts = true; : 페이드 효과 중에는 사용자 입력을 차단하여 다른 UI 요소에 방해받지 않도록 한다.
효과가 끝나면 false로 바꿔줘야 한다.
( 위에 코드만 작성하면 씬이 넘어갈떄 화면을 까맣게 만들고 다음씬에 가서도 화면은 까맣게 나온다. 그래서 밑에서 까맣게 나온화면을 다시 되돌리는 코드도 추가해 줘야한다. )
4. 화면 원래대로 되돌리는 코드
코드
public class MySceneManager : MonoSingleton<MySceneManager>
{
public CanvasGroup fadeImg;
private float fadeTime = 0.7f;
private void Start()
{
SceneManager.sceneLoaded += OnSceneLoaded;
}
private void OnDestroy()
{
SceneManager.sceneLoaded -= OnSceneLoaded;
}
private void OnSceneLoaded(Scene arg0, LoadSceneMode arg1)
{
fadeImg.DOFade(0, fadeTime)
.OnStart(() => fadeImg.blocksRaycasts = false);
}
public void ChangeScene(SceneType sceneType)
{
fadeImg.DOFade(1, fadeTime)
.OnStart(() =>
{
fadeImg.blocksRaycasts = true;
})
.OnComplete(() =>
{
GameManager.Instance.LoadScene(sceneType);
});
}
}코드 설명
SceneManager.sceneLoaded += OnSceneLoaded; :
유니티가 제공하는 SceneManagement에서는 씬이 로드되었을 때 sceneLoaded라는 이벤트를 발생시키기 때문에, 이 이벤트에 함수를 연결해서 씬이 시작되는 타이밍에 함수를 실행 시킬 수 있다. 이벤트 추가, 해제 부분을 잊지말고 꼭 추가해야한다.
private void OnDestroy()
{
SceneManager.sceneLoaded -= OnSceneLoaded;
} :
OnDestroy는 게임 오브젝트가 파괴될 때 호출되는 이벤트 함수로서 씬이 넘어가면서 오브젝트가 파괴가 될떄 해당 함수가 호출이 된다.
여기서 이벤트를 뺴줘야하는 이유는 더 이상 존재하지 않는 오브젝트의 메서드를 호출하려고 하면 메모리 누수나 null 참조 오류가 발생할 수 있기 떄문이다.
위에 코드처럼 작성하면 화면이 까매졌다 환해지는거를 볼 수 있다.
여기서 화면에 까매졌을때 오브젝트랑 이미지를 넣어서 퍼센트가 100%되면 씬이 넘어가게도 만들 수 있다.
밑에 링크를 참조해서 보면 좋겠다.
https://m.blog.naver.com/dooya-log/221761884409