Anwendungsskelett zur Unterstützung mehrerer Bildschirme

Wie wir wissen, wird Android mit verschiedenen Geräten geliefert, die unterschiedliche Funktionen, Auflösungen und Bildschirmgrößen haben. Daher gibt es bei der Entwicklung einer Anwendung, die mehrere (kleine und große) Bildschirme unterstützt, ein Hindernis in Bezug auf Größe und Layout.

Dies führt zu unterschiedlichen Kombinationen von Bildschirmgrößen, Auflösungen und DPIs und stellt eine ziemliche Herausforderung dar, wenn es um Design und Entwicklung für Android-Geräte geht. Während einige andere Hersteller (nicht Android) unterschiedliche Auflösungen und DPI haben, haben sie die gleiche Bildschirmgröße und die Auflösungen folgen dem gleichen Seitenverhältnis. Daher kann ein Image erstellt werden, das für Nicht-Android-Geräte geeignet ist.

Meine Frage ist, ob es einen richtigen Ablauf oder eine richtige Architektur gibt, der man folgen sollte, um die Anforderung zu erfüllen?

Denken Sie daran, dass wir Tablets unterschiedlicher Größe und Auflösung haben.

Das ist mir bewusst Android-Entwickler enthält diese Informationen, aber meine Ansicht ist von der Implementierung.

Meines Wissens nach habe ich verstanden, dass zum Entwerfen von Android-Grafiken sogar Programmierer das Designkonzept kennen müssen.

Schließlich wurde eine Struktur erstellt, die Layouts und Symbole für mehrere Bildschirme handhabt.

Android verallgemeinert Geräteanzeigen in Kategorien basierend auf zwei Parametern:

• Bildschirmgröße, die physikalische Größe des Displays (diagonal gemessen)
• Bildschirmdichte, die physische Pixeldichte des Displays (in Pixel pro Zoll oder ppi).

Um die Bildschirmgröße und -dichte schnell zu bestimmen, installieren Sie bitte “Was ist meine Größe“App für Android.

Bildschirmgröße

Android definiert vier verallgemeinerte Bildschirmgrößen:

 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches  

• Die meisten Telefone werden als klein oder normal eingestuft (ungefähr 3 bis 4 Zoll diagonal). Aber jetzt gibt es viele Handys mit großem Bildschirm wie Galaxy S4, HTC One, Xperia Z
• Ein kleines Tablet wie das Samsung Galaxy Tab wird als groß (größer als 4 Zoll) eingestuft.
• Extragroß gilt für große Geräte, zum Beispiel große Tablets

Android definiert vier verallgemeinerte Bildschirmdichten:

 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

Typischerweise:

• Die Bildschirmgröße hat den größten Einfluss auf Ihre App-Layouts
• Die Bildschirmdichte hat den größten Einfluss auf Ihre Bild- und Grafikressourcen

Es ist aufgeführt Hier der prozentuale Unterschied des Gerätebildschirms

• Ldpi- 75 %
• Mdpi- 100 % (Basis laut Android-Entwicklerseite)
• HDPI- 150 %
• XHDPI- 200 %

Aber wie wir jetzt wissen, kommen die meisten Geräte mit 480X800 Ich betrachte dies also als basierendes Gerät, also wird unsere neue Berechnung so aussehen

• Ldpi- 50 %
• Mdpi- 66,67 %
• HDPI- 100 %
• XHDPI- 133,33 %

was bedeutet, dass das erste Symbol und Design für erstellt werden 480X800 erst und dann für restliche (dh Ldpi, Mdpi, Xhdpi).

Es gibt Bilder, die für alle Layouts gleich sind und in Farbe und Form einheitlich sein müssen (keine komplexe Form, keine Kurve), also erstellen wir für diese Art von Bild 9patch die in den Ordner „drawable(no-suffix)“ gelegt werden. Um ein 9Patch-Image zu erstellen, können Sie entweder verwenden DrawNinePatch oder BetterNinePatch

