Compose로 XML 테마 이전

기존 앱에는 뷰를 위한 테마 및 스타일 설정이 상당히 많을 수 있습니다. 기존 앱에 Compose를 도입할 경우 Compose 화면에 MaterialTheme을 사용하려면 테마를 이전해야 합니다. 그러면 앱의 테마 설정은 뷰 기반 테마와 Compose 테마라는 두 가지 정보 소스를 갖습니다. 스타일 설정 변경은 여러 위치에서 이루어져야 합니다.

앱을 Compose로 이전하면 기존 테마의 Compose 버전을 만들어야 합니다. 그러나 이전 과정에서 이를 더 빨리 실행할수록 XML과 Compose 테마를 모두 유지해야 하므로 유지관리 부담이 발생할 수 있습니다.

Material 테마 어댑터

앱에서 MDC-Android 라이브러리의 Theme.MaterialComponents.* 테마를 사용 중인 경우 Material 테마 어댑터 라이브러리를 사용하면 컴포저블에서 기존 뷰 기반 XML 테마의 Material 2 색상, 서체, 도형 테마 설정을 쉽게 재사용할 수 있습니다.

MdcTheme 컴포저블을 사용합니다.

import com.google.accompanist.themeadapter.material.MdcTheme

class MdcThemeExample : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // Use MdcTheme instead of M2 MaterialTheme
        // Colors, typography, and shapes have been read from the
        // View-based theme used in this Activity
        setContent {
            MdcTheme {
                // Your app-level composable here
            }
        }
    }
}
MdcThemeSnippets.kt

자세한 내용은 Material 테마 어댑터 라이브러리 문서를 참고하세요.

Material 3 테마 어댑터

앱에서 MDC-Android 라이브러리의 Theme.Material3.* 테마를 사용 중인 경우 Material 3 테마 어댑터 라이브러리를 사용하면 컴포저블에서 기존 뷰 기반 XML 테마의 Material 3 색상, 서체, 도형 테마 설정을 쉽게 재사용할 수 있습니다.

Mdc3Theme 컴포저블을 사용합니다.

import com.google.accompanist.themeadapter.material3.Mdc3Theme

class Mdc3ThemeExample : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // Use Mdc3Theme instead of M3 MaterialTheme
        // Color scheme, typography, and shapes have been read from the
        // View-based theme used in this Activity
        setContent {
            Mdc3Theme {
                // Your app-level composable here
            }
        }
    }
}
Mdc3ThemeSnippets.kt

자세한 내용은 Material 3 테마 어댑터 라이브러리 문서를 참고하세요.

AppCompat 테마 어댑터

AppCompat 테마 어댑터 라이브러리를 사용하면 AppCompat XML 테마를 쉽게 재사용해 Jetpack Compose에 테마를 지정할 수 있습니다. 이 라이브러리는 컨텍스트의 테마에 있는 색상 및 글꼴 값을 사용해 M2 MaterialTheme을 만듭니다.

AppCompatTheme 컴포저블을 사용합니다.

import com.google.accompanist.themeadapter.appcompat.AppCompatTheme

class AppCompatThemeExample : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            // Colors and typography have been read from the
            // View-based theme used in this Activity
            // Shapes are the default for M2 as this didn't exist in M1
            AppCompatTheme {
                // Your app-level composable here
            }
        }
    }
}
AppCompatThemeSnippets.kt

자세한 내용은 AppCompat 테마 어댑터 라이브러리 문서를 참고하세요.

맞춤 테마 속성

핵심 테마 어댑터 라이브러리는 위의 모든 Accompanist 테마 어댑터 라이브러리에서 사용하며 다양한 XML 리소스의 Compose 변환에 관한 공통 로직을 포함합니다. 이러한 리소스 유틸리티는 맞춤 테마 속성을 파싱하는 데 사용할 수 있습니다.

자세한 내용은 핵심 테마 어댑터 라이브러리 문서를 참고하세요.

기본 구성요소 스타일

Accompanist 테마 어댑터 라이브러리는 테마가 정의된 기본 위젯 스타일을 읽지 않습니다. 이는 Compose에 기본 컴포저블의 개념이 없기 때문입니다.

자세한 내용은 Compose의 맞춤 디자인 시스템을 참고하세요.

테마 오버레이

뷰 기반 화면을 Compose로 이전할 때 android:theme 속성을 사용하는 것에 유의하세요. Compose UI 트리의 관련 부분에 새로운 MaterialTheme이 필요할 수 있습니다.