[Unity / 2D] 물줄기 애니메이션

화이팅!·2025년 6월 4일

Unity 눈물..수도꼭지 애니메이션 에이스프라이트 유니티 친절 퀸가비

Unity

목록 보기

4/8

안녕하세요? 오늘은 유니티 2D 수도꼭지 물줄기 애니메이션을 구현해보도록 하겠습니다.

정확히 말하자면 플레이어가 수도꼭지에 다가가 상호작용을 했을 때 (제 경우에는 스페이스를 눌렀을 때) 물줄기가 흐르는 애니메이션이 재생되는 것을 구현하는 것입니다.

혹시 따라하다가 안된다거나 궁금한 점이 있으시면 언제든지 댓글 남겨주세요.
부족한 지식으로나마 의견 보태겠습니다.

크게 세 단계로 나누어 설명하겠습니다.

1. sprite sheet 설정하기

2. 애니메이션 클립 만들기

3. 코드 작성해서 할당하기

1. sprite sheet 설정하기

애니메이션을 만들려면 그림이 필요하겠죠?
스프라이트를 먼저 구합니다.

한 png 이미지에 한꺼번에 애니메이션 클립에 들어갈 이미지가 있어야 합니다.

저는 가내수공업이기 때문에 직접 aseprite로 찍어주었습니다.
세 개의 이미지를 12312312312312... 이런 식으로 연속 재생하며 물이 흐르는 효과를 구현할 것입니다.

대충 본인이 제작하고 있는 해상도에 맞게 설정한 뒤 Inspector > Open Sprite Editor를 통해 스프라이트 에디터를 켜줍니다.

위에 Slice를 통해 각 이미지를 잘라주고 Apply 버튼을 누릅니다.
저는 단순한 이미지라 Automatic으로 해도 잘 적용돼서 그렇게 잘라주었는데, 각자 상황에 맞게 적절하게 잘라주세요.

2. 애니메이션 클립 만들기

1단계를 마치면 이렇게 n개의 이미지(저는 3개)로 잘려져 있습니다.

이렇게 Shift 버튼을 누른 채로 함께 선택한 뒤 Scene 창에 드롭해줍니다.

그러면 Unity가 "애니메이션 만들래?"라고 물어보는데 원하는 폴더에 원하는 이름으로 저장을 해주면 되고요.
자동으로 Animator Controller도 생성됩니다.

Animator 컴포넌트가 자동으로 연결된 게임 오브젝트가 생성된 것을 Hierachy 창에서 확인할 수 있습니다.

속도 조절이 필요하다면 Samples 수치를 조절해줍니다. 저는 12로 기본 설정되어 있었는데 너무 빨라서 6으로 재설정해주었습니다.

속도에 대한 자세한 설명이 필요하다면 댓글주세요.

3. 코드 작성해서 할당하기

이제 애니메이션이 재생되는 게임 오브젝트는 생성이 되었는데,
더 나아가 수도꼭지로 물을 트는 것처럼 다가가 특정 버튼을 누르면 물줄기가 활성화되고 비활성화되도록 만들어 봅시다.

using UnityEngine;

public class WaterManager : MonoBehaviour
{
    public GameObject water;
    private bool isPlayerInRange = false;
    private bool isFlowing = false;
    public PlayerController playerController;

    void Start()
    {
        water.gameObject.SetActive(isFlowing);
    }


    void Update()
    {
        if (isPlayerInRange && Input.GetKeyDown(KeyCode.Space))
        {
            isFlowing = !isFlowing;
            water.gameObject.SetActive(isFlowing);
        }
    }

    void OnTriggerEnter2D(Collider2D other)
    {
        if (other.CompareTag("Player")) isPlayerInRange = true;
    }

    void OnTriggerExit2D(Collider2D other)
    {
        if (other.CompareTag("Player")) isPlayerInRange = false;
    }
}

WaterManager.cs 스크립트입니다.

저는 유니티 개발을 할 때 별거에 다 Manager을 붙여서 스크립트와 빈 게임 오브젝트를 생성하는데 그럴 때마다 ✨퀸가비 유니버스에 와있는 것 같아서 즐겁습니다. 💅👙🥵

이번엔 워럴매니졀인 거죠.

하나씩 친절하게 설명을 해볼게요.

◽️ water
➡️ 끄고 켤 물줄기 게임 오브젝트 할당합니다. (지금까지 만든 애니메이션)

◽️ PlayerController playerController, isPlayerInRange = false
➡️ 플레이어가 수도꼭지 근처에 와있냐, 떨어져 있냐를 판단하기 위한 변수들 입니다. playerController에는 플레이어를 할당합니다.

◽️ isFlowing = false
➡️ 물줄기가 지금 흐르고 있는지를 판단합니다. false 상태인데 수도꼭지 근처에서 버튼을 누른다, 이러면 물이 흐르는 게임 오브젝트를 활성화하고 isFlowing을 true 상태로 바꿔야 겠죠. true 상태에서 같은 상호작용을 하면 반대로 해주고요.

◽️ void Start()
➡️ Start()를 폭력적이고 쉽고 틀리게 설명을 하자면 처음에 한 번 실행이 되는 함수입니다.
저는 처음에 애니메이션이 비활성화되어 있길 원해서 블록 안에 게임 오브젝트를 비활성화하는 코드를 삽입하였습니다.

◽️ void Update(){}
➡️ Update()는 프레임 단위로 실행이 됩니다. 플레이어가 수도꼭지의 범위 안에 들어왔는지 안 들어왔는지는 계속해서 프레임 단위로 검사되어야 하므로 Update 블록 안에 작성을 해야 합니다. 이해되시죠?

if (isPlayerInRange && Input.GetKeyDown(KeyCode.Space))
플레이어가 수도꼭지 범위 안에 있고, 스페이스 버튼을 눌렀을 때,
isFlowing = !isFlowing;
isFlowing의 bool값을 반전시키고,
water.gameObject.SetActive(isFlowing);
water 게임 오브젝트의 활성화/비활성화를 구현합니다.
isFlowing == true면 활성화되고 false면 비활성화되는 것이죠.

◽️ void OnTriggerEnter2D(Collider2D other), void OnTriggerExit2D(Collider2D other)
➡️ 플레이어가 Trigger 범위 안에 들어왔는지 나갔는지 판단하여 isPlayerInRange의 bool값을 변경하는 블록들입니다.

이해가 잘 되시나요? 안되시면 댓글 주세요.ㅜ챗지피티한테 물어보고 친절하게 답변드리겠습니다.

스크립트가 완성되었다면 이제 워럴매니졀을 생성하고 위 스크립트를 붙입니다.