Glance fournit une API pour gérer le thème de couleurs. Pour les autres attributs de style,
comme TextStyle
, déclarez les variables de niveau supérieur.
Ajouter des couleurs
Glance fournit une implémentation des couleurs Material prête à l'emploi. Pour utiliser la
thème intégré, encapsulez votre composable de premier niveau avec GlanceTheme
, comme indiqué dans
l'exemple suivant.
Sur les appareils qui prennent en charge les couleurs dynamiques, ce thème est dérivé du
les couleurs de la
plateforme spécifiques à l’utilisateur. Sur les autres appareils, il s'agit de
de référence. Utiliser GlanceTheme.colors
pour appliquer un style avec les couleurs du retour à la ligne
d'un thème. Vous pouvez utiliser ces valeurs du thème partout où une couleur est nécessaire.
override suspend fun provideGlance(context: Context, id: GlanceId) { provideContent { GlanceTheme { MyContent() } } } @Composable private fun MyContent() { Image( colorFilter = ColorFilter.tint(GlanceTheme.colors.secondary), // ... ) }
Pour personnaliser le thème, vous pouvez transmettre colors
à GlanceTheme
. Aperçu
fournit la bibliothèque d'interopérabilité androidx.glance:glance-material
pour
Material 2 et androidx.glance:glance-material3
pour les couleurs Material 3
de l'assistance.
Par exemple, fournissez les couleurs Material existantes de votre application au ColorProviders
.
API pour créer un jeu de couleurs Glance, comme illustré dans l'extrait suivant:
// 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 ) }
Fournissez les couleurs du schéma à l'élément GlanceTheme
qui encapsule tous vos
composables, comme illustré dans l'exemple suivant:
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), // ... ) }
Si vous préférez utiliser les couleurs dynamiques du fond d'écran lorsqu'elles sont compatibles et que votre
jeu de couleurs de l'application. Sinon, vous pouvez transmettre le jeu de couleurs de votre application de manière conditionnelle.
dans GlanceTheme
. Ce processus est illustré dans l'extrait suivant:
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), // ... ) }
Ajouter des formes
Pour ajouter des formes ou des ombres spéciales à votre widget d'application, utilisez l'application Android API Drawables
Par exemple, l'extrait de code suivant montre comment créer un drawable (une forme):
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="16dp"/>
<stroke android:color="@color/outline_color" android:width="1dp"/>
</shape>
Fournissez-le au composable cible:
GlanceModifier.background( imageProvider = ImageProvider(R.drawable.button_outline) )