Android Training/Supporting Different Screens/de: Unterschied zwischen den Versionen

Aktuelle Version vom 10. Januar 2016, 03:58 Uhr

Sprachen:

Deutsch
English

Android kategorisiert Geräte-Bildschirme anhand zwei allgemeiner Eigenschaften: Größe und Pixeldichte. Du solltest erwarten, dass deine App auf Geräte mit unterschiedlichen Größen und Pixeldichten installiert wird. Daher solltest du Ressourcen in deine App einfügen, die deine App-Anzeige auf verschiedenen Bildschirmgrößen und Pixeldichten optimiert.

Es gibt vier verallgemeinerte Größen: small, normal, large, xlarge
Und vier allgemeine Pixelcihten: low (ldpi), medium (mdpi), high (hdpi), extra high (xhdpi)

Um verschiedene Layouts und Bitmaps zu deklarieren, welche du für verschiedene Bildschirme verwenden möchtest, musst du diese alternativen Ressourcen in separate Ordner organisieren, ähnlich wie du es für verschiedene Sprach-Zeichenketten machst.

Beachte außerdem, dass die Bildschirmausrichtung (Quer oder Porträt) eine Variation der Bildschirmgröße ist, daher sollten viele Apps ihr Layout überarbeiten, um die Nutzererfahrung in jeder Ausrichtung zu verbessern.

Verschiedene Layouts erstellen

Um die Nutzererfahrung auf verschiedenen Bildschirmgrößen zu verbessern, solltest du eine eigene Layout XML-Datei für jede Bildschirmgröße erstellen, die du unterstützen möchtest. Jedes layout sollte in dem dafür passenden Ressourcen-Ordner gespeichert werden, mit einem Suffix -<screen_size> benannt. Als Beispiel sollte ein eigenes Layout für große Bildschirme unter res/layout-large/ gespeichert werden.

Hinweis: Android skaliert dein Layout automatisch, damit es optimal an die Bildschirmgröße angepasst ist. Daher müssen sich deine Layouts für verschiedene Bildschirmgrößen keine Sorgen um die absoluten Größen von UI Elementen machen, sondern sich auf die Layout-Struktur konzentrieren, welche die Nutzererfahrung beeinflussen (wie bspw. die Größe oder Position von wichtigen Ansichten, relativ zu benachbarten Ansichten).

Beispielsweise beinhaltet dieses Projekt ein Standardlayout und ein alternatives Layout für "große" Bildschirme:

MyProject/
    res/
        layout/
            main.xml
        layout-large/
            main.xml

Die Dateinamen müssen exakt gleich sein, die Inhalte allerdings verschieden, um eine optimierte Oberfläche für die entsprechenden Bildschirmgrößen zur Verfügung zu stellen.

Verweise in deiner App einfach wie üblich auf die Layout-Datei:

@Override
 protected void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);
     setContentView(R.layout.main);
}

Das System lädt die passende Layout-Datei aus dem entsprechenden Layout-Ordner, basierend auf der Bildschirmgröße des Gerätes, auf welchem die App ausgeführt wird. Mehr Informationen darüber, wie Android die passende Ressource auswählt, ist im Providing Resources Guide verfügbar.

Als ein weiteres Beispiel ist hier ein Projekt mit einem alternativen Layout für das Querformat:

MyProject/
    res/
        layout/
            main.xml
        layout-land/
            main.xml

Standardmäßig wird die layout/main.xml Datei für das Hochformat verwendet.

Wenn du ein spezielles Layout für das Querformat bereitstellen möchtest, einschließlich für große Bildschirme, dann musst du beide Kennzeichner, large und land, verwenden:

MyProject/
    res/
        layout/              # default (portrait)
            main.xml
        layout-land/         # landscape
            main.xml
        layout-large/        # large (portrait)
            main.xml
        layout-large-land/   # large landscape
            main.xml

Hinweis: Android 3.2 und neuer unterstützen eine erweiterte Methode um Bildschirmgrößen zu definieren, welche es dir erlaubt, verschiedene Ressourcen für Bildschirmgrößen festzulegen, basierend auf der minimalen Breite und Höhe an dichteunabhängigen Pixel. Diese Lektion deckt diese neue Technik nicht ab. Für mehr Informationen, lese Designing für mehrere Bildschirme.

