리치 텍스트
UI 요소와 텍스트 메시의 텍스트에는 여러 폰트 스타일 및 크기가 사용될 수 있습니다. 리치 텍스트는 UI 시스템과 레거시 GUI 시스템에서 모두 지원됩니다. Text, GUIStyle, GUIText, TextMesh 클래스에는 Unity 에디터가 텍스트 안에서 마크업 태그를 찾도록 설정하는 Rich Text 설정이 있습니다. Debug.Log 함수도 이 마크업 태그를 사용하여 코드에서 오류 보고를 향상시킬 수 있습니다. 태그는 눈으로 볼 수 있게 표시되지는 않지만, 텍스트에 적용할 스타일 변경을 나타냅니다.
마크업 포맷
마크업 시스템은 HTML에서 힌트를 얻어 만들어졌으나 보통 HTML과 완벽하게 호환되게 하려는 의도로 만들어지지는 않았습니다. 기본 아이디어는 텍스트의 일부분을 서로 매치되는 태그 쌍 안에 넣어 원하는 시각 효과를 부여할 수 있다는 것입니다.
We are <b>not</b> amused
이 예에서 볼 수 있듯이, 태그는 “꺾쇠 괄호” 문자인 <와 > 안에 있는 텍스트 조각일 뿐입니다. 태그 안에 있는 텍스트가 태그의 이름(이 경우에는 b)을 나타냅니다. 태그 이름은 섹션의 시작과 끝에서 동일하지만, 끝에 있는 태그에는 슬래시(/) 문자가 추가됩니다. 태그는 사용자에게 직접 표시되지 않고 태그로 둘러싸인 텍스트의 시각 효과에 대한 명령으로 해석됩니다. 위 예에 사용된 b 태그는 “not”이라는 단어에 굵은 글씨를 적용하므로 텍스트가 화면에 다음과 같이 표시됩니다.
We are not amused
텍스트의 마크업된 부분(이 부분을 둘러싸는 태그 포함)을 요소라고 합니다.
중첩 요소
요소를 다른 요소의 내부에 “중첩”하여 하나 이상의 스타일을 텍스트에 적용할 수 있습니다.
We are <b><i>definitely not</i></b> amused
i 태그는 기울임꼴을 나타내므로 이 텍스트는 화면에 다음과 같이 표시됩니다.
We are definitely not amused
여기에서 주의할 점은 종료 태그의 순서는 시작 태그의 순서와 반대라는 점입니다. 그 이유는 바깥쪽 태그가 안쪽 태그를 감싸도록 배치되어야 텍스트를 원하는 스타일대로 표시할 수 있기 때문입니다.
We are <b>absolutely <i>definitely</i> not</b> amused
이 태그의 결과는 다음과 같습니다.
We are absolutely definitely not amused
태그 파라미터
태그는 단순히 텍스트에 어떤 효과를 주거나 주지 않는 역할을 하지만, 일부 태그 중에는 다른 변화를 줄 수 있는 것들도 있습니다. 예를 들어, color 태그를 사용할 때에는 어떤 컬러를 적용할지 지정해야 합니다. 이러한 정보는 파라미터를 사용하여 태그에 추가해야 합니다.
We are <color=green>green</color> with envy
종료 태그에는 파라미터 값이 포함되지 않습니다. 파라미터 값은 따옴표로 묶을 수 있지만 반드시 묶어야 하는 것은 아닙니다.
지원 태그
다음 목록에서 Unity 에디터에서 지원하는 모든 스타일 태그에 대한 설명을 확인할 수 있습니다.
| 태그 | 설명 | 예 | 참고 |
|---|---|---|---|
| b | 텍스트를 굵게 만듭니다. | We are <b>not</b> amused. | |
| i | 텍스트를 기울임꼴로 만듭니다. | We are <i>usually</i> not amused. | |
| size | 파라미터 값에 따라 텍스트의 크기를 설정합니다(단위: 픽셀). | We are <size=50>largely</size> unaffected. | 이 태그는 Debug.Log에서도 사용할 수 있지만 크기를 너무 크게 설정하면 창 표시줄과 콘솔의 행간이 이상하게 보입니다. |
| color | 파라미터 값에 따라 텍스트의 컬러를 설정합니다. 컬러는 전형적인 HTML 포맷으로 지정할 수 있습니다. #rrggbbaa …여기서 이 글자는 두 자리 16진수를 나열한 것으로 각각 빨강, 녹색, 파랑, 알파(투명도) 컬러 값을 나타냅니다. 예를 들어, 완전히 불투명한 시안색은 다음과 같이 지정합니다. | <color=#00ffffff>… | 다른 옵션은 컬러 이름을 사용하는 것입니다. 컬러 이름을 사용하면 이해하기 더 쉽지만 컬러 범위가 제한되며 항상 완전한 불투명으로 간주됩니다. |
| <color=cyan>… 사용 가능한 컬러명은 아래 표를 참조하십시오. |
| 컬러 이름 | 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 |
 |
material
이 태그는 텍스트 메시에만 유용하고 파라미터를 통해 지정된 머티리얼이 있는 텍스트 섹션을 렌더링합니다. 이 값은 인스펙터에 표시되는 텍스트 메시의 머티리얼 배열에 대한 인덱스입니다.
We are <material=2>texturally</material> amused
quad
이 태그는 텍스트 메시에만 유용하고 텍스트에 맞는 이미지를 렌더링합니다. 이미지에 사용할 머티리얼과 픽셀 단위의 이미지 높이를 지정하는 파라미터와 표시할 이미지의 사각형 영역을 나타내는 추가 파라미터 네 개를 사용합니다. 다른 태그와는 달리 이 태그는 텍스트 일부를 둘러싸지 않으므로 종료 태그가 없습니다. 슬래시 문자가 시작 태그의 끝에 추가되어 “자체 종료” 태그임을 나타냅니다.
<quad material=1 size=20 x=0.1 y=0.1 width=0.5 height=0.5 />
렌더러의 머티리얼 배열에서 해당 포지션에 있는 머티리얼을 선택하고 이미지의 높이를 20픽셀로 설정합니다. 이미지의 사각 영역은 주어진 x, y에서 시작하여 폭, 높이 값 만큼의 크기를 가지며, 이 값은 텍스처의 스케일되지 않은 폭과 높이의 일부로서 주어집니다.
에디터 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);