Unity Input Field 이벤트 완벽 정복: On Value Changed, On End Edit, On Select, On Deselect 비교 분석 및 활용법

Unity Input Field 이벤트 완벽 정복: On Value Changed, On End Edit, On Select, On Deselect 비교 분석 및 활용법

 

서론: 모든 상호작용의 시작, 유저 입력

게임이나 애플리케이션 개발에서 유저의 입력을 받는 UI(사용자 인터페이스)는 가장 기본적이면서도 핵심적인 기능입니다. Unity(유니티)에서는 이러한 텍스트 입력을 처리하기 위해 강력한 입력 필드(Input Field) 컴포넌트를 제공합니다. 대부분의 개발자가 입력 필드를 사용하는 것 자체는 어렵지 않게 생각하지만, 유저의 입력 시점에 따라 정교한 상호작용을 구현하려고 할 때 작은 혼란에 빠지곤 합니다. 바로 On Value Changed, On End Edit, On Select, On Deselect라는 네 가지 이벤트 때문입니다.

이 이벤트들은 이름만 보면 비슷해 보이지만, 실행되는 시점과 목적이 명확히 다릅니다. 이 차이를 정확히 이해하고 활용하는 것만으로도 유저 경험(UX)을 극적으로 향상시킬 수 있습니다. 이번 포스팅에서는 Unity Input Field의 네 가지 핵심 이벤트를 심층적으로 비교 분석하고, 각각의 명확한 활용 사례와 C# 스크립트 예제까지 완벽하게 정리해 드리겠습니다.

 

1. On Value Changed (String) - 실시간 변화의 감시자

On Value Changed 이벤트는 이름 그대로 입력 필드의 값이 변경될 때마다 실시간으로 호출됩니다. 사용자가 키보드로 글자를 한 자 입력하거나, 백스페이스로 지우거나, 텍스트를 복사해서 붙여넣는 등, 현재 입력된 문자열에 아주 작은 변화라도 생기면 즉시 실행됩니다.

• 핵심 실행 시점: 텍스트 값(string)이 변경되는 모든 순간.
• 전달되는 값: 변경된 후의 현재 텍스트 전체.

주요 활용 사례

이 이벤트의 '실시간'이라는 특징 덕분에 즉각적인 피드백이 필요한 기능에 매우 유용합니다.

1. 실시간 검색 기능: 온라인 게임의 상점이나 인벤토리에서 아이템을 검색할 때, 유저가 '물'이라고 입력하는 순간 '체력 물약', '마나 물약' 등 '물'이 포함된 아이템 목록을 바로 보여주는 기능을 구현할 수 있습니다. 서버 부하를 고려해야 하지만, 클라이언트 내 데이터 검색 시 최고의 사용자 경험을 제공합니다.
2. 입력 글자 수 실시간 표시: 닉네임 생성 시 '7/10자'와 같이 실시간으로 글자 수를 표시하여 유저가 제한을 넘지 않도록 안내할 수 있습니다.
3. 욕설 필터링: 채팅 입력 시 부적절한 단어가 포함되면 입력과 동시에 경고를 주거나 해당 단어를 '*'로 치환하는 기능을 구현할 때 사용됩니다.

주의할 점

On Value Changed는 매우 빈번하게 호출될 수 있습니다. 만약 이 이벤트에 연결된 함수가 무거운 연산(예: 복잡한 데이터베이스 조회, 과도한 물리 연산)을 포함하고 있다면, 글자 하나를 입력할 때마다 앱 전체의 성능 저하를 유발할 수 있으므로 가벼운 로직 위주로 구성해야 합니다.

2. On End Edit (String) - 입력 완료의 마침표

On End Edit 이벤트는 유저가 텍스트 입력을 완전히 마쳤다고 판단되는 시점에 단 한 번 호출됩니다. Unity는 이 '완료' 시점을 두 가지 기준으로 판단합니다.

1. 입력 필드가 활성화된 상태에서 'Enter' 키를 눌렀을 때.
2. 입력 필드 바깥의 다른 UI 요소를 클릭하여 입력 필드의 포커스(Focus)를 잃었을 때.

• 핵심 실행 시점: 입력 행위의 '완료' 시점.
• 전달되는 값: 편집이 완료된 시점의 최종 텍스트.

주요 활용 사례

이 이벤트는 유저의 입력 값을 최종적으로 '제출'하거나 '적용'하는 기능에 최적화되어 있습니다.

1. 로그인 및 회원가입: 아이디나 비밀번호를 모두 입력하고 Enter 키를 누르거나 로그인 버튼을 눌렀을 때(포커스를 잃을 때) 서버에 계정 정보 전송을 요청합니다.
2. 채팅 메시지 전송: 채팅 내용을 모두 작성하고 Enter 키를 눌러 메시지를 전송하는 기능은 On End Edit의 가장 대표적인 사용 예입니다.
3. 설정값 저장: 게임 옵션에서 그래픽 품질이나 볼륨 수치를 직접 숫자로 입력한 뒤, 다른 설정으로 넘어가기 위해 클릭하면 해당 값이 게임에 바로 적용되도록 할 수 있습니다.

3. On Select (String) & On Deselect (String) - 포커스의 시작과 끝

이 두 이벤트는 입력 내용 자체보다는 입력 필드의 상태 변화에 초점을 맞춥니다.

On Select (String): 입력의 시작

On Select 이벤트는 유저가 입력 필드를 마우스로 클릭하거나 탭하여 활성화하는 순간에 호출됩니다. 즉, 텍스트를 입력할 준비가 되어 커서가 깜빡이기 시작하는 바로 그 시점입니다.

