UI, 유저인터페이스 기본 - 5 Overflowing Information, Scrollbars, and Other Tricks [Unity]

 

이제 다음 UI 에 대해서

배워보자.

 

왜 이렇게 기본이 많아?

라고 생각할 수 있겠지만

기본을 다 하면 응용은 무한대로 가능하니까 참도록 하자.

 

 

저런 것들 살짝 찍먹해보자

 

---

 

처음엔 애니메이터를 이용을 해보려고 한다.

글자가 화면 밖으로 이동하게해서 없애려고 한다.

 

 

 

애니메이션 클립 만들고, 불리안 값 정하고 스크립트로 작동하게 하면 되겠다.

우선 보기엔 간단해보인다.

가보자

 

텍스트를 우선 만든다.

 

 

텍스트 컴포넌트에 애니메이터 추가

 

추가했으면 이제 애니메이터 작동을 위해

애니메이터 창과 애니메이션 창을 연다.

++둘이 위아래로 붙어있다.

 

애니메이션을 추가하자.

 

추가했으면 속성, Property도 추가해주자.

 

우리는 Anchored Position을 쓰려고 한다.

 

 

저기 빨간색을 누르면 녹화가 되는데..?

녹화를 하고 우리가 텍스트를 움직이면 그것이 녹화되고 재생이 되었을 때

Loop모드로 애니메이션을 플레이에서 계속 보여준다.

 

하지만 Loop는 사라지는 것이 아니기에 조금 더 손을 봐야한다.

 

 

애니메이션을 만들었다면 이제 애니메이터로 가자

 

새로운 상태를 만들고 초기값으로 설정한다.

 

 

처음부터 사라지게하고 싶지는 않고 특정 condition에 작동하게 하고 싶기에 저렇게 했다.

 

그 후에 transition을 만들어준다.

 

**Loop를 없애야 반복되지 않겠지?

 

그 후 Condition을 설정하기 위해 Parameter를 만든다.

 

나는 parameter로 bool 타입을 만들었고 false일 때 글자가 사라졌으면 좋겠다는 생각을 했다.

 

 

이 값은 어떻게 바꿔줄까??/

당연히 스크립트로 바꿔줘야겠지??

 

Object들을 담아주고

 

메서드를 만들어준다.

저 메서드가 작동하면 해당 애니메이션 조건에 따라 실행될 것이다.

 

그렇다면 언제 저 메서드가 실행되게 할 것인가..?

나는 텍스트에 Event Trigger를 달고 작동시키려한다.

 

해당 텍스트에 할당하고, 메서드를 Pointer Click 이벤트가 일어나면 작동되게 바꿨다.

즉, 텍스트를 클릭하게 된다면 사라질 것이다.

 

 

와 굿굿

 

---

 

 

그렇다면 Scroll View를 알아보자

 

 

UI에서 만들어주자

 

역시나 Child로 따라오는 것이 많다.

 

컴포넌트를 봐도 뭐가 이렇게 많다.

 

 

 

뭐 몇개 건들다보면 알게 될 것이고

우리가 할 건 저기에다 text를 넣는 것이다.

 

하지만 우리가 글씨를 넣었을 때

잘못넣으면 어떻게 되느냐..?

 

스크롤 뷰보다 글씨가 더 커서 안 보이는 그런 경우가 생긴다.

어?? 글씨가 가려졌으니까

이게 Scroll view를 이용한 hiding인가???

맞다.

정확하게 말하자면

Scroll을 내림으로 글씨가 가려져야지

글씨가 너무 커서 가려지는 것은.. 아니다.

 

이렇게 함으로써 UI를 숨길 수 있다는 것도 알았다.

 

우리가 UI로 살펴볼 수 있는 기본적인 것은 다 해봤다.

이제 우리가 할 것은

기본을 이용해서 만들어보는 것이다.

또한 필요하다면 검색을 통해서 알아내보자.