Android Splash Bildschirmgrößen für ldpi, mdpi, hdpi, xhdpi Displays? - zB: 1024 x 768 Pixel für ldpi

102

Ich muss Begrüßungsbildschirme (Bilder, die beim Laden auf den Bildschirm passen) für Android-Anwendungen mit Phonegap entwerfen. Ich muss Bilder in 4 Größen entwerfen, die für 4 Bildschirmtypen wie ldpi, mdpi, hdpi, xhdpi passen. Kann mir jemand genaue Größen in Pixel für diese Bildschirme mitteilen, damit ich in dieser Größe entwerfen kann?

Beispielantwort: 

ldpi - 1024X768 px
mdpi  - 111 X 156 px  

 We support ldpi, mdpi, hdpi and xhdpi displays; the following will define splash screens for each specific screen type.

<gap:splash src="splash/android/ldpi.png" gap:platform="android" gap:density="ldpi" />
<gap:splash src="splash/android/mdpi.png" gap:platform="android" gap:density="mdpi" />
<gap:splash src="splash/android/hdpi.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="splash/android/xhdpi.png" gap:platform="android" gap:density="xhdpi" />
android splash-screen pixel-density user1767962
quelle
3
Dies wird Ihnen helfen
Mohammed Azharuddin Shaikh

Antworten:

98

Da Android keine festgelegte Standardgröße hat, kann es eine beliebige Anzahl unterschiedlicher Bildschirmgrößen geben. Als Richtlinie können Sie daher die von Google bereitgestellten Mindestbildschirmgrößen verwenden.

Laut Google-Statistiken sind die meisten ldpi-Displays kleine Bildschirme und die meisten mdpi-, hdpi-, xhdpi- und xxhdpi-Displays normal große Bildschirme.

  • xgroße Bildschirme haben mindestens 960 dp x 720 dp
  • Große Bildschirme haben eine Größe von mindestens 640 dp x 480 dp
  • Normale Bildschirme sind mindestens 470 dp x 320 dp
  • kleine Bildschirme sind mindestens 426dp x 320dp

Sie können die Statistiken zu den relativen Größen von Geräten im Dashboard von Google anzeigen, das hier verfügbar ist .

Weitere Informationen zu mehreren Bildschirmen finden Sie hier .

9 Patch-Image

Die beste Lösung besteht darin, ein Bild mit neun Patches zu erstellen, damit sich der Bildrand an die Größe des Bildschirms anpassen kann, ohne den statischen Bereich des Bildes zu beeinträchtigen.

http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch

Alex Wiese
quelle
Könnten Sie auch xxhdpi einschließen? (falls vorhanden)
Adonis K. Kakoulidis
Google definiert xxhdpi als ~ 480 DPI. Sie bieten keine Mindestbildschirmgröße dafür, soweit ich sehen kann.
Alex Wiese
8
Warum hat das so viele positive Stimmen? xlarge != xhdpiSie messen zwei völlig verschiedene Dinge. Diese dp-Größen sind für die Größenbereiche aufgeführt, nicht für die Dichte.
Geobits
@geobits schau dir die Frage an. Er fragt, welche Größe seine Begrüßungsbildschirme für jede von ihm unterstützte Dichte haben sollen. Da es eine beliebige Anzahl unterschiedlicher Größen geben kann, da Android keine festgelegte Standardgröße hat, können wir die von Google bereitgestellten Mindestbildschirmgrößen am besten beantworten. Sie können mehr darüber lesen, wenn Sie dem Link in der Antwort folgen.
Alex Wiese
2
Ich verstehe, was Sie sagen, aber das sagt Ihre Antwort nicht. Wenn es so wäre, hätte ich nicht einmal einen Kommentar abgegeben. Er bat um eine Größenliste, und Sie geben einfach eine Liste, die auf etwas anderem basiert, ohne Erklärung. Sie sollten es bearbeiten, unabhängig davon, ob Sie einen Link zu den Dokumenten erstellen oder nicht.
Geobits
134

Begrüßungsbildschirmgrößen für Android

und gleichzeitig für Cordova (auch bekannt als Phonegap), React-Native und alle anderen Entwicklungsplattformen 

