Jetpack Compose Glimmer est basé sur Jetpack Compose et inclut des composables, des composants, des comportements et un thème conçus pour les lunettes d'IA avec écran. Avec Glimmer, vous pouvez créer des UI natives pour les lunettes d'IA à l'aide de Compose, ce qui vous permet de donner vie à vos applications avec moins de code, des outils puissants et des API Kotlin intuitives.
Composables Glimmer Jetpack Compose
Jetpack Compose Glimmer fournit des fonctions @Composable adaptées aux écrans de lunettes IA, telles que Text, Button et ListItem. Voici quelques caractéristiques uniques des composables Glimmer de Jetpack Compose :
- Style simplifié : les composants
Surface, par exemple, sont définis par défaut sur des arrière-plans noirs ou transparents pour optimiser l'affichage. - Couleurs par défaut optimisées : Jetpack Compose Glimmer calcule la couleur du contenu en fonction de la couleur d'arrière-plan par défaut. Les développeurs ont donc rarement besoin de définir manuellement les couleurs du texte, ce qui améliore la lisibilité sans aucun travail supplémentaire.
Mise au point différenciée : la mise au point est indiquée par un retour visuel basé sur un contour au lieu de l'effet d'ondulation, ce qui favorise une visibilité claire.
Figure 1. Trois états de sélection dans Jetpack Compose Glimmer, qui sont différenciés à l'aide d'un retour visuel basé sur un contour. Élévation optimisée : Jetpack Compose Glimmer utilise des ombres portées limitées pour la séparation visuelle.
Figure 2. Cinq niveaux d'élévation dans Jetpack Compose Glimmer, qui sont différenciés à l'aide d'ombres portées limitées.
Composants Glimmer de Jetpack Compose
Jetpack Compose Glimmer propose son propre ensemble de composants personnalisés, semblables aux composants de Jetpack Compose, mais spécifiquement optimisés pour les exigences visuelles et interactives uniques des lunettes d'IA. Les composants Glimmer de Jetpack Compose sont personnalisables avec le thème de Jetpack Compose Glimmer et s'appuient sur des fonctionnalités Compose de niveau inférieur pour prendre en charge les méthodes de saisie utilisateur telles que l'appui et le balayage par défaut.
Pour en savoir plus sur l'utilisation d'un composant spécifique, consultez les guides suivants :
Si l'un de ces composants de haut niveau ne fonctionne pas pour votre cas d'utilisation, vous pouvez utiliser un surface pour créer un composant personnalisé. Les surfaces sont le bloc de construction le plus élémentaire de Jetpack Compose Glimmer. Il s'agit d'un canevas vierge pour tous les designs ou interactions spécifiques et personnalisés que vous souhaitez créer.
Modificateurs Glimmer Jetpack Compose
Les modificateurs de Jetpack Compose Glimmer fonctionnent de la même manière que les modificateurs Compose. Ils vous permettent d'augmenter les composables en personnalisant leur mise en page, leur apparence et leur comportement. Jetpack Compose Glimmer peut introduire des modificateurs spécifiques ou appliquer des valeurs par défaut uniques pour les performances et le retour visuel spécifiques aux lunettes.
Profondeur du scintillement Jetpack Compose
Les composants Glimmer de Jetpack Compose utilisent la profondeur pour représenter la hiérarchie, ce qui permet de distinguer visuellement les éléments qui s'affichent au-dessus d'autres cartes. La profondeur sur les lunettes d'IA est la combinaison de l'emplacement dans l'espace Z et des ombres. Pour la plupart des composants de haut niveau, tels que les éléments de liste, la profondeur est appliquée automatiquement en fonction de l'état de sélection. Lorsqu'un composant est sélectionné, il gagne en profondeur. Lorsqu'il perd la sélection, il revient à son état normal. Toutefois, pour travailler avec des composants personnalisés, vous pouvez utiliser le paramètre de profondeur sur Modifier.surface ou Modifier.depth.
Thème Jetpack Compose Glimmer
Jetpack Compose Glimmer propose un système de thématisation dédié aux lunettes d'IA.
Le thème de Jetpack Compose Glimmer implémente une palette simplifiée et optimisée de couleurs, de typographie et de formes. Cela favorise une visibilité et une concision maximales pour les lunettes IA. Tous les composants Jetpack Compose Glimmer sont conçus pour une intégration automatique aux méthodes de saisie spécifiques des lunettes d'IA. Le thème de Glimmer est exposé à l'aide de la classe GlimmerTheme.
Comme les autres thèmes de Jetpack Compose, GlimmerTheme inclut plusieurs sous-systèmes : couleurs, formes, typographie et icônes (symbolographie). Le thème Jetpack Compose Glimmer inclut également des composants Jetpack Compose Glimmer que vous pouvez personnaliser.
Couleurs
Le système de couleurs de Jetpack Compose Glimmer inclut sept couleurs dans sa palette optimisée, conçues pour une visibilité et une concision maximales sur les écrans des lunettes d'IA où les valeurs noires ne s'affichent pas.
GlimmerTheme.Notez que les couleurs "Sur ..." ne sont pas exposées via GlimmerTheme. Ces couleurs sont calculées automatiquement par le système en fonction de la couleur d'arrière-plan.
Ces couleurs sont exposées via GlimmerTheme.colors.primary, avec des valeurs pour chaque rôle de couleur, comme décrit dans le tableau suivant :
Rôle de couleur |
Valeurs par défaut |
|---|---|
principale |
#A8C7FA |
secondaire |
#4C88E9 |
positif |
#4CE995 |
négatif |
#F57084 |
surface |
#000000 |
outline |
#606460 |
outlineVariant |
#42434A |
Notez que, bien que surface, outline et outlineVariant soient indiqués comme personnalisables, nous vous recommandons vivement de ne pas modifier ces valeurs.
Formes
Le système de formes de Jetpack Compose Glimmer définit un ensemble de traitements d'angle et de formes géométriques standards pour les composants, conçus pour créer un langage visuel cohérent et minimaliste sur les interfaces utilisateur des lunettes d'IA, avec toutes les formes exposées via GlimmerTheme.shapes.
Typographie
Le système de typographie de Jetpack Compose Glimmer comprend six styles de typographie pour la lisibilité et la concision sur les écrans des lunettes d'IA. Ces styles sont conçus pour maximiser le contraste et améliorer la lisibilité du texte grâce à des épaisseurs plus importantes, un espacement des lettres plus large et des hauteurs de ligne appropriées. Ces styles sont exposés via GlimmerTheme.typography.
Icônes
Le système d'icônes de Jetpack Compose Glimmer est conçu pour s'intégrer de manière cohérente au langage visuel simplifié des interfaces utilisateur des lunettes d'IA, en utilisant souvent des formes arrondies comme Material Symbols Rounded pour une lisibilité optimale.