web-dev-qa-db-fra.com

Squelette d'application pour prendre en charge plusieurs écrans

Comme nous le savons Android fourni avec divers appareils ayant des fonctionnalités, une résolution et une taille d'écran différentes, donc lors du développement d'une application prenant en charge plusieurs écrans (petits et grands), il y a un obstacle de taille et de disposition .

Cela conduit à différentes combinaisons de tailles d'écran, résolutions et DPI et crée tout un défi lors de la conception et du développement pour les appareils Android Android. Alors que certains autres fabricants (non Android) ont différentes résolutions et DPI, ils partagent la même taille d'écran et les résolutions suivent le même rapport d'aspect. Par conséquent, une image peut être créée pour s'adapter aux appareils non Android Android.

Ma question est la suivante: existe-t-il un flux ou une architecture appropriée à suivre pour répondre à l'exigence?

enter image description here

N'oubliez pas que nous avons des tablettes de taille et de résolution différentes.

Je suis conscient que Développeur Android contient ces informations mais ma vue est de la mise en œuvre.

D'après mes connaissances, ce que j'ai compris, c'est que pour concevoir des graphiques Android graphiques, même le programmeur doit connaître le concept de conception.

androidandroid-layoutscreen
89
Azhar Shaikh

Enfin créé une structure qui gère les dispositions et les icônes pour plusieurs écrans.

Android généralise l'affichage des appareils en catégories en fonction de deux paramètres:

  • Taille de l'écran, taille physique de l'affichage (mesurée en diagonale)
  • Densité d'écran, densité physique de pixels de l'affichage (en pixels par pouce ou ppp) `

Pour déterminer rapidement la taille et la densité de l'écran, veuillez installer l'application " Quelle est ma taille " pour Android.

Taille de l'écran

Android définit quatre tailles d'écran généralisées:

 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches
  • La plupart des téléphones sont classés comme petits ou normaux (environ 3 à 4 pouces en diagonale). Mais maintenant, il existe de nombreux téléphones à grand écran tels que Galaxy S4, HTC One, Xperia Z
  • Une petite tablette comme la Samsung Galaxy Tab est classée comme grande (plus de 4 pouces)
  • Extra-large s'applique aux gros appareils, par exemple les grandes tablettes

Android définit quatre densités d'écran généralisées:

 Qualifier         Description         Nominal value

 ldpi              low density          120 ppi
 mdpi              medium density       160 ppi
 hdpi              high density         240 ppi
 xhdpi             extra high density   320 ppi

Typiquement:

  • la taille de l'écran a le plus d'impact sur la disposition de vos applications
  • la densité de l'écran a le plus d'impact sur votre image et vos ressources graphiques

Il est répertorié ici la différence en pourcentage de l'écran de l'appareil

  • Ldpi- 75%
  • Mdpi- 100% (base selon Android)
  • Hdpi- 150%
  • XHdpi- 200%

enter image description here

Mais comme nous savons maintenant que la plupart des appareils sont livrés avec 480X800 donc je considère cela comme un appareil basé, donc notre nouveau calcul aimera ça

  • Ldpi- 50%
  • Mdpi- 66,67%
  • Hdpi- 100%
  • XHdpi- 133,33%

ce qui signifie que la première icône et le design seront créés pour 480X800 uniquement et ensuite pour les autres (c'est-à-dire Ldpi, Mdpi, Xhdpi).

Il y a des images qui sont communes à toutes les mises en page et doivent être uniformes en couleur et en forme (pas de forme complexe, pas de courbe) donc pour ce type d'image nous créons 9patch Qui doit être mis en "dessinable (sans suffixe) ) ". Pour créer une image 9Patch, vous pouvez utiliser DrawNinePatch ou BetterNinePatch

Maintenant, renommez simplement vos images en fonction des normes Android et complétez votre application avec hdpi, puis prenez simplement le dossier drawable-hdpi Et ouvrez Adode Photoshop (recommandé) créer - Action de taille multiple (changez simplement la taille en fonction du rapport en pourcentage) une fois Action créée pour toutes les tailles puis faites juste Automatisation par lots et donne la source (drawable-hdpi) et la destination (drawable-ldpi, drawable-mdpi, drawable-xdpi).

La raison pour laquelle je vous insiste pour utiliser Photoshop car il redimensionnera automatiquement votre image avec Actions et un autre point positif est que vous n'avez pas besoin de renommer le fichier (il attribuera le même nom que l'original).

une fois que vous avez terminé avec la création de toutes les images, actualisez votre projet et testez-le.

Parfois, il peut être possible que la mise en page qui prend en charge l'écran (xhdpi, hdpi, mdpi) soit coupée en petit écran (ldpi), pour cela, créez simplement un dossier de mise en page (layout-small) séparé et ajoutez ScrollView(la plupart). C'est ça.

Tablette Les tablettes sont classées en deux tailles.

  1. 7 "(1024X (600-48 (barre de navigation))) = 1024X552 (grand format)
  2. 10 "(1280X (800-48 (barre de navigation))) = 1280X752 (drawable-xlarge)

En cela, nous devons créer une image pour l'écran et les mettre en conséquence

Donc, dans l'ensemble, nous aurons ce dossier dans notre application pour prendre en charge plusieurs écrans.

drawable
drawable-ldpi
drawable-mdpi
drawable-hdpi
drawable-xhdpi
drawable-large
drawable-xlarge

sera une combinaison plus qualificative avec Screen size and Screen density

drawable-large-ldpi
drawable-large-mdpi
drawable-large-hdpi
drawable-large-xhdpi

plus de qualificatif avec Screen density and Version

drawable-ldpi-v11
drawable-mdpi-v11
drawable-hdpi-v11
drawable-xhdpi-v11

et plus de qualificatif avec Screen size and Version

drawable-large-v11
drawable-xlarge-v11

et plus de qualificatif avec Smallest width concept(SW)

 drawable-sw???dp

De plus, dans Android V3.0 Honeycomb, ils ont introduit un nouveau concept de SW(smallest width) dans lequel l'appareil est classé en fonction de la largeur de l'écran, donc si nous créons un dossier nommé drawable-sw360dp alors l'appareil avec 720dp (largeur ou hauteur) utilisera les ressources du dossier this.

par exemple pour trouver le Samsung Galaxy S3 dp à suffixer à drawable-sw? dp
Avec référence à Calcul DP , Si vous souhaitez prendre en charge votre mise en page ou dessiner sur S3, le calcul dit

px = Largeur de l'appareil = 720
dpi = Densité de l'appareil = 320

formule donnée

    px = dp * (dpi / 160)

formule d'échange car nous avons la valeur de px

    dp = px / (dpi / 160)

maintenant mettre de la valeur,

     dp= 720 / (320/160);
     dp=360.

donc drawable-sw360dp fera le travail

Obtenez la configuration de votre appareil à partir de GsmArena De la même manière, vous pouvez également créer un dossier en fonction de l'appareil Android version de l'API, c'est-à-dire drawable-hdpi-v11`, donc l'appareil qui a API11 et le est Hdpi alors il utilisera ces ressources.

