자동 레이아웃

UI 레퍼런스

리치 텍스트

UI 요소와 텍스트 메시의 텍스트에는 여러 폰트 스타일 및 크기가 사용될 수 있습니다. 리치 텍스트는 UI 시스템과 레거시 GUI 시스템에서 모두 지원됩니다. Text, GUIStyle, GUIText, TextMesh 클래스에는 Unity 에디터가 텍스트 안에서 마크업 태그를 찾도록 설정하는 Rich Text 설정이 있습니다. Debug.Log 함수도 이 마크업 태그를 사용하여 코드에서 오류 보고를 향상시킬 수 있습니다. 태그는 눈으로 볼 수 있게 표시되지는 않지만, 텍스트에 적용할 스타일 변경을 나타냅니다.

마크업 포맷

마크업 시스템은 HTML에서 힌트를 얻어 만들어졌으나 보통 HTML과 완벽하게 호환되게 하려는 의도로 만들어지지는 않았습니다. 기본 아이디어는 텍스트의 일부분을 서로 매치되는 태그 쌍 안에 넣어 원하는 시각 효과를 부여할 수 있다는 것입니다.

우리는 즐겁지 않다.

예제에서 볼 수 있듯이 태그는 “꺾쇠 괄호” < 및 > 안에 있는 텍스트 조각입니다.

시작 태그를 섹션 앞에 배치합니다. 태그 내에 있는 텍스트는 태그 이름(이 경우 b)을 나타냅니다.

또 다른 태그는 섹션 끝에 배치합니다. 이 태그는 종료 태그로, 시작 태그와 이름이 동일하지만 앞에 슬래시 / 문자가 붙어 있습니다. 모든 시작 태그에는 해당하는 종료 태그가 있어야 합니다. 시작 태그를 닫지 않으면 일반 텍스트로 렌더링됩니다.

태그는 사용자에게 직접 표시되지 않지만, 태그가 둘러싼 텍스트의 스타일 지정 지침으로 해석됩니다. 위 예에서 b 태그는 “않다”라는 텍스트에 볼드체를 적용하여 화면에서 다음과 같이 보이도록 만듭니다.

우리는 즐겁지 않다

텍스트의 마크업된 부분(이 부분을 둘러싸는 태그 포함)을 요소라고 합니다.

중첩 요소

요소를 다른 요소의 내부에 “중첩”하여 하나 이상의 스타일을 텍스트에 적용할 수 있습니다.

우리는 전혀 즐겁지 않다

 태그는 기울임꼴을 나타내므로 이 텍스트는 화면에 다음과 같이 표시됩니다.

우리는 전혀 즐겁지 않다

여기에서 주의할 점은 종료 태그의 순서는 시작 태그의 순서와 반대라는 점입니다. 그 이유는 바깥쪽 태그가 안쪽 태그를 감싸도록 배치되어야 텍스트를 원하는 스타일대로 표시할 수 있기 때문입니다.

우리는 진짜 하나도 즐겁지 않다

이 태그의 결과는 다음과 같습니다.

우리는 진짜 하나도 즐겁지 않다

태그 파라미터

태그는 단순히 텍스트에 어떤 효과를 주거나 주지 않는 역할을 하지만, 일부 태그 중에는 다른 변화를 줄 수 있는 것들도 있습니다. 예를 들어, color 태그를 사용할 때에는 어떤 컬러를 적용할지 지정해야 합니다. 이러한 정보는 파라미터를 사용하여 태그에 추가해야 합니다.

우리는 질투에 <color=green>눈이 멀었다</color>

다음과 같이 표시됩니다.

종료 태그에는 파라미터 값이 포함되지 않습니다. 파라미터 값은 따옴표로 묶을 수 있지만 반드시 묶어야 하는 것은 아닙니다.

태그 파라미터는 공백을 포함할 수 없습니다. 다음 예를 참조하십시오.

우리는 질투에 <color = green>눈이 멀었다</color>

이 경우 = 문자 양쪽에 공백이 있으므로 제대로 동작하지 않습니다.

지원 태그

다음 목록에서 Unity 에디터에서 지원하는 모든 스타일 태그에 대한 설명을 확인할 수 있습니다.