Benennen Sie jetzt einfach Ihre Bilder basierend auf den Standards von Android um und vervollständigen Sie Ihre Anwendung mit hdpi und dann einfach nehmen drawable-hdpi Ordner und Öffnen Adobe Photoshop(empfohlen) erstellen Aktion von mehreren Größen (ändern Sie einfach die Größe entsprechend dem prozentualen Verhältnis), sobald die Aktion für alle Größen erstellt wurde, dann tun Sie es einfach Stapelautomatisierung und gib source(drawable-hdpi) und destination(drawable-ldpi, drawable-mdpi, drawable-xdpi) an.

Der Grund, warum ich darauf bestehe, dass Sie Photoshop verwenden, weil es die Größe Ihres Bildes automatisch mit Aktionen ändert, und ein weiterer Pluspunkt ist, dass Sie die Datei nicht umbenennen müssen (es wird denselben Namen wie das Original zuweisen).

Wenn Sie mit der Erstellung aller Bilder fertig sind, aktualisieren Sie Ihr Projekt und testen Sie es.

Manchmal besteht die Möglichkeit, dass das Layout, das Bildschirme (xhdpi, hdpi, mdpi) unterstützt, in einen kleinen Bildschirm (ldpi) geschnitten wird. Erstellen Sie zur Handhabung einfach einen separaten Layoutordner (layout-small) dafür und fügen Sie ihn hinzu ScrollView(meistens). Das ist es.

Tablette
Tabletten werden in zwei Größen eingeteilt.

1. 7″(1024X(600-48(Navigationsleiste)))) = 1024X552 (darstellbar-groß)
2. 10″(1280X(800-48(Navigationsleiste)))) = 1280X752 (darstellbar-xlarge)

In diesem Fall müssen wir ein Bild für beide Bildschirme erstellen und sie einfach entsprechend platzieren

Alles in allem werden wir diesen Ordner in unserer Anwendung haben, um mehrere Bildschirme zu unterstützen.

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

wird mehr Qualifikationskombination mit sein Screen size and Screen density

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

mehr Qualifizierer mit Screen density and Version

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

und mehr Qualifizierer mit Screen size and Version

drawable-large-v11
drawable-xlarge-v11

und mehr Qualifizierer mit Smallest width concept(SW)

 drawable-sw???dp

Darüber hinaus haben sie in Android V3.0 Honeycomb ein neues Konzept eingeführt SW(smallest width) in welchem ​​​​Gerät werden in Bildschirmbreite kategorisiert, also wenn wir einen Ordner mit dem Namen erstellen drawable-sw360dp dann verwendet das Gerät mit 720 dp (entweder Breite oder Höhe) Ressourcen aus diesem Ordner.

zum Beispiel um die zu finden Samsung Galaxy S3 dp anhängen Drawable-sw?dp

Unter Bezugnahme auf DP-BerechnungWenn Sie Ihr Layout oder drawable zu S3 unterstützen möchten, dann sagt die Berechnung

px= Gerätebreite = 720
dpi= Gerätedichte= 320

Formel gegeben

    px = dp * (dpi / 160)

Formel austauschen, weil wir den Wert von px haben

    dp = px / (dpi / 160)

Jetzt Wert legen,

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

damit drawable-sw360dp wird die Arbeit erledigen

