Ein adaptives Symbol oder AdaptiveIconDrawable
kann je nach Gerätefunktionen und Nutzerdesign unterschiedlich dargestellt werden. Adaptive Symbole werden hauptsächlich vom Launcher auf dem Startbildschirm verwendet, können aber auch in Verknüpfungen, in der App „Einstellungen“, in Dialogfeldern zum Teilen und auf dem Übersichtsbildschirm verwendet werden. Adaptive Symbole werden für alle Android-Formfaktoren verwendet.
Im Gegensatz zu Bitmapbildern können sich adaptive Symbole an verschiedene Anwendungsfälle anpassen:
Verschiedene Formen:Für ein adaptives Symbol können verschiedene Formen auf verschiedenen Gerätemodellen angezeigt werden. Beispielsweise kann auf einem OEM-Gerät eine kreisförmige Form und auf einem anderen Gerät ein Squircle (eine Form zwischen einem Quadrat und einem Kreis) angezeigt werden. Jeder Geräte-OEM muss eine Maske zur Verfügung stellen, die das System verwendet, um alle adaptiven Symbole mit derselben Form zu rendern.
Visuelle Effekte:Ein adaptives Symbol unterstützt eine Vielzahl ansprechender visueller Effekte, die eingeblendet werden, wenn Nutzer das Symbol auf dem Startbildschirm platzieren oder verschieben.
Nutzerthemen:Ab Android 13 (API-Level 33) können Nutzer ihre adaptiven Symbole designen. Wenn ein Nutzer in den Systemeinstellungen die Ein/Aus-Schaltfläche Symboldesigns aktiviert hat und der Launcher diese Funktion unterstützt, verwendet das System die Einfärbung des vom Nutzer ausgewählten Hintergrunds und Designs, um die Färbung zu bestimmen.
In den folgenden Szenarien wird auf dem Startbildschirm nicht das App-Symbol mit dem Design angezeigt, sondern das adaptive oder standardmäßige App-Symbol:
- Der Nutzer aktiviert die App-Symboldesigns nicht.
- Wenn Ihre App kein einfarbiges App-Symbol zur Verfügung stellt.
- Der Launcher unterstützt keine App-Symboldesigns.
Adaptive Symbole entwerfen
Damit Ihr adaptives Symbol verschiedene Formen, visuelle Effekte und Nutzerdesigns unterstützt, muss das Design die folgenden Anforderungen erfüllen:
Für die Farbversion des Symbols müssen zwei Ebenen angegeben werden: eine für den Vordergrund und eine für den Hintergrund. Die Ebenen können entweder Vektoren oder Bitmaps sein, wobei Vektoren bevorzugt werden.
Wenn Sie Nutzermotivationen für App-Symbole unterstützen möchten, stellen Sie eine einzelne Ebene für die monochrome Version des Symbols bereit.
Größe aller Ebenen muss auf 108 x 108 dp festgelegt werden.
Verwenden Sie Symbole mit klaren Rändern. Die Ebenen dürfen keine Masken oder Hintergrundschatten um den Umriss des Symbols haben.
Verwenden Sie ein Logo mit mindestens 48 x 48 dp. Sie darf 66 × 66 dp nicht überschreiten, da die innere 66 × 66 dp des Symbols im maskierten Darstellungsbereich erscheint.
Die äußeren 18 dp auf jeder der vier Seiten der Ebenen dienen zum Maskieren und für visuelle Effekte wie Parallaxe oder Pulsieren.
Informationen zum Erstellen adaptiver Symbole mit Android Studio finden Sie in unserer Figma-Vorlage für Android-App-Symbole oder in der Android Studio-Dokumentation zum Erstellen von Launcher-Symbolen. Außerdem sollten Sie sich den Blogpost Adaptive Symbole entwerfen ansehen.
Adaptives Symbol zur App hinzufügen
Adaptive Symbole werden genau wie nicht adaptive Symbole im App-Manifest über das Attribut android:icon
angegeben.
Das optionale Attribut android:roundIcon
wird von Launchern verwendet, die Apps mit kreisförmigen Symbolen darstellen. Es kann nützlich sein, wenn das App-Symbol einen kreisförmigen Hintergrund als Hauptbestandteil hat. Solche Launcher müssen App-Symbole generieren, indem sie eine kreisförmige Maske auf android:roundIcon
anwenden. Mit dieser Garantie können Sie die Darstellung Ihres App-Symbols optimieren, indem Sie beispielsweise das Logo leicht vergrößern und dafür sorgen, dass der kreisförmige Hintergrund beim Zuschneiden randvoll ist.
Das folgende Code-Snippet zeigt beide dieser Attribute, aber die meisten Apps geben nur android:icon
an:
<application ... android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" ...> </application>
Als Nächstes speichern Sie das adaptive Symbol in res/mipmap-anydpi-v26/ic_launcher.xml
. Verwenden Sie das Element <adaptive-icon>
, um die Ressourcen für den Vorder- und Hintergrund und die monochromatischen Ebenen für Ihre Symbole zu definieren. Die inneren Elemente <foreground>
, <background>
und <monochrome>
unterstützen sowohl Vektor- als auch Bitmapbilder.
Das folgende Beispiel zeigt, wie die Elemente <foreground>
, <background>
und <monochrome>
in <adaptive-icon>
definiert werden:
<?xml version="1.0" encoding="utf-8"?> ... <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android"> <background android:drawable="@drawable/ic_launcher_background" /> <foreground android:drawable="@drawable/ic_launcher_foreground" /> // Starting with Android 13 (API level 33), you can opt-in to providing a // <monochrome> drawable. <monochrome android:drawable="@drawable/ic_launcher_monochrome" /> </adaptive-icon> ...
Du kannst Drawables auch als Elemente definieren, indem du sie in die Elemente <foreground>
, <background>
und <monochrome>
einfügst. Das folgende Snippet zeigt ein Beispiel dafür, wie das mit einem Drawable im Vordergrund zu tun ist.
<?xml version="1.0" encoding="utf-8"?> ... <foreground> <inset android:insetBottom="18dp" android:insetLeft="18dp" android:insetRight="18dp" android:insetTop="18dp"> <shape android:shape="oval"> <solid android:color="#0000FF" /> </shape> </inset> </foreground> ...
Wenn Sie auf Ihre Verknüpfungen dieselbe Maske und denselben visuellen Effekt wie auf reguläre adaptive Symbole anwenden möchten, verwenden Sie eine der folgenden Methoden:
- Verwenden Sie für statische Verknüpfungen das Element
<adaptive-icon>
. - Rufen Sie für dynamische Tastenkombinationen die Methode
createWithAdaptiveBitmap()
auf, wenn Sie sie erstellen.
Weitere Informationen zum Implementieren adaptiver Symbole finden Sie unter Adaptive Symbole implementieren. Weitere Informationen zu Tastenkombinationen findest du unter App-Tastenkombinationen.
Weitere Informationen
Weitere Informationen zum Entwerfen und Implementieren adaptiver Symbole finden Sie in den folgenden Ressourcen.
- Vorlage für die Figma-Community
- Adaptive Android-Symbole
- Adaptive Symbole entwerfen
- Adaptive Symbole implementieren
- App-Symbole in Android Studio erstellen
- Spezifikationen zur Symbolgestaltung für Google Play