Bonnes pratiques et pratiques adaptatives

Les applications adaptatives sont compatibles avec les écrans de toutes tailles: tout l'écran de l'appareil, redimensionnable Fenêtres en mode multifenêtre, en orientation portrait et paysage, pliée et dépliés des appareils pliables.

Une courte liste de paramètres de configuration et d'API vous permet de créer des modèles applications. Toutefois, certains paramètres et API obsolètes sont incompatibles avec les applications adaptatives. et doit être évitée.

Redimensionnement

Les applications adaptatives sont compatibles avec le redimensionnement des applications et le mode multifenêtre.

L'attribut resizeableActivity de <activity> et Les éléments du fichier manifeste <application> activent ou désactivent le mode multifenêtre. sur Android 11 (niveau d'API 30) ou version antérieure. Sur Android 12 (niveau d'API 31) et plus élevés, les grands écrans sont compatibles avec le mode multifenêtre, quelle que soit . Pour en savoir plus, consultez Prendre en charge le mode multifenêtre.

✓ À faire

Autorisez votre application à participer à des scénarios multifenêtres et multitâches pour d'augmenter la productivité et la satisfaction des utilisateurs.

Définissez resizeableActivity="true" si votre application cible des niveaux d'API inférieurs à 24. Sinon, oubliez-le : il s'agit de true par défaut sur Android 7.0 (API niveau 24) ou supérieur.

✗ À ne pas faire

Ne définissez resizeableActivity="false" pour aucun niveau d'API. Ne pas exclure votre application des cas d'utilisation impliquant le mode multifenêtre.

Orientation

Les applis adaptatives sont compatibles avec les orientations portrait et paysage, quel que soit l'écran ou le mode de fenêtrage.

Le paramètre du fichier manifeste screenOrientation limite l'orientation de l'activité.

✓ À faire

Supprimez le paramètre screenOrientation du fichier manifeste de votre application.

Le verrouillage de l'orientation des applications n'empêche pas les changements de taille de la fenêtre. Les applications sont redimensionné lorsqu'ils passent en mode multifenêtre, lorsqu'un appareil est plié ou déplié, ou lorsqu'une fenêtre de format libre est redimensionnée. Votre application doit être compatible avec les modifications de fenêtre quel que soit le paramètre de l'attribut screenOrientation.

✗ À ne pas faire

Ne limitez pas l'orientation de l'activité. Les applications qui verrouillent l'orientation s'affichent au format letterbox sur les appareils à grand écran et les tailles de fenêtre incompatibles.

Les applications au format letterbox sont susceptibles d'être moins visibles sur Google Play pour les cas suivants : les tablettes, les pliables et les appareils ChromeOS.

Format

Étant donné que la taille de l'écran et de la fenêtre varie, leurs formats aussi, de grande taille à étroite, au carré, au court et large.

Les paramètres du fichier manifeste minAspectRatio et maxAspectRatio limitent les proportions de votre application à des valeurs codées en dur.

✓ À faire

Adaptez votre application à l'écran, quelles que soient les dimensions relatives.

Supprimer les paramètres minAspectRatio et maxAspectRatio de votre application fichier manifeste. Ou assurez-vous que votre application est redimensionnable et que son format s'occupe tout seul (voir la section Redimensionnement).

✗ À ne pas faire

N'essayez pas de contrôler les dimensions relatives de votre application. Si votre application s'exécute sur un à l'écran ou dans une fenêtre dont le format n'est pas compatible format de l'application, elle est au format letterbox.

Sur Android 14 (niveau d'API 34) ou version ultérieure, les utilisateurs peuvent ignorer le format de l'application pour développer les applications au format letterbox afin qu'elles occupent toute la zone d'affichage disponible. Voir Appareil mode de compatibilité.

Taille de la fenêtre

L'optimisation des mises en page pour différentes tailles d'écran le design adaptatif. Les applications adaptatives se concentrent sur la taille de la fenêtre de l'application plutôt que sur l'appareil la taille de l'écran. Lorsque l'application est en plein écran, la fenêtre de l'application correspond à l'écran de l'appareil.

Les classes de taille de fenêtre constituent un moyen systématique de déterminer et de catégoriser la taille de la fenêtre de l'application. Adapter votre application en changeant la mise en page en fonction de la fenêtre la classe de taille de votre application change.

✓ À faire

Évaluez la taille de la fenêtre de votre application en fonction des classes de taille de fenêtre.

Pour déterminer la classe de taille de fenêtre, utilisez currentWindowAdaptiveInfo(). fonction de niveau supérieur de la bibliothèque adaptative de Compose Material 3. Pour plus plus d'informations, consultez la page Créer des applications adaptatives.

✗ À ne pas faire

Ne négligez pas l'utilité des définitions de classe de taille de fenêtre et la et des API intégrées. N'utilisez pas d'API obsolètes pour calculer la taille de la fenêtre.

API obsolètes

Les anciennes API de plate-forme ne mesurent pas correctement la fenêtre de l'application. certaines mesurent l'écran de l'appareil, certains excluent la décoration du système.

✓ À faire

Utiliser WindowManager#getCurrentWindowMetrics() et WindowMetrics#getBounds() pour obtenir la taille de la fenêtre de l'application. Utilisez WindowMetrics#getDensity() pour obtenir la densité d'affichage

✗ À ne pas faire

N'utilisez pas les API Display obsolètes suivantes pour déterminer la taille de la fenêtre:

Compose

Jetpack Compose est conçu pour le développement adaptatif d'UI. Pas de XML, pas de mise en page ni de qualificatifs de ressources. Composables sans état basés sur Kotlin uniquement comme Column, Row et Box, qui décrivent votre UI, et les modificateurs telles que offset, padding et size, qui ajoutent un comportement à l'interface utilisateur éléments.

✓ À faire

Compiler avec Compose Tenez-vous informé des dernières fonctionnalités et versions.

✗ À ne pas faire

Ne vous fiez pas à une technologie obsolète. Ne laissez pas votre application devenir obsolète.

Bibliothèque Material 3 adaptative de Compose

La bibliothèque adaptative de Compose Material 3 fournit des composants et des API qui faciliter le développement d'applications adaptatives.

✓ À faire

Utilisez les API suivantes pour rendre votre application adaptative:

  • NavigationSuiteScaffold: permet de passer de la barre de navigation à la rail de navigation en fonction de la classe de taille de fenêtre de l'application.
  • ListDetailPaneScaffold: met en œuvre la mise en page canonique "Liste/Détail". Adapte la mise en page à la taille de la fenêtre de l'application.
  • SupportingPaneScaffold: implémente le volet canonique secondaire. mise en page.
✗ À ne pas faire

Ne réinventez pas la roue. Ne passez pas à côté des gains de productivité des développeurs fournies par toutes les bibliothèques Jetpack Compose.

Mises en page

Les utilisateurs s'attendent à ce que les applis exploitent au mieux l'espace d'affichage disponible avec du contenu ou des commandes améliorées.

Les applications adaptatives optimisent la mise en page en fonction des modifications apportées à l'écran, en particulier : en cas de changement de la taille de la fenêtre de l'application ou de la position de l'appareil.

✓ À faire

Modifiez les composants de l'UI lorsque la taille de la fenêtre change pour tirer parti des de l'espace d'affichage. Par exemple, permutez la barre de navigation inférieure utilisée sur les tailles de fenêtre pour un rail de navigation vertical sur des fenêtres moyennes et étendues. Repositionnez les boîtes de dialogue pour qu'elles soient accessibles sur tous les écrans.

Organisez le contenu dans des volets pour permettre des mises en page à plusieurs volets comme liste détaillée et volet secondaire pour l'affichage de contenu dynamique.

<ph type="x-smartling-placeholder">
</ph> ✓ À faire:activités "Liste" et "Détail" organisées à double volet.
✗ À ne pas faire

Si vous n'utilisez pas les volets de contenu, ne vous contentez pas d'étirer les éléments d'interface utilisateur pour qu'ils remplissent l'espace d'affichage disponible. Les longues lignes de texte sont difficiles à lire. Étiré boutons ont un aspect mal conçu. Si vous utilisez Modifier.fillMaxWidth, évitez nous supposons que ce comportement est adapté à toutes les tailles d'écran.

<ph type="x-smartling-placeholder">
</ph> ✗ À ne pas faire:mise en page étirée pour remplir la fenêtre dépliante.

Périphériques d'entrée

Les utilisateurs n'utilisent pas seulement l'écran tactile pour interagir avec les applications.

Les applications adaptatives sont compatibles avec les claviers, souris et stylets externes, pour vous offrir d'améliorer l'expérience utilisateur et d'améliorer leur productivité sur les facteurs de forme toutes sortes.

✓ À faire

Profitez de la fonctionnalité intégrée du framework Android pour navigation par onglet avec le clavier et clic, sélection et défilement de la souris ou du pavé tactile. Publier les raccourcis clavier de votre application dans l'Outil d'aide des raccourcis clavier.

Utilisez la bibliothèque Material 3 de Jetpack pour permettre aux utilisateurs d'écrire dans n'importe quelle le composant TextField à l'aide d'un stylet.

✗ À ne pas faire

Ne rendez pas impossible d'autres méthodes de saisie. Ne pas favoriser l'accessibilité les problèmes de performances.

Résumé

  • Créer votre application avec Compose et la bibliothèque adaptative de Material 3
  • Baser les mises en page sur les classes de taille de fenêtre
  • Créer des mises en page à plusieurs volets
  • Rendre votre application redimensionnable
  • Ne jamais verrouiller l'orientation de l'activité
  • Ne pas limiter le format
  • Prise en charge des entrées autres que tactiles
  • Éviter les API obsolètes

Elles répondent aux attentes de vos utilisateurs: optimiser votre application pour la diversité des appareils dont les utilisateurs ont besoin au quotidien.

✗ N'attendez pas. Lancez-vous dès maintenant !