Format : 9-Patch PNG (recommended)

Dimensions

 - LDPI:
    - Portrait: 200x320px
    - Landscape: 320x200px
 - MDPI:
    - Portrait: 320x480px
    - Landscape: 480x320px
 - HDPI:
    - Portrait: 480x800px
    - Landscape: 800x480px
 - XHDPI:
    - Portrait: 720px1280px
    - Landscape: 1280x720px
 - XXHDPI
    - Portrait: 960x1600px
    - Landscape: 1600x960px
 - XXXHDPI 
    - Portrait: 1280x1920px
    - Landscape: 1920x1280px

Hinweis: Das Vorbereiten von XXXHDPI ist nicht erforderlich und möglicherweise auch die XXHDPI-Größe, da sich die Bereiche von 9-Patch-Bildern wiederholen. Wenn jedoch nur Porträtgrößen verwendet werden, kann die App-Größe geringer sein. Mehr Bilder bedeuten mehr Platzbedarf.

Passt auf

Ich denke, es gibt keine genaue Größe für alle Geräte. Ich benutze Xperia Z 5" . Wenn Sie eine plattformübergreif-webview App entwickeln , sollten Sie eine Menge Dinge berücksichtigen (ob Bildschirm Softkey Navigationstasten oder nicht, usw. hat). Deshalb Ich denke , es ist nur eine passende Lösung. Die Lösung ist zu Bereiten Sie einen 9-Patch-Begrüßungsbildschirm vor (siehe How to design a new splash screenÜberschrift unten).

  1. Erstellen Sie Begrüßungsbildschirme für die oben genannten Bildschirmgrößen als 9-Patch . Geben Sie Ihren Dateien Namen mit den Suffixen .9.png
  2. Fügen Sie die folgenden Zeilen in Ihre Datei config.xml ein
  3. Fügen Sie bei Bedarf das Begrüßungsbildschirm-Plugin hinzu.
  4. Führen Sie Ihr Projekt aus.

Das ist es!

Cordova-spezifischer Code
Zum Hinzufügen von Zeilen in die config.xml für 9-Patch-Begrüßungsbildschirme

<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="6000" />
<platform name="android">
    <splash src="res/screen/android/ldpi.9.png" density="ldpi"/>
    <splash src="res/screen/android/mdpi.9.png" density="mdpi"/>
    <splash src="res/screen/android/hdpi.9.png" density="hdpi"/>
    <splash src="res/screen/android/xhdpi.9.png" density="xhdpi"/> 
</platform>

Hinzufügen von Zeilen in die Datei config.xml bei Verwendung von Begrüßungsbildschirmen ohne Patch-9

<platform name="android">
    <splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi"/>
    <splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi"/>
    <splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi"/>
    <splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi"/>

    <splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
    <splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
    <splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
    <splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
</platform>

So entwerfen Sie einen neuen Begrüßungsbildschirm

Ich würde einen einfachen Weg beschreiben, um auf diese Weise einen richtigen Begrüßungsbildschirm zu erstellen. Angenommen, wir entwerfen einen Bildschirm mit 1280 dp x 720 dp - xhdpi (x-groß). Ich habe zum Beispiel das Folgende geschrieben;

  • In Photoshop: Datei -> Neu in neuem Dialogfenster legen Sie Ihre Bildschirme fest

    Breite: 720 Pixel Höhe: 1280 Pixel

    Ich denke, die oben genannten Größen bedeuten eine Auflösung von 320 Pixel / Zoll. Um sicherzustellen, dass Sie den Auflösungswert in Ihrem Dialogfenster auf 320 ändern können. In diesem Fall Pixel / Zoll = DPI

    Herzlichen Glückwunsch ... Sie haben eine Begrüßungsbildschirmvorlage mit 720 dp x 1280 dp.

So generieren Sie einen 9-Patch-Begrüßungsbildschirm

