유니티(Unity) 스크롤 아이템의 높이를 텍스트 높이에 따라 변경

들어가기 전

한줄에 여러 요소를 넣을 때 비율을 설정 하는 방법을 미리 확인해도 좋다.

유니티(Unity) 한줄에 여러 오브젝트를 넣고 일정한 비율로 나열하기

 

목표

스크롤 아이템의 텍스트 내용이 달라질때 

텍스트의 높이에 맞춰 아이템 크기를 변경

----

----

결과 화면

내용이 변경되지 않았을 때 화면

동적으로 아이템의 내용이 변경되었을 때 아이템 크기 변경

요점

텍스트의 내용이 변경되는 시점과 텍스트의 크기가 변경되는 시점은 동일하지 않다

그래서 미리 텍스트 크기가 얼마나 변경되는지 확인 한 후 텍스트를 입력하는 형식으로 풀어간다.

미리 텍스트의 크기를 알아내는데 사용하는 텍스트를 숨김 텍스트라고 하고

실제로 보여지는 텍스트를 표시 텍스트라고 하겠다.

로직

TextMeshProUGUI hiddenText; //숨김 텍스트
TextMeshProUGUI showText; //표시 텍스트

//숨김 텍스트는 표시 텍스트의 자식으로 넣어놓고 사용하면 된다
RectTransform hiddenTextRect;	//숨김 텍스트 사이즈 변경을 위한 rect
RectTransform showTextRect;		//표시 텍스트 사이즈 변경을 위한 rect

RectTransform textRect;		//아이템 전체의 사이즈 변경을 위한 rect

public void SetText (string _text) 
{
    hiddenText.text = _text;		//숨김 텍스트를 변경한다.
    StartCoroutine(DelayTextResize(_text));
}

IEnumerator DelayTextResize (string _text)
{
    //한 프렘을 넘기고
    yield return new WaitForEndOfFrame();
    
    //숨김 텍스트의 크기를 확인하여 표시 텍스트의 크기를 변경해준다
    Vector2 textSize = hiddenText.GetRenderedValues(false);

    //텍스트의 크기를 변경해준다
    showTextRect.sizeDelta = new Vector2(showTextRect.sizeDelta.x, textSize.y);
    hiddenTextRect.sizeDelta = new Vector2(hiddenTextRect.sizeDelta.x, textSize.y);
    //아이템의 크기를 변경해준다
    textRect.sizeDelta = new Vector2(textRect.sizeDelta.x, textSize.y);

    //표시 텍스트의 텍스트를 변경해준다
    showText.text = _text;
}

추가

이렇게 해도 아이템 크기의 변경을 하는데 문제 없기는 하지만

Tween을 사용해서 TextRect의 크기를 애니메이션으로 변경시키고

내용을 표시하는게 좀 더 아름다운 UI 연출이 될 것 이다.

유니티(Unity) DoTween 추가하기