Android TV에서 Jetpack Compose 사용

TV용 Compose는 Android TV 사용자 인터페이스를 빌드하는 데 권장되는 방식입니다. Android Jetpack Compose의 모든 이점을 TV 앱에 활용하여 아름답고 기능적인 앱 UI를 훨씬 더 쉽게 빌드할 수 있습니다. TV용 Compose를 사용할 때의 몇 가지 구체적인 이점은 다음과 같습니다.

• 유연성: Compose를 사용하면 간단한 레이아웃부터 복잡한 애니메이션에 이르기까지 모든 유형의 UI를 만들 수 있습니다. 구성요소는 즉시 사용할 수 있지만 앱의 요구사항에 맞게 맞춤설정하고 스타일을 지정할 수도 있습니다.
• 간소화 및 가속화된 개발: Compose는 기존 코드와 호환되며 개발자가 더 적은 코드로 앱을 더 효율적으로 빌드할 수 있게 해줍니다.
• 직관적: Compose는 선언적 문법을 사용하여 UI를 변경하고 코드를 디버그, 이해, 검토할 수 있습니다.

Jetpack Compose 도구 키트를 사용하는 데 익숙하지 않다면 Compose 개발자 과정을 확인하세요. 모바일 Compose의 여러 개발 원칙이 TV에도 적용됩니다. 선언적 UI 프레임워크의 일반적인 이점에 관한 자세한 내용은 Compose를 사용해야 하는 이유를 참고하세요. 자세한 내용은 GitHub의 TV용 Compose 샘플 저장소도 참고하세요.

호환성

TV용 Compose는 API 수준 21 이상을 사용하는 Android TV에서 작동합니다. TV용 Compose 버전 1.0을 사용하려면 androidx.compose 라이브러리 버전 1.3.0과 Kotlin 1.7.10이 필요합니다.

설정

Android TV에서 Jetpack Compose를 사용하는 방법은 다른 Android 프로젝트에 Jetpack Compose를 사용하는 것과 비슷합니다. 주요 차이점은 TV용 Compose가 TV에 최적화된 구성요소를 제공하고 TV에 맞는 사용자 인터페이스를 더 쉽게 만들 수 있도록 하는 라이브러리를 추가한다는 것입니다. 때로 이러한 구성요소는 androidx.tv.material3.Button 및 androidx.compose.material3.Button와 같이 TV가 아닌 구성요소와 동일한 이름을 공유합니다.

Jetpack Compose 도구 키트 종속 항목

TV용 Compose를 사용하려면 다음과 같이 앱의 build.gradle 파일에 Jetpack Compose 도구 키트 종속 항목을 포함해야 합니다.

dependencies {
   val composeBom = platform("androidx.compose:compose-bom:2024.04.01")
   implementation(composeBom)

   // General compose dependencies
   implementation("androidx.activity:activity-compose:1.8.2")

   implementation("androidx.compose.ui:ui-tooling-preview")
   debugImplementation("androidx.compose.ui:ui-tooling")

   // Compose for TV dependencies
   val tvCompose = "1.0.0-alpha10"
   implementation("androidx.tv:tv-foundation:$tvCompose")
   implementation("androidx.tv:tv-material:$tvCompose")
}

dependencies {
   def composeBom = platform('androidx.compose:compose-bom:2024.04.01')
   implementation composeBom

   // General compose dependencies
   implementation 'androidx.activity:activity-compose:1.8.2'

   implementation 'androidx.compose.ui:ui-tooling-preview'
   debugImplementation 'androidx.compose.ui:ui-tooling'

   // Compose for TV dependencies
   def tvCompose = '1.0.0-alpha10'
   implementation 'androidx.tv:tv-foundation:$tvCompose'
   implementation 'androidx.tv:tv-material:$tvCompose'
}

차이점

가능하면 TV 버전의 API를 사용하세요. 기술적으로는 Compose Material의 모바일 버전을 사용할 수 있지만 Android TV의 고유한 상호작용 스타일에는 최적화되어 있지 않습니다. 또한 TV용 Compose의 Compose Material과 Compose Material을 함께 사용하면 예기치 않은 동작이 발생할 수 있습니다. 예를 들어 각 라이브러리에는 자체 MaterialTheme 객체가 있으므로 두 버전을 모두 사용하면 색상, 서체 또는 도형이 일관되지 않을 수 있습니다.

다음 표에는 TV와 모바일의 종속 항목 차이가 요약되어 있습니다.

추가 자료

다음 가이드에서 TV에 최적화된 환경을 구축하는 방법을 알아보세요.

• 카탈로그 탐색 화면
• 세부정보 화면