Wenn Sie nach dem Entwerfen Ihres Begrüßungsbildschirms einen 9-Patch-Begrüßungsbildschirm entwerfen möchten, sollten Sie für jede Seite eine Pixellücke einfügen. Aus diesem Grund sollten Sie die Breite und Höhe Ihrer Leinwandgröße um +2 Pixel erhöhen (jetzt sind Ihre Bildgrößen 722 x 1282).

Ich habe die leere 1-Pixel-Lücke an jeder Seite wie unten angegeben belassen.
Ändern der Leinwandgröße mithilfe von Photoshop:
- Öffnen Sie eine Begrüßungsbildschirm-PNG-Datei in Photoshop.
- Klicken Sie auf das Schlosssymbol neben dem Namen 'Hintergrund' im Feld Ebenen (um anstelle einer anderen Farbe wie Weiß leer zu lassen), wenn dies der Fall ist unten: - Ändern Sie die Leinwandgröße im Menü Bild (Breite: 720 Pixel auf 722 Pixel und Höhe: 1280 Pixel auf 1282 Pixel). Jetzt sollte auf jeder Seite des Begrüßungsbildschirms eine Pixellücke angezeigt werden.
Geben Sie hier die Bildbeschreibung ein


Anschließend können Sie mit C: \ Programme (x86) \ Android \ android-studio \ sdk \ tools \ draw9patch.bat eine 9-Patch-Datei konvertieren. Öffnen Sie dazu Ihren Begrüßungsbildschirm in der draw9patch-App. Sie sollten Ihr Logo und erweiterbare Bereiche definieren. Beachten Sie die schwarze Linie im folgenden Beispiel-Begrüßungsbildschirm. Die Dicke der schwarzen Linie beträgt nur 1 Pixel;) Linke und obere Seite Schwarze Linien definieren den Anzeigebereich Ihres Begrüßungsbildschirms. Genau so, wie Sie es entworfen haben. Die rechten und unteren Zeilen definieren den hinzufügenden und entfernbaren Bereich (sich automatisch wiederholende Bereiche).

Tun Sie das einfach: Zoomen Sie die obere Kante Ihres Bildes in der draw9patch-Anwendung. Klicken und ziehen Sie die Maus, um eine Linie zu zeichnen. Drücken Sie Umschalt + Klicken und ziehen Sie die Maus, um die Linie zu löschen.

Beispiel 9-Patch-Design

Wenn Sie eine plattformübergreifende App (wie Cordova / PhoneGap) entwickeln, finden Sie die folgende Adresse für fast alle mabile OS-Begrüßungsbildschirmgrößen. Klicken Sie hier für Windows Phone- , WebOS- , BlackBerry- , Bada-WAC- und Bada- Begrüßungsbildschirmgrößen.

https://github.com/phonegap/phonegap/wiki/App-Splash-Screen-Sizes

Und wenn Sie IOS-, Android- usw. App-Symbolgrößen benötigen, können Sie diese hier besuchen .

IOS

Format : PNG (recommended)

Dimensions

 - Tablet (iPad)
   - Non-Retina (1x)
     - Portrait: 768x1024px
     - Landscape: 1024x768px
   - Retina (2x)
     - Portrait: 1536x2048px
     - Landscape: 2048x1536px
 - Handheld (iPhone, iPod)
   - Non-Retina (1x)
     - Portrait: 320x480px
     - Landscape: 480x320px
   - Retina (2x)
     - Portrait: 640x960px
     - Landscape: 960x640px
 - iPhone 5 Retina (2x)
   - Portrait: 640x1136px
   - Landscape: 1136x640px
 - iPhone 6 (2x)
   - Portrait: 750x1334px
   - Landscape: 1334x750px
 - iPhone 6 Plus (3x)
   - Portrait: 1242x2208px
   - Landscape: 2208x1242px
efkan
quelle
105

Für Android-Mobilgeräte

LDPI-Symbol-36x36, Splash-426x320 (jetzt mit korrekten Werten)

MDPI-Symbol-48x48, Splash-470x320

HDPI-Symbol 72x72, Splash-640x480

XHDPI-Symbol-96x96, Splash-960x720

XXHDPI- Symbol- 144x144

Alles in Pixel.

Für Android Tablet Geräte

LDPI:
    Portrait: 200x320px
    Landscape: 320x200px
