Unity/UI & TMP 맨텀 2023. 6. 12. 22:33
캐릭터의 표정을 사용하는 대화시스템을 만들어 본 개발자라면 누구나 한 번쯤 하는 고민. 표정이 들어간 스프라이트에 알파값을 넣으면 박스가 생겨!! 일반적으로 표정 시스템을 만든다면 전신 스프라이트를 준비하고, 그 위에 표정 스프라이트를 올리는 방식으로 작업할 것이다. 해상도만 같다면 그 위에 올리면 감쪽같고 그대로 사용하면 될 것 같다. 알파값만 들어가지 않는다면 말이다. 전신 스프라이트 위에 표정을 올리고 캔버스에 알파를 적용하면 위와 같이 표정 스프라이트 부분이 알파가 겹치게되면서 경계선 부분이 눈에 띈다. 이 경계선을 안보이게 하는 방법은 UnMask를 이용하는 것이다. https://github.com/mob-sakai/UnmaskForUGUI#demo GitHub - mob-sakai/Unmas..
Unity/UI & TMP 맨텀 2023. 1. 11. 13:20
#. 기본 UI 배치하기 간단한 UI를 만들어보자 라이브러리에서 VisualElement를 하나 배치하고, 그 밑에 Label, ProgressBar, Label, Button순으로 배치한다. VisualElement는 유니티의 빈 오브젝트와 같은 역할을 한다. 각 요소들은 하이어라키에서 두 번 클릭하거나, 우측 인스펙터에서 Name필드값을 입력하면 이름을 변경 가능하다. 이렇게 지정된 이름은 데이터 바인딩할 때 코드에서 사용된다. Viewport바로 아래에 있는 File을 눌러서 uxml을 저장할 수 있다. #. 스타일 시트(USS) 만들고 저장하기 좌측 상단의 StyleSheet +버튼을 눌러서 Create New USS을 누른다. (위치가 애매해서 UI Builder 전체에 대한 메뉴로 착각하기 쉬..
Unity/UI & TMP 맨텀 2023. 1. 9. 15:18
#. 유니티의 UI 시스템 비교 유니티는 과거 IMGUI를 UI시스템을 사용했는데, 워낙 사용성이 좋지 않다 보니 대부분의 개발자들은 NGUI라는 상용에셋을 사용하곤 했다. 그러다 유니티가 UGUI라는 새로운 UI시스템을 출시하고 한창 과도기를 겪다가 현재는 대부분 UGUI를 사용하고 NGUI의 사용은 기존 프로젝트의 레거시로 사용하는 경우가 많다. 그런데, 유니티는 최근 UIToolkit이라는 새로운 UI 시스템을 출시했다. 처음에는 UGUI를 잘 쓰고있는데 안정되지도 않은 신규기능을 굳이 알아볼 필요 없다고 생각했다. 하지만 설명중 다음 문구는 필요성을 확 느끼게 해 주었다. UIToolkit는 게임 UI 뿐만 아니라 에디터 UI에도 사용할 수 있습니다. 기존의 에디터 코드를 조금씩 건드려보기는 했으..
Unity/UI & TMP 맨텀 2021. 10. 7. 23:34
문제 DOTweenTMPAnimator를 사용하다가 시퀀스를 사용하여 애니메이션을 처리를 하는 도중 You can't add a NULL tween to a Sequence 라는 메시지가 출력되는 현상 해결 DOTweenTMPAnimator에 시퀀스를 실행할때 해당 문자가 whiteSpace라면 트윈을 더할 수 없다. whiteSpace일 경우를 체크하고 예외처리해주면 해결된다.
Unity/UI & TMP 맨텀 2020. 8. 31. 20:58
StackOverFlow https://stackoverflow.com/questions/30766020/how-to-scroll-to-a-specific-element-in-scrollrect-with-unity-ui 유니티로 개발하다보면 ScrollView로 인벤토리나 퀘스트 등의 리스트를 만들 일이 많이 생긴다. 그런데 특정 아이템의 위치로 스냅을 시키는 것은 꽤나 구현하기 껄끄럽다. private List items; private RectTransform contentTrans; private void FocusOneItem(int slotNum) { RectTransform target = items[slotNum]; Vector2 point = (Vector2)scrollView.transf..
Unity/UI & TMP 맨텀 2020. 7. 6. 18:14
# 어떨 때 사용할까? 텍스트와 스프라이트를 같이쓰는 경우가 종종있다. 유아이 정렬기능등을 통해서 직접 Image로 넣는 경우도있지만 정렬오류가 많은편. 때문에 TextMeshPro에서는 Sprite를 글자처럼 사용하는 기능을 지원한다. # 스프라이트 준비 아래와 같이 텍스트와 같이 사용할 스프라이트를 포토샵 등을 통해 바둑판 형식으로 (POT 맞춰서) 배열한다. # 스프라이트 임포트 TextureType Sprite / Sprite Mode를 Multiple로 지정해서 각각의 스프라이트를 분리시킨다. 해당 스프라이트는 Resources 폴더내에 위치시킬 것. # SpriteAsset 생성 그런 뒤 스프라이트위에서 오른쪽 클릭 -> TextMeshPro -> SpriteAsset 를 누르면되는데, 빈 공..