태그	설명	예	참고
b	텍스트를 굵게 만듭니다.	`우리는 즐겁지 <b>않다</b>.`
i	텍스트를 기울임꼴로 만듭니다.	`우리는 <i>보통</i> 즐겁지 않다.`
size	파라미터 값에 따라 텍스트의 크기를 설정합니다(단위: 픽셀).	`우리는 <size=50>거의</size> 영향을 안 받는다.`	이 태그는 Debug.Log에서도 사용할 수 있지만 크기를 너무 크게 설정하면 창 표시줄과 콘솔의 행간이 이상하게 보입니다.
color	파라미터 값에 따라 텍스트 컬러를 설정합니다. 컬러는 HTML 포맷(예: `#rrggbbaa`)으로 지정할 수 있으며, 여기에서 문자는 컬러의 빨간색, 녹색, 파란색 및 알파(투명도) 값을 나타내는 16진수 쌍에 해당합니다. 예를 들어 완전히 불투명한 청록색은 `color=#00ffffff`로 지정됩니다. 16진수 값은 대문자 또는 소문자로 지정할 수 있습니다. 즉 `#FF0000`은 `#ff0000`과 동일합니다.	`우리는 <color=#ff0000ff>여러모로</color> 즐겁다`	또 다른 옵션은 컬러 이름을 사용하는 것입니다. 컬러 이름을 사용하면 이해하기 더 쉽지만 컬러 범위가 제한되며 항상 완전한 불투명으로 간주됩니다. `<color=cyan>some text</color>` 사용 가능한 컬러명은 아래 표를 참조하십시오.
material	이 태그는 텍스트 메시에만 유용하고 파라미터를 통해 지정된 머티리얼이 있는 텍스트 섹션을 렌더링합니다. 이 값은 인스펙터에 표시되는 텍스트 메시의 머티리얼 배열에 대한 인덱스입니다.	`우리는 <material=2>구조적으로</material> 즐겁다`
quad	텍스트에 맞는 이미지를 렌더링합니다. 이는 텍스트 메시에만 유용합니다. 이미지에 사용할 머티리얼과 픽셀 단위의 이미지 높이를 지정하는 파라미터와, 표시할 이미지의 사각형 영역을 나타내는 추가 파라미터 네 개를 사용합니다. 다른 태그와는 달리 이 태그는 텍스트 일부를 둘러싸지 않으므로 종료 태그가 없습니다. 슬래시 문자가 시작 태그의 끝에 추가되어 “자체 종료” 태그임을 나타냅니다.	`<quad material=1 size=20 x=0.1 y=0.1 width=0.5 height=0.5>`	렌더러의 머티리얼 배열에서 해당 포지션에 있는 머티리얼을 선택하고 이미지의 높이를 20픽셀로 설정합니다. 이미지의 사각 영역은 주어진 x, y 포지션에서 시작하여 폭, 높이 값만큼의 크기를 가지며, 이 값은 텍스처의 스케일되지 않은 폭과 높이의 일부로서 주어집니다.

지원 컬러

다음 표에는 <color> 리치 텍스트 태그에 16진수 태그 대신 이름을 사용할 수 있는 컬러가 나와 있습니다.

*컬러 이름*	*16진수 값*	견본
aqua (cyan과 동일)	`#00ffffff`
검은색	`#000000ff`
blue	`#0000ffff`
brown	`#a52a2aff`
cyan (aqua와 동일)	`#00ffffff`
darkblue	`#0000a0ff`
fuchsia (magenta와 동일)	`#ff00ffff`
green	`#008000ff`
grey	`#808080ff`
lightblue	`#add8e6ff`
lime	`#00ff00ff`
magenta (fuchsia와 동일)	`#ff00ffff`
maroon	`#800000ff`
navy	`#000080ff`
olive	`#808000ff`
orange	`#ffa500ff`
purple	`#800080ff`
red	`#ff0000ff`
silver	`#c0c0c0ff`
teal	`#008080ff`
white	`#ffffffff`
yellow	`#ffff00ff`

에디터 GUI

리치 텍스트는 에디터 GUI 시스템에서 기본적으로 비활성화되어 있지만 커스텀 GUIStyle을 사용하여 명시적으로 활성화할 수 있습니다. richText 프로퍼티를 true로 설정하고 스타일을 해당 GUI 함수에 전달해야 합니다.

GUIStyle style = new GUIStyle ();
style.richText = true;
GUILayout.Label("<size=30>Some <color=yellow>RICH</color> text</size>",style);