Style

Il est essentiel de styliser efficacement les widgets pour obtenir une expérience visuelle une expérience utilisateur cohérente. Cette section explore les concepts clés et des techniques pour définir la couleur et la typographie afin de créer les et des widgets Android attrayants.

Couleur

Utilisez la couleur pour exprimer le style et communiquer du sens. Définir des couleurs appropriées des couleurs de votre widget sont essentielles pour la lisibilité, la personnalisation l'identité de marque de votre application.

Utilisez les rôles et les jetons de couleur Material pour respecter les consignes d'accessibilité en matière de contraste. et prendre en charge les caractéristiques de couleurs dynamiques, telles que les couleurs générées par l'utilisateur, les couleurs sombres ou thèmes clairs.

Pour en savoir plus, consultez les Consignes relatives aux couleurs Material Design.

Thèmes dynamiques

À partir d'Android 12, un widget peut utiliser les couleurs du thème de l'appareil pour les boutons, des arrière-plans et d'autres composants. Cela assure la cohérence visuelle des widgets, des icônes de l'écran d'accueil et des fonds d'écran, offrant aux utilisateurs Android une expérience utilisateur plus cohérente. L'utilisation des jetons de couleur fournis widget s'intègre aux thèmes fournis par les différents appareils les fabricants et les thèmes dynamiques définis par l'utilisateur.

Figure 1:Image d'un widget avec des jetons de couleur mis en évidence.

Mode clair et mode sombre

Le mode sombre est une version faible luminosité de l'interface utilisateur de l'appareil, qui affiche des images principalement sombres couleurs de surface. Les utilisateurs passent de plus en plus en mode sombre pour autonomie de la batterie et confort visuel. Si votre widget ne s'adapte pas au mode sombre, ne seront pas à leur place et pourraient frustrer les utilisateurs.

Figure 2:Un widget en mode clair sur l'écran de gauche et sombre sur l'écran de droite

Typographie

La typographie contribue à rendre l'écriture lisible et belle. Utilisez des tailles de police et afin d'établir une hiérarchie claire, en guidant l'œil de l'utilisateur vers la les éléments importants. Faites attention aux espaces entre les lignes et les lettres (crénage) pour améliorer la lisibilité, en particulier pour les petits écrans un espace limité d'un widget.

Hiérarchie

La hiérarchie est communiquée par les différences d’épaisseur de la police, de la taille, de la hauteur de ligne, et l'espacement des lettres. L'échelle de type mise à jour organise les styles de texte en cinq rôles nommés pour décrire leurs objectifs. Les cinq styles de texte sont l'affichage, titre, titre, sous-titre et corps du texte. Ces nouveaux rôles sont indépendants de l'appareil, ce qui permet une application plus facile dans différents cas d'utilisation.

Figure 3:Widget illustrant l'utilisation de différents types d'échelles