Unity 드롭다운(Dropdown) 구성 및 활용

Unity의 드롭다운 컴포넌트를 통해 사용자가 여러 옵션 중에서 선택할 수 있도록 쉽게 UI를 구성할 수 있습니다. 이 문서에서는 드롭다운의 기능, 프로퍼티, 이벤트 및 설정 방법에 대해 설명하고, 활용 예제를 추가로 제공합니다.

드롭다운 기본 개념

드롭다운은 사용자가 옵션을 선택할 수 있는 UI 요소입니다. 선택된 옵션은 드롭다운 컴포넌트에 표시되고, 사용자가 클릭하면 리스트가 열립니다. 리스트는 사용자가 다시 클릭하거나 캔버스의 다른 곳을 클릭할 때 닫힙니다.

드롭다운 프로퍼티

드롭다운 이벤트

드롭다운 템플릿 설정

드롭다운은 클릭 시 나타나는 리스트의 템플릿을 사용하여 설정됩니다. 템플릿은 기본적으로 비활성화 되어 있으며, 필요에 따라 활성화할 수 있습니다. 드롭다운 컴포넌트에서 템플릿 오브젝트에 대한 참조를 지정해야 합니다.

• 템플릿은 Toggle 컴포넌트를 포함해야 하며, 각 옵션에 대한 사본이 자동으로 생성됩니다.
• 스크롤 보기를 포함하는 드롭다운을 설정하면 많은 옵션을 스크롤하여 선택할 수 있습니다.

텍스트 및 이미지 지원

드롭다운의 옵션은 각각 텍스트와 이미지를 지원합니다. 이들은 선택적으로 사용할 수 있으며, 드롭다운 설정 시 활성화할 수 있습니다.

• Caption Text는 현재 선택된 옵션의 텍스트를 표시합니다.
• Item Text는 리스트의 각 항목의 텍스트를 표시합니다.
• Caption Image는 선택된 옵션의 이미지를 표시합니다.
• Item Image는 리스트에서 항목의 이미지를 표시합니다.

드롭다운 리스트 배치

드롭다운 리스트의 위치는 템플릿의 앵커와 피벗에 의해 결정됩니다. 기본적으로 리스트는 드롭다운 컨트롤 아래쪽에 위치하며, 컨트롤이 캔버스 밖으로 나가지 않도록 자동으로 조정됩니다.

배치 일반 사항

• 리스트는 옵션 항목이 아래쪽으로 펼쳐진 형태로 배치됩니다.
• 리스트가 캔버스를 벗어나지 않도록 반전되는 경우가 있을 수 있습니다.
• 드롭다운 템플릿은 캔버스 크기에 비례하여 조정됩니다.

활용 예제

간단한 드롭다운 예제

아래는 드롭다운을 생성하고 텍스트와 이미지를 설정하는 기본 코드 예제입니다.

using UnityEngine;
using UnityEngine.UI;

public class DropdownExample : MonoBehaviour
{
    public Dropdown dropdown;

    void Start()
    {
        List<string> options = new List<string> { "Option 1", "Option 2", "Option 3" };
        dropdown.AddOptions(options);
    }
}

스크롤 가능한 드롭다운 예제

스크롤 가능한 드롭다운을 생성하는 예제입니다. 많은 옵션이 있을 때 유용합니다.

using UnityEngine;
using UnityEngine.UI;

public class ScrollableDropdownExample : MonoBehaviour
{
    public Dropdown dropdown;
    public GameObject dropdownTemplate;

    void Start()
    {
        // 여러 옵션 추가
        List<string> options = new List<string>();
        for (int i = 0; i < 20; i++)
        {
            options.Add("Item " + (i + 1));
        }
        dropdown.AddOptions(options);

        dropdownTemplate.SetActive(true);
    }
}

결론

Unity에서 드롭다운 컴포넌트는 사용자가 다양한 선택을 할 수 있도록 도와주는 강력한 도구입니다. 이 문서에서 설명한 프로퍼티, 이벤트 및 활용 예제를 참고하여 여러분의 UI 프로젝트에 드롭다운을 효과적으로 통합해 보세요.