본문 바로가기

내배켐 Unity TIL

Unity 63일차 TIL - Unity (2D ItemInventory3_ItemTooltipUI)

UI를 활용하면서 RectTransform의 위치를 기존에 position 값을 변경하듯이 바꿔주면 된다고 생각했었다.

 

근데 원하는 위치로 가지 않아서 찾아보니 anchoredPosition이라는 것이 있었다.

 

anchoredPosition을 이용하면 Canvas의 Inspector 창에 있는 RectTransform Component에 있는 PosX와 PosY 값을 입력한 수치대로 변경할 수 있었다.

 

ItemTooltip Background Image 하나와 그 안에 들어갈 TextMeshPro - Item Name Text, Item TooltipText 두 개를 활용해서 UI를 만들었다.

 

(출처 : https://rito15.github.io/posts/unity-study-rpg-inventory/)

 

위에 링크에 있는 내용을 바탕으로 제작했다.

 

[SerializeField] private TextMeshProUGUI titleText;
[SerializeField] private TextMeshProUGUI contentText;

private RectTransform rt;
private CanvasScaler scaler;

private Vector2 leftTop = new Vector2(0, 1f);

private void Awake()
{
    Init();
    Hide();
}

private void Init()
{
    rt = GetComponent<RectTransform>();
    rt.pivot = leftTop;
    scaler = GetComponentInParent<CanvasScaler>();
}

// DragAndDropUI.cs 에서 사용
public void SetItemInfo(ItemData itemData)
{
    titleText.text = itemData.Name;
    contentText.text = itemData.ToolTip;
}

// DragAndDropUI.cs 에서 사용
public void SetRectPosition(RectTransform slotRect)
{
    float wRatio = Screen.width / scaler.referenceResolution.x;
    float hRatio = Screen.height / scaler.referenceResolution.y;

    float ratio = wRatio * (1f - scaler.matchWidthOrHeight) + hRatio * (scaler.matchWidthOrHeight);

    float slotWidth = slotRect.rect.width * ratio;
    float slotHeight = slotRect.rect.height * ratio;

    float width = rt.rect.width * ratio;
    float height = rt.rect.height * ratio;

    rt.anchoredPosition = new Vector2(slotRect.anchoredPosition.x + slotWidth, slotRect.anchoredPosition .y);

    bool rightTruncated = rt.anchoredPosition.x > 340f;

    ref bool R = ref rightTruncated;

    if (R)
        rt.anchoredPosition = new Vector2(rt.anchoredPosition.x - width - slotWidth, rt.anchoredPosition.y);
}

public void Show() => gameObject.SetActive(true);
public void Hide() => gameObject.SetActive(false);

 

SetRectPosition의 용도는 ItemSlot 바로 밑에 Tooltip UI가 나오게끔 해주는 것과, Tooltip UI가 Inventory 범위를 벗어나게 되면 Inventory 범위 안 쪽으로 다시 Setting 해주기 위해서 사용한다.

 

마찬가지로 하드코딩보다는 변수에 값을 넣어줘서 사용하는 방식으로 변경할 예정이다.