एक नज़र में जानकारी देने वाली थीम लागू करना

Glance, रंग वाली थीम को मैनेज करने के लिए एक एपीआई उपलब्ध कराता है. 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 में पास किया जा सकता है. Glance, Material 2 के लिए androidx.glance:glance-material इंटरऑपरेबिलिटी लाइब्रेरी और Material 3 के रंगों के लिए androidx.glance:glance-material3 उपलब्ध कराता है.

उदाहरण के लिए, Glance की कलर स्कीम बनाने के लिए, ColorProviders एपीआई को अपने ऐप्लिकेशन के मौजूदा मटीरियल कलर दें. इसके बारे में यहां दिए गए स्निपेट में बताया गया है:

// 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 Drawables 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

ध्यान दें: Android रिसॉर्स फ़ोल्डर स्ट्रक्चर का इस्तेमाल करके, किसी भी तरह के कॉन्फ़िगरेशन (जैसे, values-night) के लिए अलग-अलग शेप या अन्य रिसॉर्स तय किए जा सकते हैं.