Bir Bakışta temasını uygulama

Glance, renk temasını yönetmek için bir API sağlar. TextStyle gibi diğer stil özellikleri için üst düzey değişkenler bildirin.

Renk ekle

Glance, malzeme renklerinin kutudan çıktığı gibi uygulanmasını sağlar. Yerleşik temayı kullanmak için üst düzey beste dosyanızı aşağıdaki örnekte gösterildiği gibi GlanceTheme ile sarmalayın.

Dinamik renkleri destekleyen cihazlarda bu tema, kullanıcıya özel platform renklerinden türetilir. Diğer cihazlarda ise bu, Malzeme temel temasına geri döner. Sarmalanmış temadaki renklerle stil belirlemek için GlanceTheme.colors kullanın. Bu değerleri temada rengin gerekli olduğu her yerde kullanabilirsiniz.

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

    provideContent {
        GlanceTheme {
            MyContent()
        }
    }
}

@Composable
private fun MyContent() {

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

    )
}

Temayı özelleştirmek için colors öğesini GlanceTheme öğesine aktarabilirsiniz. Glance, Materyal 2 için androidx.glance:glance-material birlikte çalışabilirlik kitaplığı ve Materyal 3 renk desteği için androidx.glance:glance-material3 sunar.

Örneğin, bir Glance renk şeması oluşturmak için aşağıdaki snippet'te gösterildiği gibi uygulamanızın mevcut malzeme renklerini ColorProviders API'ye sağlayın:

// 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
    )
}

Şemadaki renkleri, tüm bestelerinizi saran GlanceTheme öğesi için aşağıdaki örnekte gösterildiği gibi sağlayın:

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),
        // ...
    )
}

Desteklendiğinde duvar kağıdındaki dinamik renkleri, aksi halde uygulamanızın renk şemasını kullanmayı tercih ederseniz GlanceTheme içinde uygulamanızın renk şemasını koşullu olarak aktarabilirsiniz. Bu metin, aşağıdaki snippet'te gösterilir:

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),
        // ...
    )
}

Şekil ekle

Uygulama widget'ınıza özel şekiller veya gölgeler sağlamak için Android Drawables API'yi kullanın.

Örneğin, aşağıdaki snippet'te çekilebilir bir şekil (şekil) nasıl oluşturulacağı gösterilmektedir:

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

Bunu composable hedefe sağlayın:

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