유니티 - CustomEditor 활용 (Inspector 꾸미기)

 

유니티에서 아이템이나 무기 등의 설정값으로 ScriptableObject를 사용하면서 해당 아이템이나 무기 등의 이미지를 상단에 표시해 주는 기능을 CustomEditor를 이용해 꾸며 보겠습니다. (아래 이미지 참조)

 

우선 사용자의 ScriptableObject 가 있을 겁니다. (아래 소스 참조)

[CreateAssetMenu(menuName = "ScriptableObjects/WeaponValue")]
public class WeaponValue : ScriptableObject {
    [Header("이름")]
    public string weaponName;

    [Header("이미지")]
    public Sprite weaponImage;

    [Header("파워")]
    public float Damage;

    [Header("이미지 목록")]
    public List<Sprite> imageList;
}

 

위 ScriptableObject를 CustomEditor를 이용해 위쪽 이미지 처럼 나오게 하려면

#if UNITY_EDITOR
[CustomEditor(typeof(WeaponValue))]
public class GuiTest : Editor {
    WeaponValue value;

    private void OnEnable() {
        value = (WeaponValue)target;
    }
    
    public override void OnInspectorGUI() {
        EditorGUILayout.BeginVertical();

        EditorGUILayout.Space();
        value.weaponImage =  (Sprite)EditorGUILayout.ObjectField("이미지",
        	value.weaponImage, typeof(Sprite), true);

        EditorGUILayout.Space();
        GUILine(4);
        EditorGUILayout.Space();

        base.OnInspectorGUI();

        EditorGUILayout.EndVertical();
    }

    void GUILine( int lineHeight = 1 ) {
        EditorGUILayout.Space();
        Rect rect = EditorGUILayout.GetControlRect(false, lineHeight );
        rect.height = lineHeight;
        EditorGUI.DrawRect(rect, new Color ( 0.5f,0.5f,0.5f, 1 ) );
        EditorGUILayout.Space();
   }  
}
#endif

 

    WeaponValue value;

    private void OnEnable() {
        value = (WeaponValue)target;
    }

반응형

 

GuiTest.cs의 target이 ScriptableObject인 WeaponValue로 지정해 줍니다. 

 

EditorGUILayout.BeginVertical();

EditorGUILayout.EndVertical();

Editor의 세로 정렬의 시작과 끝을 표시 합니다.

 

EditorGUILayout.Space();

Inspector에서 한 줄의 빈칸을 만들어 간격을 만들어 줍니다.

 

value.weaponImage =  (Sprite)EditorGUILayout.ObjectField("이미지", 
	value.weaponImage, typeof(Sprite), true);

ObjectField의 타입을 스프라이트로 지정해 주고 WeaponValue의 이미지를 화면에 표시해 줍니다.

마지막 true => "allowSceneObjects" true면 Hierarchy에서 이미지를 끌어다 적용할 수 있지만 flase면 반대의 기능을 합니다.

 

    void GUILine( int lineHeight = 1 ) {
        EditorGUILayout.Space();
        Rect rect = EditorGUILayout.GetControlRect(false, lineHeight );
        rect.height = lineHeight;
        EditorGUI.DrawRect(rect, new Color ( 0.5f,0.5f,0.5f, 1 ) );
        EditorGUILayout.Space();
   }

 

한줄 라인을 그려 줍니다. 별도의 높이 값 없이 사용한다면 기본값은 1

 

base.OnInspectorGUI();

ScriptableObject인 WeaponValue 내용을 화면에 표시해 줍니다.

 

이상으로 간단하지만 CustomEditor의 활용 편이었습니다.