• 핵심 실행 시점: 입력 필드가 포커스를 얻는 순간.
• 전달되는 값: 선택된 시점의 기존 텍스트.

On Deselect (String): 입력의 마무리

On Deselect 이벤트는 반대로, 활성화되어 있던 입력 필드가 포커스를 잃는 순간에 호출됩니다. On End Edit의 두 번째 조건(포커스를 잃었을 때)과 동일한 시점에 호출된다는 점이 중요합니다.

• 핵심 실행 시점: 입력 필드가 포커스를 잃는 순간.
• 전달되는 값: 포커스를 잃은 시점의 최종 텍스트.

주요 활용 사례

1. UI 시각적 피드백: On Select 시 입력 필드의 외곽선 색상을 바꾸거나 확대하여 유저에게 현재 어떤 필드를 편집 중인지 명확히 알려주고, On Deselect 시 원래 상태로 되돌립니다.
2. 가상 키보드 제어: 모바일 환경에서 On Select 시 가상 키보드를 화면에 띄우고, On Deselect 시 가상 키보드를 내리는 기능을 구현할 수 있습니다.
3. 입력값 유효성 검사 (Validation): On Deselect는 입력이 끝난 직후 유효성을 검사하기 좋은 시점입니다. 예를 들어, 이메일 주소 입력 필드에서 포커스가 벗어났을 때 입력된 텍스트가 올바른 이메일 형식인지 정규표현식으로 검사하여, 형식이 틀렸다면 경고 메시지를 띄워줄 수 있습니다.

4. C# 스크립트를 이용한 실전 예제

백문이 불여일견입니다. 아래 C# 스크립트를 통해 네 가지 이벤트가 실제로 어떻게 동작하는지 확인해 보겠습니다.

C#

 

using UnityEngine;
using UnityEngine.UI; // UI 관련 네임스페이스 추가

public class InputFieldEventManager : MonoBehaviour
{
    // 유니티 에디터에서 Input Field를 연결해줍니다.
    public InputField myInputField; 

    void Start()
    {
        if (myInputField != null)
        {
            // 각 이벤트에 리스너(실행할 함수)를 코드로 추가합니다.
            // 에디터에서 직접 연결하는 것과 동일한 효과입니다.
            myInputField.onValueChanged.AddListener(OnInputValueChanged);
            myInputField.onEndEdit.AddListener(OnInputEndEdit);
            
            // onSelect와 onDeselect는 InputField에서 직접적인 이벤트로 제공되지 않으므로,
            // EventTrigger 컴포넌트를 사용하거나 아래와 같이 별도 스크립트로 구현해야 합니다.
            // 여기서는 이해를 돕기 위해 에디터에서 연결했다고 가정하고 함수만 만듭니다.
        }
    }

    // On Value Changed 이벤트에 연결될 함수
    public void OnInputValueChanged(string text)
    {
        Debug.Log($"[OnValue Changed] 현재 입력 값: {text}");
    }

    // On End Edit 이벤트에 연결될 함수
    public void OnInputEndEdit(string text)
    {
        Debug.Log($"[OnEndEdit] 최종 입력 완료: {text}");
        // 여기서 로그인 요청, 메시지 전송 등의 로직을 처리합니다.
    }

    // On Select 이벤트에 연결될 함수 (에디터의 EventTrigger 사용)
    public void OnInputSelect(string text)
    {
        Debug.Log($"[OnSelect] 필드가 선택되었습니다. 초기 값: {text}");
    }

    // On Deselect 이벤트에 연결될 함수 (에디터의 EventTrigger 사용)
    public void OnInputDeselect(string text)
    {
        Debug.Log($"[OnDeselect] 필드 선택이 해제되었습니다. 최종 값: {text}");
    }
}

• 참고: OnSelect와 OnDeselect는 InputField 컴포넌트에 직접 노출되어 있지 않고 EventTrigger라는 별도 컴포넌트를 추가하여 Select, Deselect 이벤트를 연결해야 합니다. 하지만 위 이미지처럼 TMP_InputField (TextMeshPro Input Field) 컴포넌트에서는 네 가지 모두 기본 이벤트로 제공되므로 훨씬 편리하게 사용할 수 있습니다.

결론: 올바른 이벤트로 만드는 더 나은 사용자 경험

이벤트 (Event)	실행 시점	핵심 키워드	주요 사용 예시
On Value Changed	내용이 실시간으로 변경될 때	과정, 실시간	검색어 추천, 글자 수 표시
On End Edit	내용 편집이 완료되었을 때	완료, 제출	로그인, 채팅 전송
On Select	입력 필드를 선택했을 때	시작, 포커스 획득	UI 하이라이트, 가상 키보드 표시
On Deselect	선택을 해제했을 때	끝, 포커스 상실	유효성 검사, UI 원래대로 복구

Sheets로 내보내기

Unity Input Field의 네 가지 이벤트는 각각 뚜렷한 목적을 가집니다. '과정'을 실시간으로 추적하고 싶다면 On Value Changed를, '결과'를 제출받고 싶다면 On End Edit를 사용하세요. 그리고 입력 행위의 '시작'과 '끝'에 시각적/기능적 효과를 주고 싶다면 On Select와 On Deselect를 활용하면 됩니다.

이 네 가지 이벤트의 차이점을 명확히 인지하고 상황에 맞는 이벤트를 선택하는 것만으로도 여러분의 애플리케이션은 훨씬 더 직관적이고 반응성이 뛰어난, 즉 더 나은 사용자 경험을 제공하는 웰메이드(Well-made) 프로젝트로 거듭날 것입니다.