MDPI:
    Portrait: 320x480px
    Landscape: 480x320px
HDPI:
    Portrait: 480x800px
    Landscape: 800x480px
XHDPI:
    Portrait: 720px1280px
    Landscape: 1280x720px
Nijil Nair
quelle
@ Geobits: Beide sind in Pixel. Das ist für verschiedene Auflösungen. Ich sehe dort keine Verwirrung. seltsam!!
Nijil Nair
1
Die Größen , die Sie geben für ldpi/mdpi/hdpi/xhdpientsprechen small/normal/large/xlargein dp nach dieser . Wenn es sich um Pixelgrößen handelt, sollten sie auch maßstabsgetreu sein 0.75/1/1.5/2. Haben Sie eine Quelle für diese Größen, die ich nicht sehe?
Geobits
@NijilNair: Wie kommt es, dass die Auflösung von Bildern auf Tablets geringer ist als auf Mobiltelefonen?! Sollte es nicht umgekehrt sein? Zum Beispiel bin ich überrascht mit dem "Handy ldpi: 426x320" und dann "Tablet ldpi: 320 x 200" ... scheint überhaupt nicht logisch. Danke für die Antwort!
Phalanx
@ Phalanx: Überprüfen Sie diesen Link. developer.android.com/guide/practices/… .
Nijil Nair
1
Sind Sie sicher, dass das LDPI-Symbol nicht 36x36 ist?
Vladius
32
  • LDPI: Porträt: 200 x 320 Pixel. Landschaft: 320 x 200 Pixel.
  • MDPI: Porträt: 320 x 480 Pixel. Querformat: 480 x 320 Pixel.
  • HDPI: Porträt: 480 x 800 Pixel. Landschaft: 800 x 480 Pixel.
  • XHDPI: Porträt: 720 x 1280 Pixel. Querformat: 1280 x 720 Pixel.
  • XXHDPI: Porträt: 960 x 1600 Pixel. Querformat: 1600 x 960 Pixel.
  • XXXHDPI: Porträt: 1280 x 1920 Pixel. Querformat: 1920 x 1280 Pixel.
Manavendher
quelle
2
Überall, wo ich lese, ist xhdpi nur doppelt so groß wie mdpi, also sollte xhdpi 640 x 960 sein, aber Sie haben es 720x1280 geschrieben. Können Sie bitte erklären, wie es 720x1280 ist? Welche Formel hast du verwendet?
Rahul Sharma
10
  • Große Bildschirme haben eine Größe von mindestens 960 dp x 720 dp
  • Große Bildschirme mit Listenelementen haben eine Größe von mindestens 640 dp x 480 dp
  • Normale Bildschirme für Listenelemente sind mindestens 470 dp x 320 dp groß
  • Kleine Bildschirme für Listenelemente sind mindestens 426 dp x 320 dp groß

Verwenden Sie diese Option, um Ihre Bilder zu erstellen und in einem bestimmten Ressourcenordner abzulegen.

Puneet
quelle
5

Verwenden Sie einfach diese Website: http://ticons.fokkezb.nl :)

Es macht es Ihnen leichter und generiert direkt die richtigen Größen

Oussama L.
quelle
Diese Website scheint für iOS-Bilder zu sein, nicht für Android.
Ryan Williams
2
Ich habe es für Android verwendet und war sehr zufrieden mit den Ergebnissen; à
Oussama L.
2

xlarge-Bildschirme sind mindestens 960 dp x 720 dp layout-xlarge 10 "-Tablets (720 x 1280 mdpi, 800 x 1280 mdpi usw.)

Bei großen Bildschirmen handelt es sich um Tweener-Tablets mit mindestens 640 dp x 480 dp wie das Streak-Tablet (480 x 800 mdpi) und ein 7-Zoll-Tablet (600 x 1024 mdpi).

Normale Bildschirme sind mindestens 470dp x 320dp Layout typische Telefonbildschirm (480x800 hdpi)

kleine Bildschirme sind mindestens 426 dp x 320 dp typische Telefonbildschirme (240 x 320 ldpi, 320 x 480 mdpi usw.)

Amila
quelle