Glance 테마 구현

Glance는 색상 테마를 관리하는 API를 제공합니다. 다른 스타일 속성의 경우 TextStyle와 같은 최상위 수준 변수를 선언하세요.

색상 추가

Glance는 즉시 사용 가능한 Material 색상을 구현합니다. 기본 제공 테마에서 다음과 같이 최상위 컴포저블을 GlanceTheme로 래핑합니다. 다음 예시를 참고하세요.

동적 색상을 지원하는 기기에서 이 테마는 사용자별 플랫폼 색상을 사용할 수 있습니다. 다른 기기에서는 Material 기준 테마입니다. GlanceTheme.colors을 사용하여 래핑된 색상의 색상으로 스타일 지정 있습니다. 색상이 필요한 곳에 테마의 이러한 값을 사용하면 됩니다.

override suspend fun provideGlance(context: Context, id: GlanceId) {

    provideContent {
        GlanceTheme {
            MyContent()
        }
    }
}

@Composable
private fun MyContent() {

    Image(
        colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
        // ...

    )
}
GlanceSnippets.kt

테마를 맞춤설정하려면 colors를 GlanceTheme에 전달하면 됩니다. 한눈에 보기 androidx.glance:glance-material 상호 운용성 라이브러리를 제공합니다. Material 2 및 Material 3 색상의 androidx.glance:glance-material3 도움이 될 수 있습니다

예를 들어 앱의 기존 머티리얼 색상을 ColorProviders에 제공합니다. API를 사용하여 다음 스니펫과 같이 Glance 색 구성표를 만듭니다.

// Remember, use the Glance imports
// import androidx.glance.material3.ColorProviders

// Example Imports from your own app
// import com.example.myapp.ui.theme.DarkColors
// import com.example.myapp.ui.theme.LightColors

object MyAppWidgetGlanceColorScheme {

    val colors = ColorProviders(
        light = LightColors,
        dark = DarkColors
    )
}
GlanceSnippets.kt

스키마의 색상을 모든 구성을 래핑하는 GlanceTheme에 제공합니다. 아래 예와 같이 컴포저블을 사용할 수 있습니다.

override suspend fun provideGlance(context: Context, id: GlanceId) {
    // ...

    provideContent {
        GlanceTheme(colors = MyAppWidgetGlanceColorScheme.colors) {
            MyContent()
        }
    }
}

@Composable
private fun MyContent() {

    Image(
        colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
        // ...
    )
}
GlanceSnippets.kt

지원되는 경우 배경화면에서 동적 색상을 사용하고 싶은 경우 그러지 않으면 앱의 색 구성표를 조건부로 전달할 수 있습니다. GlanceTheme에 포함 다음 스니펫에 나와 있습니다.

override suspend fun provideGlance(context: Context, id: GlanceId) {

    provideContent {
        GlanceTheme(
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S)
                GlanceTheme.colors
            else
                MyAppWidgetGlanceColorScheme.colors
        ) {
            MyContent()
        }
    }
}

@Composable
private fun MyContent() {
    // ...
    Image(
        colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary),
        // ...
    )
}
GlanceSnippets.kt

도형 추가

앱 위젯에 특별한 모양이나 그림자를 제공하려면 Android 드로어블 API.

예를 들어, 다음 스니펫은 드로어블 (도형)을 생성하는 방법을 보여줍니다.

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="16dp"/>
    <stroke android:color="@color/outline_color" android:width="1dp"/>
</shape>
button_outline.xml

타겟 컴포저블에 제공합니다.

GlanceModifier.background(
    imageProvider = ImageProvider(R.drawable.button_outline)
)
GlanceSnippets.kt

이전
Glance로 UI 빌드
다음
Glance 상호 운용성