UI 시스템의 도입과 함께 GUI 특화 기능을 생성할 수 있도록 해 주는 새 컴포넌트가 추가되었습니다. 이 섹션에서는 생성할 수 있는 새로운 컴포넌트의 기본적인 사항에 대해서 다룹니다.
Text 컴포넌트는 레이블이라고도 하며 표시할 텍스트를 입력하기 위한 텍스트 영역을 가지고 있습니다. 폰트, 폰트 스타일, 폰트 크기, 해당 텍스트의 리치 텍스트 여부 등을 설정할 수 있습니다.
텍스트 정렬에 대해 설정할 수 있는 옵션이 있습니다. 텍스트가 사각 영역 너비 또는 높이보다 클 경우 어떻게 할 것인지를 조절하는 수평 및 수직 오버플로 설정과 가용 공간에서 텍스트가 들어맞도록 크기를 조절하는 베스트 피트 옵션이 있습니다.
이미지에는 Rect Transform 컴포넌트와 Image 컴포넌트가 있습니다. 타겟 그래픽 필드 아래에서 Image 컴포넌트에 스프라이트를 적용할 수 있고, 컬러는 컬러 필드에서 설정할 수 있습니다. Image 컴포넌트에 머티리얼 역시 적용할 수 있습니다. 이미지 타입 필드는 적용된 스프라이트가 어떻게 보일지 정의합니다. 옵션은 다음과 같습니다.
Simple - 전체 스프라이트를 균일하게 스케일합니다.
Sliced - 3x3 스프라이트 분할을 활용하여 크기를 조절할 때 모서리 부분은 왜곡하지 않고 중심 부분만이 늘어나도록 합니다.
Tiled - 슬라이스와 유사하나 중심 부분을 늘리는 것이 아니라 타일링(반복)합니다. 테두리가 전혀 없는 스프라이트의 경우에는 전체 스프라이트가 타일링됩니다.
Filled - 심플 옵션의 경우와 동일한 메서드로 스프라이트를 보여주되 원점으로부터 지정 방향, 방법, 양만큼 스프라이트를 채웁니다.
심플 또는 채움을 선택했을 때 나타나는 네이티브 크기 설정 옵션은 이미지를 원본 스프라이트 크기로 초기화합니다.
이미지는 ‘Texture Type’ 설정에서 Sprite(2D / UI)를 선택하여 UI 스프라이트로 임포트할 수 있습니다. 스프라이트에는 이전 GUI 스프라이트에는 없었던 추가 임포트 설정이 있으며 가장 큰 차이는 스프라이트 에디터가 추가되었다는 점입니다. 스프라이트 에디터는 이미지 9-Slicing 옵션을 제공하는데, 이 옵션은 이미지를 9개의 영역으로 분할하여 스프라이트의 크기가 조절될 경우에 모서리 부분이 늘어나거나 왜곡되지 않도록 해 줍니다.
Image 컴포넌트는 스프라이트를 사용하지만 Raw Image는 텍스처(테두리 등 없음)를 사용합니다. 로우 이미지는 필요한 경우에만 사용해야 하며, 그 외 대부분의 경우에는 이미지를 사용하는 것이 적합합니다.
마스크는 눈에 보이는 UI 컨트롤이라기보다는 컨트롤의 자식 요소의 외형을 수정하는 방식입니다. 마스크는 자식 요소를 부모의 형태대로 제약(즉 “마스킹”)합니다. 따라서 자식이 부모보다 클 경우 부모에 들어맞는 자식의 일부분만이 보일 수 있게 됩니다.
비주얼 컴포넌트에는 단순 드롭 섀도우 또는 아웃라인 등의 다양한 단순 효과도 적용할 수 있습니다. 자세한 정보는 UI 효과 레퍼런스 페이지를 참조하십시오.
Did you find this page useful? Please give it a rating:
Thanks for rating this page!
What kind of problem would you like to report?
Thanks for letting us know! This page has been marked for review based on your feedback.
If you have time, you can provide more information to help us fix the problem faster.
Provide more information
You've told us this page needs code samples. If you'd like to help us further, you could provide a code sample, or tell us about what kind of code sample you'd like to see:
You've told us there are code samples on this page which don't work. If you know how to fix it, or have something better we could use instead, please let us know:
You've told us there is information missing from this page. Please tell us more about what's missing:
You've told us there is incorrect information on this page. If you know what we should change to make it correct, please tell us:
You've told us this page has unclear or confusing information. Please tell us more about what you found unclear or confusing, or let us know how we could make it clearer:
You've told us there is a spelling or grammar error on this page. Please tell us what's wrong:
You've told us this page has a problem. Please tell us more about what's wrong:
Thank you for helping to make the Unity documentation better!
Your feedback has been submitted as a ticket for our documentation team to review.
We are not able to reply to every ticket submitted.