[Unity] 커스텀에디터 - ReorderableList 사용하기

 

커스텀 에디터를 사용하다보면, 리스트를 생성할때가 굉장히 많다. 리스트를 제작할때마다 필요하다고 느낀 기능들이 있다. ReorderableList는 UnityEditorInternal 네임스페이스에 포함되어 있는 강력한 유틸리티로, 리스트를 깔끔하고 편리하게 표시할 수 있게 해준다.

• +, - 버튼으로 삭제/추가하기
• 드래그를 이용해 리스트 순서 변경하기

using UnityEditorInternal; // 필수

---

✅ 기본 사용법 예제

SerializedProperty listProperty;
ReorderableList reorderableList;

void OnEnable()
{
    listProperty = serializedObject.FindProperty("myList");

    reorderableList = new ReorderableList(serializedObject, listProperty, true, true, true, true);

    reorderableList.drawHeaderCallback = DrawHeader;
    reorderableList.drawElementCallback = DrawElement;
    reorderableList.onAddCallback = OnAdd;
}

public override void OnInspectorGUI()
{
    serializedObject.Update();
    reorderableList.DoLayoutList();
    serializedObject.ApplyModifiedProperties();
}

void DrawHeader(Rect rect)
{
    EditorGUI.LabelField(rect, "My List");
}

void DrawElement(Rect rect, int index, bool isActive, bool isFocused)
{
    var element = listProperty.GetArrayElementAtIndex(index);

    EditorGUI.PropertyField(rect, element, GUIContent.none);
}

void OnAdd(ReorderableList list)
{
    listProperty.arraySize++;
}

 

---

기본적으로는 한 요소당 한줄만 차지하는데, 요소가 많아질 경우 세로로 요소를 넣어야 하는 경우가 많다.

id, grade, upType, value 총 4개의 요소로 이루어져있을 경우 세로로 나열하는 방법은 다음과 같다. 

 

요소가 한줄보다 길어질 경우, rect의 높이를 계산해서 지정해줘야한다.

예시 구조 (ID, Grade, UpType, Value)

void DrawElement(Rect rect, int index, bool isActive, bool isFocused)
{
    var element = listProperty.GetArrayElementAtIndex(index);

    rect.y += 4;

    var boxRect = new Rect(rect.x, rect.y, rect.width, EditorGUIUtility.singleLineHeight * 5);
    GUI.Box(boxRect, GUIContent.none);

    rect.x += 10;
    rect.y += 8;
    rect.width -= 20;

    // ID
    EditorGUI.PropertyField(new Rect(rect.x, rect.y, rect.width, EditorGUIUtility.singleLineHeight),
        element.FindPropertyRelative("id"), new GUIContent("ID"));

    rect.y += EditorGUIUtility.singleLineHeight + 4;

    // Grade
    EditorGUI.PropertyField(new Rect(rect.x, rect.y, rect.width, EditorGUIUtility.singleLineHeight),
        element.FindPropertyRelative("grade"), new GUIContent("Grade"));

    rect.y += EditorGUIUtility.singleLineHeight + 4;

    // UpType (드롭다운 예시)
    DrawUpTypeDropdown(new Rect(rect.x, rect.y, rect.width, EditorGUIUtility.singleLineHeight),
        element.FindPropertyRelative("upType"));

    rect.y += EditorGUIUtility.singleLineHeight + 4;

    // Value
    EditorGUI.PropertyField(new Rect(rect.x, rect.y, rect.width, EditorGUIUtility.singleLineHeight),
        element.FindPropertyRelative("value"), new GUIContent("Value"));
}

// 드롭다운 함수 예시
void DrawUpTypeDropdown(Rect rect, SerializedProperty property)
{
    BattleUpgradeEnum[] enumValues = BattleUpgradeTypeDescriptions.GetAvailableTypes();
    string[] descriptions = new string[enumValues.Length];

    for (int i = 0; i < enumValues.Length; i++)
        descriptions[i] = BattleUpgradeTypeDescriptions.GetDescription(enumValues[i]);

    int currentIndex = System.Array.IndexOf(enumValues, (BattleUpgradeEnum)property.intValue);
    int selectedIndex = EditorGUI.Popup(rect, "강화 타입", currentIndex, descriptions);

    if (selectedIndex != currentIndex)
        property.intValue = (int)enumValues[selectedIndex];
}