Verschiedene Bitmaps erstellen

Du solltest immer bitmap-Ressourcen zur Verfügung stellen, die ordnungsgemäß auf die standardisierten Dichte-Gruppen skalieren: low, medium, high und extra-high. Das hilft dir, eine gute grafische Qualität und Performance auf allen Bildschirm-Dichten zu erreichen.

Um diese Bilder zu erstellen, solltest du mit deiner Ursprungs-Ressource im Vector Format starten und die Bilder für jede Dichte mit folgenden Skalierungen erstellen:

xhdpi: 2.0
hdpi: 1.5
mdpi: 1.0 (baseline)
ldpi: 0.75

Das bedeutet, wenn du ein 200x200 Bild für xhdpi Geräte erstellst, solltest du die gleiche Ressource in 150x150 für hdpi, 100x100 für mdpi und 75x75 für ldpi Geräte erstellen.

Speichere die Dateien anschließend in das dafür vorgesehene drawable-Ressourcen Verzeichnis:

MyProject/
    res/
        drawable-xhdpi/
            awesomeimage.png
        drawable-hdpi/
            awesomeimage.png
        drawable-mdpi/
            awesomeimage.png
        drawable-ldpi/
            awesomeimage.png

Jedes mal, wenn du @drawable/awesomeimage referenzierst wird das System das entsprechende Bitmap, basierend auf der Bildschirm-Dichte, auswählen.

Hinweis: Low-density (ldpi) Ressourcen sind nicht immer nötig. Wenn du hdpi Ressourcen bereitstellst, wird das System diese um die hälfte skalieren, um ideal auf ldpi Bildschirme zu passen.

Für mehr Tipps und Richtlinien über die Erstellung von Icon-Sets für deine App, siehe den Iconography design guide.

Teile dieser Seite sind Modifikationen basierend auf der Arbeit erstellt und freigegeben durch das Android Open Source Project und werden entsprechend den Lizenzbedingungen (beschrieben in der Creative Commons 2.5 Attribution License) verwendet.

@@ Zeile 12: / Zeile 12: @@
 '''Hinweis:''' Android skaliert dein Layout automatisch, damit es optimal an die Bildschirmgröße angepasst ist. Daher müssen sich deine Layouts für verschiedene Bildschirmgrößen keine Sorgen um die absoluten Größen von UI Elementen machen, sondern sich auf die Layout-Struktur konzentrieren, welche die Nutzererfahrung beeinflussen (wie bspw. die Größe oder Position von wichtigen Ansichten, relativ zu benachbarten Ansichten).
-For example, this project includes a default layout and an alternative layout for ''large'' screens:
+Beispielsweise beinhaltet dieses Projekt ein Standardlayout und ein alternatives Layout für "große" Bildschirme:
 <syntaxhighlight lang="text">
 MyProject/
@@ Zeile 22: / Zeile 22: @@
 </syntaxhighlight>
-The file names must be exactly the same, but their contents are different in order to provide an optimized UI for the corresponding screen size.
+Die Dateinamen müssen exakt gleich sein, die Inhalte allerdings verschieden, um eine optimierte Oberfläche für die entsprechenden Bildschirmgrößen zur Verfügung zu stellen.
-Simply reference the layout file in your app as usual:
+Verweise in deiner App einfach wie üblich auf die Layout-Datei:
 <syntaxhighlight lang="java">
 @Override
@@ Zeile 33: / Zeile 33: @@
 </syntaxhighlight>
