Les pixels indépendants de la densité (dp) et les pixels évolutifs (sp) sont essentiels pour créer des mises en page et présenter des polices qui répondent de manière uniforme au large éventail de densités d'écran, de classes de taille, de facteurs de forme et de formats qui composent les appareils Android.
Prises de possession
- Si vous utilisez une grille de référence, tenez-vous-en aux mesures de 4 et 8.
- Notez les spécifications en dp et en sp, plutôt qu'en pixels.
- Exportez des graphiques bitmap/raster pour tous les buckets.
- Concevez vos applications selon un état d'esprit réactif en tenant compte de classes de tailles, de résolutions et de formats différents.
- Pixels indépendants de la densité (dp): les pixels indépendants de la densité sont des unités flexibles qui s'adaptent pour avoir des dimensions uniformes sur n'importe quel écran. Elles sont basées sur la densité physique de l'écran. Ces unités sont relatives à un écran de 160 ppp (points par pouce), sur lequel 1 dp équivaut à 1 px.
- Pixels évolutifs (sp): les pixels évolutifs ont la même fonction que les dp, mais pour les polices. La valeur par défaut de "sp" est identique à celle de "dp". Le système Android calcule la taille de police réelle à utiliser en fonction de l'appareil et des préférences de l'utilisateur définies dans l'application Paramètres de son appareil Android.
La principale différence entre ces unités de mesure est que les pixels évolutifs conservent les paramètres de police d'un utilisateur. Les utilisateurs qui ont des paramètres de texte plus grands pour l'accessibilité voient les tailles de police correspondant à leurs préférences de taille de texte. Découvrez comment modifier la taille de la police dans Compose.
Android utilise ces unités pour faciliter la mise à l'échelle et la traduction sur une gamme d'appareils et de résolutions.
Buckets de densité
Les écrans haute densité ont plus de pixels par pouce que les écrans basse densité. Par conséquent, les éléments d'interface utilisateur de mêmes dimensions en pixels apparaissent plus grands sur les écrans basse densité et plus petits sur les écrans haute densité. C'est pourquoi vous ne devez pas déclarer les mesures en pixels.
Android regroupe les plages de densités d'écran en "buckets" et les utilise pour fournir l'ensemble optimal d'éléments à votre appareil. Les buckets de densité les plus couramment utilisés sont mdpi, hdpi, xhdpi, xxhdpi et xxxhdpi (nodpi et anydpi font référence à un bucket qui ne s'adapte pas à la résolution de l'appareil, généralement utilisé pour les drawables vectoriels). Ils correspondent chacun à un fichier de ressources de votre application.
Pour calculer la valeur dp:
dp = (largeur en pixels x 160) / densité d'écran
Grilles
Grille de référence
L'intégration d'une grille sous-jacente permet de créer un espacement et un alignement cohérents dans votre interface utilisateur. L'UI Android utilise une grille de 8 dp pour la mise en page, les composants et l'espacement.
Les éléments plus petits, tels que les icônes, le type et certains éléments des composants, sont mieux adaptés à une grille de 4 dp.
Grille de colonnes
Les colonnes créent une structure de grille pour fournir une définition verticale à une mise en page en divisant le contenu dans le corps. Le contenu est placé dans les zones de l'écran qui contiennent des colonnes. Ils doivent s'aligner sur une grille sous-jacente pour aligner le contenu, mais leur dimensionnement doit rester flexible. Découvrez comment configurer une grille de colonnes et appliquer du contenu dans la section Principes de base de la mise en page.
Consultez la page Mises en page canoniques de Material 3 pour en savoir plus sur la création de mises en page flexibles pour différents facteurs de forme.
Classes de taille
Les classes de taille de fenêtre sont un ensemble de points d'arrêt de fenêtre d'affichage définis qui vous aident à concevoir, développer et tester des mises en page d'applications responsives et adaptatives. Android divise les classes de taille de fenêtre en trois classes: compacte, moyenne et grande. En savoir plus sur les classes de taille de fenêtre
Formats
Le rapport hauteur/largeur correspond à la proportion de la largeur d'un élément par rapport à sa hauteur. Les proportions sont écrites au format largeur:hauteur.
Pour maintenir la cohérence de votre mise en page, utilisez un format cohérent sur des éléments tels que les images, les surfaces et la taille de l'écran.
Les formats suivants sont recommandés pour l'ensemble de votre interface utilisateur:
- 16:9
- 3:2
- 4:3
- 1:1
- 3:4
- 2:3