[Unity] 유니티 2D UI Canvas 타겟으로 VideoPlayer 사용

오디오와 마찬가지로 유니티에서 비디오를 재생하는 간단한 방법이 추가되었다. VideoPlayer가 그것인데 이것을 이용해 여러 비디오 파일을 플랫폼 독립적으로 재생할 수 있다. VideoPlayer를 사용하는 방법에 대해서는 유니티 공식 문서나 다른 웹문서들에서 쉽게 찾아볼 수 있다.

 

대부분 문서의 경우 3D 오브젝트의 표면에 비디오를 출력하는 상황을 설명한다. 그런데 내 경우에는 2D앱을 만드는 중이라 2D Canvas 위에 비디오를 출력해야 했다. 나와 같은 고민을 하는 사람들을 위해 방법을 남겨본다.

 

방법의 핵심은 UI Canvas 위에 RawImage 형태의 오브젝트를 만들고, 이 오브젝트의 texture를 VideoPlayer의 타겟으로 만드는 것이다. 지금부터 간단한 예제를 통해 방법을 설명하도록 하겠다.

 

RawImage and VideoPlayer

먼저 Scene의 Canvas 밑에 스크린으로 사용할 RawImage 오브젝트를 만들고, 또 비디오 재생에 사용할 Video Player도 추가한다.

 

Scene Hierarchy

 

Screen은 RawImage 형태로 그 속성을 보면 다음과 같다.

 

Screen (RawImage)

MainVideoPlayer의 속성은 다음과 같다.

 

VideoPlayer

 

중요한 점은 Render Mode를 API Only로 설정하는 것이다. 이 모드를 설정한 후 스크립트에서 비디오 출력 방향을 RawImage의 texture로 설정할 것이다.

 

다른 모드에 대해 잠시 설명하면 Material Override는 많은 예제에서처럼 3D오브젝트에 출력할 용도로 사용되고, RenderTexture는 타겟 텍스쳐로 출력할 용도로 쓰인다. Camera의 경우 카메라에 바로 출력한다.

 

비디오 클립은 에셋에 추가한 sample.mp4 파일을 사용하고 있다.

 

Scripting

이제 마지막으로 스크립트를 작성할 차례이다. VideoHandler로 이름 지은 스크립트에는 2개의 public 변수를 두었는데, 각각 RawImage mScreen과  VideoPlayer mVideoPlayer이다. 다음과 같이 Inspector에서 지정해 준다.

 

VideoHandler Script

VideoHandler 스크립트의 내용은 다음과 같다.

 

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.Video;

public class VideoHandler : MonoBehaviour
{
    public RawImage mScreen = null;
    public VideoPlayer mVideoPlayer = null;

    void Start()
    {
        if (mScreen != null && mVideoPlayer != null)
        {
            // 비디오 준비 코루틴 호출
            StartCoroutine(PrepareVideo());
        }
    }

    protected IEnumerator PrepareVideo()
    {
        // 비디오 준비
        mVideoPlayer.Prepare();

        // 비디오가 준비되는 것을 기다림
        while (!mVideoPlayer.isPrepared)
        {
            yield return new WaitForSeconds(0.5f);
        }

        // VideoPlayer의 출력 texture를 RawImage의 texture로 설정한다
        mScreen.texture = mVideoPlayer.texture;
    }

    public void PlayVideo()
    {
        if (mVideoPlayer != null && mVideoPlayer.isPrepared)
        {
            // 비디오 재생
            mVideoPlayer.Play();
        }
    }

    public void StopVideo()
    {
        if (mVideoPlayer != null && mVideoPlayer.isPrepared)
        {
            // 비디오 멈춤
            mVideoPlayer.Stop();
        }
    }
}

 

위 소스는 일반적인 VideoPlayer 예제와 동일하며, 다만 설명의 편의를 위해 재생 속도, 반복여부, 오디오 재생 방향 등 옵션을 설정하는 부분은 생략했다.

 

여기서 중요하게 볼 부분은 VideoPlayer의 Texture를 RawImage로 변경하는 부분이 핵심이다.

 

나머지 부분에서 PlayVideo()를 통해 비디오가 재생되고, StopVideo()을 통해 멈출 수 있다. 각 함수를 버튼과 같은 컨트롤에서 호출하게 하면 비디오 플레이어가 완성된다.


Fin.