Conseils supplémentaires:

  • Utiliser des dispositions relatives, dp, sp et mm

    Unités dp - pixels indépendants du périphérique normalisés à 1 pixel physique sur un écran de 160 ppp, c'est-à-dire densité moyenne. Échelle à l'exécution. Utiliser pour les dimensions des éléments d'écran

    unités sp - pixels mis à l'échelle, spécifiés en tant que valeurs à virgule flottante, basés sur les unités dp mais également mis à l'échelle pour le paramètre de préférence de taille de police de l'utilisateur. Échelle à l'exécution. Utilisez pour les tailles de police

    vous devez toujours utiliser RelativeLayout pour les mises en page; AbsoluteLayout est obsolète et ne doit pas être utilisé.

  • Utilisez les formats d'image appropriés - PNG contre JPEG

    Android "prefers" PNG for bitmap image files, "accepts" JPEG, and "discourages" GIF.

    Cependant, PNG et JPEG ne sont pas équivalents. Ils ont des compromis de qualité différente, et PNG n'est pas toujours le meilleur:

    [~ # ~] jpeg [~ # ~] peut offrir jusqu'à 50% de réduction de taille de fichier par rapport à PNG, ce qui est important si votre application est une image -intensif

    Un JPEG "avec perte" de meilleure qualité peut sembler meilleur qu'un PNG "sans perte" hautement compressé, pour la même taille de fichier

  • Ajoutez des étiquettes à vos images et graphiques pour le débogage

  • Utilisez l'élément supports-screens

  • Configurez vos émulateurs avec de vraies valeurs d'appareil

    Classiquement, les systèmes de bureau s'affichent à 72 ppp (Mac) ou 96 ppp (Windows, Linux). Par rapport au mobile, les écrans de bureau sont toujours de faible densité.

    Configurez toujours vos Android émulateurs pour imiter les valeurs réelles des appareils, et toujours les mettre à l'échelle pour émuler la densité des appareils.

    Dans Eclipse, il est facile de créer plusieurs émulateurs (dans la barre de menus Eclipse, sélectionnez Fenêtre> Gestionnaire AVD> Nouveau ) configuré avec des valeurs pour des appareils réels:

    Nommez l'émulateur du périphérique réel qu'il émule Spécifiez la résolution, n'utilisez pas de tailles génériques intégrées Définissez la densité du périphérique pour correspondre au périphérique réel (dans le volet du matériel, définissez Abstracted LCD Propriété densité réelle, toujours une valeur entière)

    Lorsque vous lancez l'appareil, sélectionnez toujours Ajuster l'affichage à la taille réelle et saisissez la dimension réelle de l'écran en pouces.

    Si vous ne définissez pas la densité de périphérique, l'émulateur prend par défaut la faible densité et charge toujours les ressources spécifiques à ldpi. La résolution (dimensions en pixels) sera correcte, mais vos ressources d'image dépendant de la densité ne s'afficheront pas comme prévu.

    Bien sûr, rien de ce que vous faites ne reproduira une qualité d'image de densité supérieure sur un écran de bureau de densité inférieure.

Voici les données collectées pendant une période de 7 jours se terminant le 1er octobre 2012. Pour voir les dernières statistiques sur Android version de la plateforme, allez ici

Basé sur la taille de l'écran

enter image description here

Basé sur la densité d'écran

enter image description here

146
Azhar Shaikh

Les concepteurs doivent créer des conceptions de base de

base size of mdpi devices * density conversion factor of highest supported density bucket
taille. La taille de l'écran de base est de 320 X 480 px et les compartiments de densité sont les suivants:

  • ldpi: 0,75
  • mdpi: 1.0 (densité de base)
  • hdpi: 1.5
  • xhdpi: 2.0
  • xxhdpi: 3.0
  • xxxhdpi: 4.0

Et pour gérer l'espace disponible supplémentaire sur Android doivent utiliser des composants extensibles dans les deux sens (horizontalement et verticalement). Des informations détaillées sont disponibles ici:

http://vinsol.com/blog/2014/11/20/tips-for-designers-from-a-developer/

1
Alok Vaish