개요

Sprite 를 Slice 하는 기능을 실시간으로 보여주기 위해 Editor를 하나 더 띄우는 방식을 사용했었습니다.
하지만, ShowAsDropdown 함수를 사용했었기 때문에 기본적으로 OnLostFocus 시에 창이 닫히는 문제가 있었습니다.
이번에는 해당 문제를 해결해보도록 하겠습니다.

구현

우선, ShowAsDropdown 함수를 Show 함수로 바꾸는 것부터 시작하겠습니다.

다른 방법도 물론 있습니다.
예를 들어, ShowPopup, ShowUtility 또한 OnLostFocus 시에 닫히지 않는 창을 띄워준다는 점은 같지만,
ShowPopup 같은 경우에는 타이틀 바가 없고,
ShowUtility 같은 경우에는 타이틀 바의 디자인이 어색합니다.

if (!isShowPreview && previewPopup == null)
{    
    // Other parameters...
    
    previewPopup.position = new Rect(position.x, position.y, position.width, position.height);
    previewPopup.Show();
    // previewPopup.ShowAsDropDown(new Rect(position.x, position.y, position.width, position.height), new Vector2(600, 600) );
}

이렇게 하면 포커스가 풀려도 창이 닫히지 않지만, OnGUI 함수가 실행되지 않는다는 문제점이 생깁니다.
아래 사진을 보시면, 좌측 에디터의 ColCount와 우측 에디터의 column 개수가 일치하지 않는 것을 확인하실 수 있습니다.

문제를 해결하기 위해 EditorCoroutine을 사용할수도 있겠지만, 그보다 더 간단하게 Update 함수를 사용해보겠습니다.

        // Repaint in BG
        private void Update()
        {
            Repaint();
        }

Update 함수는 Background 에서도 실행되므로 해당 함수 안에서 Repaint 함수를 통해 OnGUI를 호출해주면 실시간으로 파라미터들을 반영할 수 있습니다.

추가적으로, 부모 에디터가 닫힐때 같이 닫히지 않기때문에, 따로 설정을 해주어야합니다.

        private void OnDisable()
        {
            ClosePreviewPopup();
        }
        
        private void ClosePreviewPopup()
        {
            if (previewPopup != null)
            {
                previewPopup.Close();
                previewPopup = null;
            }
        }

마무리

이제 Sprite Preview UX개선을 완료했습니다.

offset과 padding까지 넣고 다시 테스트해보겠습니다.