-The system loads the layout file from the appropriate layout directory based on screen size of the device on which your app is running. More information about how Android selects the appropriate resource is available in the [http://developer.android.com/guide/topics/resources/providing-resources.html#BestMatch Providing Resources] guide.
+Das System lädt die passende Layout-Datei aus dem entsprechenden Layout-Ordner, basierend auf der Bildschirmgröße des Gerätes, auf welchem die App ausgeführt wird. Mehr Informationen darüber, wie Android die passende Ressource auswählt, ist im [http://developer.android.com/guide/topics/resources/providing-resources.html#BestMatch Providing Resources] Guide verfügbar.
-As another example, here's a project with an alternative layout for landscape orientation:
+Als ein weiteres Beispiel ist hier ein Projekt mit einem alternativen Layout für das Querformat:
 <syntaxhighlight lang="text">
 MyProject/
@@ Zeile 45: / Zeile 45: @@
 </syntaxhighlight>
-By default, the <code>layout/main.xml</code> file is used for portrait orientation.
+Standardmäßig wird die <code>layout/main.xml</code> Datei für das Hochformat verwendet.
-If you want to provide a special layout for landscape, including while on large screens, then you need to use both the <code>large</code> and <code>land</code> qualifier:
+Wenn du ein spezielles Layout für das Querformat bereitstellen möchtest, einschließlich für große Bildschirme, dann musst du beide Kennzeichner, <code>large</code> und <code>land</code>, verwenden:
 <syntaxhighlight lang="text">
 MyProject/
@@ Zeile 61: / Zeile 61: @@
 </syntaxhighlight>
-'''Note:''' Android 3.2 and above supports an advanced method of defining screen sizes that allows you to specify resources for screen sizes based on the minimum width and height in terms of density-independent pixels. This lesson does not cover this new technique. For more information, read [http://developer.android.com/training/multiscreen/index.html Designing for Multiple Screens].
+'''Hinweis:''' Android 3.2 und neuer unterstützen eine erweiterte Methode um Bildschirmgrößen zu definieren, welche es dir erlaubt, verschiedene Ressourcen für Bildschirmgrößen festzulegen, basierend auf der minimalen Breite und Höhe an dichteunabhängigen Pixel. Diese Lektion deckt diese neue Technik nicht ab. Für mehr Informationen, lese [http://developer.android.com/training/multiscreen/index.html Designing für mehrere Bildschirme].
-== Create Different Bitmaps ==
+== Verschiedene Bitmaps erstellen ==
-You should always provide bitmap resources that are properly scaled to each of the generalized density buckets: low, medium, high and extra-high density. This helps you achieve good graphical quality and performance on all screen densities.
+Du solltest immer bitmap-Ressourcen zur Verfügung stellen, die ordnungsgemäß auf die standardisierten Dichte-Gruppen skalieren: low, medium, high und extra-high. Das hilft dir, eine gute grafische Qualität und Performance auf allen Bildschirm-Dichten zu erreichen.
-To generate these images, you should start with your raw resource in vector format and generate the images for each density using the following size scale:
+Um diese Bilder zu erstellen, solltest du mit deiner Ursprungs-Ressource im Vector Format starten und die Bilder für jede Dichte mit folgenden Skalierungen erstellen:
 * xhdpi: 2.0
 * hdpi: 1.5
 * mdpi: 1.0 (baseline)
 * ldpi: 0.75
-This means that if you generate a 200x200 image for xhdpi devices, you should generate the same resource in 150x150 for hdpi, 100x100 for mdpi, and 75x75 for ldpi devices.
+Das bedeutet, wenn du ein 200x200 Bild für xhdpi Geräte erstellst, solltest du die gleiche Ressource in 150x150 für hdpi, 100x100 für mdpi und 75x75 für ldpi Geräte erstellen.
-Then, place the files in the appropriate drawable resource directory:
+Speichere die Dateien anschließend in das dafür vorgesehene drawable-Ressourcen Verzeichnis:
 <syntaxhighlight lang="text">
 MyProject/
@@ Zeile 87: / Zeile 87: @@
 </syntaxhighlight>
-Any time you reference <code>@drawable/awesomeimage</code>, the system selects the appropriate bitmap based on the screen's density.
+Jedes mal, wenn du <code>@drawable/awesomeimage</code> referenzierst wird das System das entsprechende Bitmap, basierend auf der Bildschirm-Dichte, auswählen.
-'''Note:''' Low-density (ldpi) resources aren’t always necessary. When you provide hdpi assets, the system scales them down by one half to properly fit ldpi screens.
+'''Hinweis:''' Low-density (ldpi) Ressourcen sind nicht immer nötig. Wenn du hdpi Ressourcen bereitstellst, wird das System diese um die hälfte skalieren, um ideal auf ldpi Bildschirme zu passen.
-For more tips and guidelines about creating icon assets for your app, see the [http://developer.android.com/design/style/iconography.html Iconography design guide].
+Für mehr Tipps und Richtlinien über die Erstellung von Icon-Sets für deine App, siehe den [http://developer.android.com/design/style/iconography.html Iconography design guide].
 {{TNT|Android Training/Attribution}}