Unity UI Toolkit: TSS(테마 스타일시트) 사용 가이드

이 문서는 Unity UI Toolkit의 TSS(테마 스타일시트) 사용에 대한 공식 가이드를 한국어로 설명하고 다양한 활용 예제를 포함합니다.

1. TSS란 무엇인가?

TSS는 Unity UI Toolkit에서 사용되는 테마 스타일시트 파일로, 게임이나 애플리케이션의 UI를 특정 테마에 맞게 스타일링하는 데 사용됩니다. TSS 파일은 일반적인 USS 파일 형식을 따르지만, 테마 파일로 특정한 사용을 위해 추가적인 기능을 제공합니다.

2. TSS 파일 생성 및 설정

TSS 파일은 프로젝트의 게임 오브젝트에 첫 번째 UIDocument를 추가하면 기본 런타임 테마 에셋이 생성됩니다. TSS 파일을 생성하려면 다음 단계를 따릅니다.

1. TSS 파일 생성:
2. Assets > Create > UI Toolkit > TSS Theme File을 선택합니다.
3. 원하는 경우 기본 테마에서 상속할 수 있습니다.
4. 커스텀 스타일 만들기:
5. 커스텀 스타일의 USS 파일을 만들고, TSS로 임포트합니다.
6. TSS 적용:
7. C# 또는 UXML에서 TSS를 참조하여 적용할 수 있습니다.
8. 패널 설정의 기본 테마로 TSS를 세팅하거나, 각 패널 설정별로 다른 TSS 파일을 사용할 수 있습니다.

3. TSS 상속 및 스타일시트 임포트

TSS 상속

TSS 파일에서 다른 테마를 상속할 수 있으며, 이를 통해 전반적인 스타일을 일관되게 유지할 수 있습니다.

• @import 구문: csharp @import url("<path-to-file>/fileName.tss");
• 인스펙터 창에서 TSS 상속:
• 해당 TSS 에셋을 선택합니다.
• Inspector > Inherited Themes로 이동합니다.
• +를 선택하여 새로운 레퍼런스를 추가합니다.
• 드롭다운에서 상속할 테마를 선택합니다.

스타일시트 임포트

기존의 USS 파일을 TSS 파일 내에 임포트 할 수 있습니다.

• @import 구문: csharp @import url("<path-to-file>/fileName.uss");
• 인스펙터 창에서 스타일시트 임포트: 다음 단계를 따릅니다.
• 해당 TSS 에셋을 선택합니다.
• Inspector > Inherited Themes로 이동하여 +를 선택합니다.
• 드롭다운에서 사용할 스타일시트를 선택합니다.
• Apply를 선택합니다.

4. 활용 예제

예제 1: 다국어 지원을 위한 폰트 커스터마이징

여러 언어를 지원하는 게임에서 언어별 TSS 파일을 생성하고, 각 언어에 맞는 폰트를 지정할 수 있습니다. 예를 들어, 영어와 한국어에 각각 다른 폰트를 사용할 때 다음과 같이 TSS 파일을 만들 수 있습니다.

@import url("englishTheme.tss"); // 영어 테마 파일 임포트
@import url("koreanTheme.tss"); // 한국어 테마 파일 임포트

예제 2: 플랫폼 맞춤형 스타일링

다양한 플랫폼에 맞게 UI를 다르게 스타일링할 수 있습니다.

@import url("mobileTheme.tss"); // 모바일 플랫폼 테마
@import url("desktopTheme.tss"); // 데스크톱 플랫폼 테마

5. 추가 리소스

• USS 소개
• C#으로 스타일 적용
• UXML에 스타일 추가
• USS 베스트 프랙티스
• UI 툴킷 디버거

위 내용을 통해 Unity UI Toolkit의 TSS 파일 활용 방법에 대한 기본 지식과 예제를 익히셨습니다. TSS를 통해 여러분의 게임이나 애플리케이션의 UI를 더 효율적으로 스타일링해보세요!