Holen Sie sich Ihre Gerätekonfiguration ab GSMArena
Genauso können Sie auch einen Ordner gemäß der Android-API-Version des Geräts erstellen, dh drawable-hdpi-v11`, sodass das Gerät mit API11 und Hdpi diese Ressourcen verwendet.

Zusätzliche Tipps:

• Verwenden Sie relative Layouts, dp, sp und mm

  dp-Einheiten – Geräteunabhängige Pixel normalisiert auf 1 physisches Pixel auf einem 160 ppi Bildschirm, dh mittlerer Dichte. Zur Laufzeit skaliert. Für Bildschirmelementabmessungen verwenden

  sp-Einheiten – skalierte Pixel, angegeben als Fließkommawerte, basierend auf dp-Einheiten, aber zusätzlich skaliert für die Einstellung der Schriftgröße des Benutzers. Zur Laufzeit skaliert. Verwenden Sie für Schriftgrößen

  Sie sollten immer RelativeLayout für Layouts verwenden; AbsoluteLayout ist veraltet und sollte nicht verwendet werden.

• Verwenden Sie geeignete Bildformate – PNG oder JPEG

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

  PNG und JPEG sind jedoch keine Äquivalente. Sie haben unterschiedliche Qualitätskompromisse und PNG ist nicht immer am besten:

  JPEG kann gegenüber PNG eine Reduzierung der Dateigröße um bis zu 50 % bieten, was erheblich ist, wenn Ihre App bildintensiv ist

  Ein „verlustbehaftetes“ JPEG höherer Qualität kann bei gleicher Dateigröße besser aussehen als ein stark komprimiertes „verlustfreies“ PNG

• Fügen Sie Ihren Bildern und Grafiken Labels zum Debuggen hinzu

• Verwenden Sie das Supports-Screens-Element

• Konfigurieren Sie Ihre Emulatoren mit echten Gerätewerten

  Herkömmlicherweise werden Desktop-Systeme mit 72 ppi (Mac) oder 96 ppi (Windows, Linux) angezeigt. Im Vergleich zu Mobilgeräten weisen Desktop-Displays immer eine geringe Dichte auf.

  Konfigurieren Sie Ihre Android-Emulatoren immer so, dass sie echte Gerätewerte nachahmen, und stellen Sie sie immer so ein, dass sie die Gerätedichte emulieren.

  In Eclipse ist es einfach, mehrere Emulatoren zu erstellen (wählen Sie in der Eclipse-Menüleiste Fenster > AVD-Manager > Neu) konfiguriert mit Werten für reale Geräte:

  Benennen Sie den Emulator für das reale Gerät, das es emuliert. Geben Sie die Auflösung an, verwenden Sie keine integrierten generischen Größen.

  Wählen Sie beim Starten des Geräts immer Anzeige auf Originalgröße skalieren und geben Sie die tatsächliche Bildschirmgröße in Zoll ein.

  Wenn Sie die Gerätedichte nicht festlegen, verwendet der Emulator standardmäßig eine niedrige Dichte und lädt immer ldpi-spezifische Ressourcen. Die Auflösung (Pixelabmessungen) ist korrekt, aber Ihre dichteabhängigen Bildressourcen werden nicht wie beabsichtigt angezeigt.

  Natürlich wird nichts, was Sie tun, eine Bildqualität mit höherer Dichte auf einem Desktop-Display mit geringerer Dichte reproduzieren.

Hier sind die Daten, die während eines Zeitraums von 7 Tagen bis zum 1. Oktober 2012 gesammelt wurden. Um die neueste Statistik über die Version der Android-Plattform anzuzeigen, gehe hierher

Basierend auf der Bildschirmgröße

Basierend auf der Bildschirmdichte

Designer sollten Basisdesigns von erstellen

base size of mdpi devices * density conversion factor of highest supported density bucket

size.Base Bildschirmgröße ist 320 x 480 px und Dichte-Buckets sind wie folgt:

• lpi: 0,75
• mdpi: 1,0 (Basisdichte)
• hdpi: 1,5
• xhdpi: 2.0
• xxhdpi: 3.0
• xxxhdpi: 4.0

Und um zusätzlichen verfügbaren Speicherplatz auf Android-Geräten zu bewältigen, sollten dehnbare Komponenten in beide Richtungen (horizontal und vertikal) verwendet werden. Detaillierte Informationen finden Sie hier:

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