Vektorgrafiken für verschiedene Bildschirmdichten hinzufügen

Android Studio enthält das Tool „Vector Asset Studio“, mit dem Sie Material-Symbole hinzufügen und SVG-Dateien (Scalable Vector Graphics) und PSD-Dateien (Adobe Photoshop Document) als Vektordrawable-Ressourcen in Ihr Projekt importieren können. Wenn Sie Vektordrawables anstelle von Bitmaps verwenden, wird die Größe Ihrer APK reduziert, da dieselbe Datei für verschiedene Bildschirmdichten skaliert werden kann, ohne dass die Bildqualität darunter leidet. Bei älteren Android-Versionen, die keine Vektordrawables unterstützen, kann Vector Asset Studio zur Build-Zeit Ihre Vektordrawables in verschiedene Bitmap-Größen für jede Bildschirmdichte umwandeln.

Vector Asset Studio

Vector Asset Studio fügt dem Projekt eine Vektorgrafik als XML-Datei hinzu, die das Bild beschreibt. Die Verwaltung einer XML-Datei kann einfacher sein als die Aktualisierung mehrerer Rastergrafiken in verschiedenen Auflösungen.

Wenn Sie Vektordrawables mit Jetpack Compose verwenden möchten, müssen Sie das minimale API-Level auf Android 5.0 (API-Level 21) und höher festlegen.

Android 4.4 (API-Level 20) und niedriger unterstützt keine Vektordrawables. Wenn Ihr Mindest-API-Level auf eines dieser API-Levels festgelegt ist, haben Sie zwei Möglichkeiten, wenn Sie Vector Asset Studio verwenden: PNG-Dateien (Portable Network Graphic) generieren (Standard) oder die Abwärtskompatibilitätstechnik in AndroidX verwenden.

Aus Gründen der Abwärtskompatibilität generiert Vector Asset Studio Rasterbilder des Vektordrawables. Die Vektor- und Raster-Drawables werden zusammen im APK verpackt. Sie können in Kotlin-Code auf Vektordrawables als Drawable oder in XML-Code als @drawable verweisen. Wenn Ihre App ausgeführt wird, wird je nach API-Level automatisch das entsprechende Vektor- oder Rasterbild angezeigt.

Wenn Sie nur Vektordrawables verwenden möchten, können Sie AndroidX 1.0.0 oder höher verwenden. Für diese Methode muss die Datei build.gradle geändert werden, bevor Sie Vector Asset Studio ausführen. Weitere Informationen finden Sie unter AndroidX. Mit der Klasse VectorDrawableCompat in AndroidX können Sie VectorDrawable in Android 2.1 (API-Level 7) und höher unterstützen.

Unterstützte Vektorgrafiktypen

Die Google Material Design-Spezifikation enthält Material-Symbole, die Sie in Ihren Android-Apps verwenden können. Mit Vector Asset Studio können Sie Material-Symbole auswählen, importieren und in der Größe anpassen sowie die Deckkraft und die RTL-Spiegelung (Right-to-Left, von rechts nach links) festlegen.

Mit Vector Asset Studio können Sie auch eigene SVG- und PSD-Dateien importieren. SVG ist ein XML-basierter offener Standard des World Wide Web Consortium (W3C). Das PSD-Dateiformat unterstützt Adobe Photoshop-Funktionen. Vector Asset Studio unterstützt die wichtigsten Standards, aber nicht alle SVG- und PSD-Funktionen. Wenn Sie eine SVG- oder PSD-Datei angeben, erhalten Sie in Vector Asset Studio sofort Feedback dazu, ob der Grafikcode unterstützt wird. Die Datei wird in eine XML-Datei mit VectorDrawable-Code konvertiert. Wenn Fehler auftreten, sollten Sie prüfen, ob Ihre Vektordrawable wie vorgesehen angezeigt wird. Weitere Informationen zu zulässigen PSD-Funktionen finden Sie unter Unterstützung und Einschränkungen für PSD-Dateien.

Für Android 5.0 (API-Level 21) und höher können Sie die Klasse AnimatedVectorDrawable verwenden, um die Attribute der Klasse VectorDrawable zu animieren. Mit AndroidX können Sie die Klasse AnimatedVectorDrawableCompat verwenden, um die Klasse VectorDrawable für Android 3.0 (API-Level 11) und höher zu animieren. Weitere Informationen finden Sie unter Animierte Vektorbilder in Compose.

Hinweise zu SVG- und PSD-Dateien

Ein Vektor-Drawable eignet sich für einfache Symbole. Die Material-Symbole sind gute Beispiele für die Arten von Bildern, die sich gut als Vektordrawables in einer App eignen. Im Gegensatz dazu haben viele App-Startsymbole viele Details, sodass sie sich besser als Rasterbilder eignen.

Das anfängliche Laden eines Vektordrawables kann mehr CPU-Zyklen kosten als das entsprechende Rasterbild. Danach sind Speichernutzung und Leistung bei beiden ähnlich. Wir empfehlen, Vektorgrafiken auf maximal 200 × 200 dp zu beschränken, da das Rendern sonst zu lange dauern kann.

Vektordrawables können zwar eine oder mehrere Farben unterstützen, in vielen Fällen ist es jedoch sinnvoll, Symbole schwarz (android:fillColor="#FF000000") zu färben. Mit diesem Ansatz können Sie dem Vektordrawable, das Sie in einem Layout platziert haben, eine Farbgebung hinzufügen. Die Symbolfarbe ändert sich dann in die Farbgebung. Wenn die Symbolfarbe nicht Schwarz ist, wird sie möglicherweise mit der Tönungsfarbe kombiniert.

Lösungen für die Abwärtskompatibilität von Vektor-Drawables

In der folgenden Tabelle sind die beiden Techniken zusammengefasst, die Sie für die Abwärtskompatibilität verwenden können:

Verfahren Drawables im APK VectorDrawable-XML-Elemente Version Build-Flags App-Code
PNG-Generierung Vektor und Raster Teilmengen werden unterstützt

SVG: Android-Plug-in für Gradle 1.5.0 oder höher

PSD: Android Studio 2.2 oder höher

Standard Unterstützung einer Vielzahl von Codierungstechniken
AndroidX 1.0 oder höher Vektor Umfassende Unterstützung Android-Plug-in für Gradle 3.2 oder höher Support Library-Anweisungen erforderlich Unterstützung einer Teilmenge von Codierungstechniken

Die Verwendung von Vektordrawables kann zu einem kleineren APK führen, das anfängliche Laden von Vektordrawables kann jedoch länger dauern.

PNG-Generierung

Android 5.0 (API-Level 21) und höher bietet Unterstützung für Vektordrawables. Wenn Ihre App ein niedrigeres Mindest-API-Level hat, fügt Vector Asset Studio die Vektordrawable-Datei zu Ihrem Projekt hinzu. Außerdem erstellt Gradle zur Build-Zeit PNG-Rasterbilder in verschiedenen Auflösungen. Gradle generiert die PNG-Dichten, die durch die Eigenschaft generatedDensities der domänenspezifischen Sprache (DSL) angegeben werden, in einer build.gradle-Datei.

Unter Android 5.0 (API-Level 21) und höher unterstützt Vector Asset Studio alle VectorDrawable-Elemente. Aus Gründen der Abwärtskompatibilität mit Android 4.4 (API-Level 20) und niedriger unterstützt Vector Asset Studio die folgenden XML-Elemente:

<vector>

  • android:width
  • android:height
  • android:viewportWidth
  • android:viewportHeight
  • android:alpha

<group>

  • android:rotation
  • android:pivotX
  • android:pivotY
  • android:scaleX
  • android:scaleY
  • android:translateX
  • android:translateY

<path>

  • android:pathData
  • android:fillColor
  • android:strokeColor
  • android:strokeWidth
  • android:strokeAlpha
  • android:fillAlpha
  • android:strokeLineCap
  • android:strokeLineJoin
  • android:strokeMiterLimit

Sie können den von Vector Asset Studio generierten XML-Code ändern. Das ist jedoch nicht empfehlenswert. Das Ändern der Werte im Code sollte keine Probleme verursachen, solange sie gültig und statisch sind. Wenn Sie XML-Elemente hinzufügen möchten, müssen Sie darauf achten, dass sie basierend auf Ihrem Mindest-API-Level unterstützt werden.

AndroidX

Für diese Technik sind AndroidX 1.0 oder höher und das Android-Plug-in für Gradle 3.2 oder höher erforderlich. Außerdem werden nur Vektordrawables verwendet. Mit der Klasse VectorDrawableCompat in AndroidX können Sie VectorDrawable in Android 2.1 (API-Level 7) und höher unterstützen.

Bevor Sie Vector Asset Studio verwenden können, müssen Sie Ihrer Datei build.gradle eine Anweisung hinzufügen:

Kotlin

android {
    defaultConfig {
        vectorDrawables.useSupportLibrary = true
    }
}

dependencies {
    implementation("androidx.appcompat:appcompat:1.7.1")
}

Groovy

android {
    defaultConfig {
        vectorDrawables.useSupportLibrary = true
    }
}

dependencies {
    implementation 'androidx.appcompat:appcompat:1.7.1'
}

Vector Asset Studio ausführen

So starten Sie Vector Asset Studio:

  1. Öffnen Sie in Android Studio ein Android-App-Projekt.

  2. Wählen Sie im Fenster Projekt die Android-Ansicht aus.

  3. Klicken Sie mit der rechten Maustaste auf den Ordner res und wählen Sie Neu > Vector Asset aus.

    Dieses Menüelement ist auch in einigen anderen Projektansichten und Ordnern verfügbar.

    Vector Asset Studio wird angezeigt.

    Abbildung 1. Vector Asset Studio

  4. Wenn stattdessen das Dialogfeld Need Newer Android Plugin for Gradle (Neuere Version des Android-Plug-ins für Gradle erforderlich) angezeigt wird, korrigieren Sie Ihre Gradle-Version so:

    1. Wählen Sie File > Project Structure (Datei > Projektstruktur).

    2. Wählen Sie im Dialogfeld Project Structure (Projektstruktur) die Option Project (Projekt) aus.

    3. Ändern Sie im Feld Android Plugin Version (Android-Plug-in-Version) die Android-Plug-in-Version für Gradle in 1.5.0 oder höher und klicken Sie auf OK.

      Gradle synchronisiert das Projekt.

    4. Klicken Sie in der Android-Ansicht des Fensters Projekt mit der rechten Maustaste auf den Ordner res und wählen Sie Neu > Vektor-Asset aus.

      Vector Asset Studio wird angezeigt.

  5. Fahren Sie mit Vektorgrafik importieren fort.

Vektorgrafik importieren

Mit Vector Asset Studio können Sie eine Vektorgrafikdatei in Ihr App-Projekt importieren. Führen Sie einen der folgenden Schritte aus:

Material Design-Symbol hinzufügen

Nachdem Sie Vector Asset Studio geöffnet haben, können Sie ein Material Design-Symbol so hinzufügen:

  1. Wählen Sie in Vector Asset Studio Clip-Art aus.

  2. Klicken Sie im Feld „Clip-Art“ auf die Schaltfläche.

  3. Das Dialogfeld Symbol auswählen wird angezeigt. Sie können filtern, welche Symbole sichtbar sind, indem Sie eine Symbolkategorie aus dem Menü auswählen oder in das Suchfeld eingeben (siehe Abbildung 2).

    Abbildung 2. Filtern von Material-Symbolen im Vector Asset Studio

    Wählen Sie ein Material Design-Symbol aus und klicken Sie auf OK. Das Symbol wird in der Vector Drawable Preview (Vorschau für Vektordrawables) angezeigt.

  4. Optional können Sie den Ressourcennamen, die Größe, die Deckkraft und die Einstellung für die Spiegelung von rechts nach links ändern:

    • Name: Geben Sie einen neuen Namen ein, wenn Sie den Standardnamen nicht verwenden möchten. Vector Asset Studio erstellt automatisch einen eindeutigen Namen (fügt eine Zahl an das Ende des Namens an), wenn dieser Ressourcenname bereits im Projekt vorhanden ist. Der Name darf nur Kleinbuchstaben, Unterstriche und Ziffern enthalten.

    • Überschreiben: Wählen Sie diese Option aus, wenn Sie die Größe des Bildes anpassen möchten. Wenn Sie eine neue Größe eingeben, wird die Änderung im Vorschau-Bereich angezeigt.

      Der Standardwert ist 24 × 24 dp, wie in der Material Design-Spezifikation definiert. Heben Sie die Auswahl des Kästchens auf, um zur Standardeinstellung zurückzukehren.

    • Deckkraft: Mit dem Schieberegler können Sie die Deckkraft des Bildes anpassen. Die Änderung wird im Vorschau-Bereich angezeigt.

    • Automatische Spiegelung für RTL-Layout aktivieren: Wählen Sie diese Option aus, wenn bei einem RTL-Layout (von rechts nach links) ein Spiegelbild anstelle eines LTR-Layouts (von links nach rechts) angezeigt werden soll. Einige Sprachen werden beispielsweise von rechts nach links gelesen. Wenn Sie ein Pfeilsymbol verwenden, sollten Sie in diesem Fall ein Spiegelbild davon anzeigen. Beachten Sie, dass Sie bei der Arbeit mit einem älteren Projekt möglicherweise auch android:supportsRtl="true" in Ihr App-Manifest aufnehmen müssen. Die automatische Spiegelung wird auf Geräten mit Android 5.0 (API-Level 21) und höher sowie mit AndroidX unterstützt.

  5. Klicken Sie auf Weiter.

  6. Optional: Ändern Sie das Modul- und Ressourcenverzeichnis:

    • Res-Verzeichnis: Wählen Sie das Ressource-Source-Set aus, dem Sie das Vektor-Drawable hinzufügen möchten: src/main/res, src/debug/res, src/release/res oder ein benutzerdefiniertes Source-Set. Der Haupt-Source-Set gilt für alle Build-Varianten, einschließlich Debug- und Release-Varianten. Die Source-Sets für Debug und Release überschreiben das Haupt-Source-Set und gelten für eine Version eines Builds. Das Debug-Source-Set ist nur zum Debugging. Wenn Sie ein neues Source-Set definieren möchten, wählen Sie File > Project Structure > app > Build Types (Datei > Projektstruktur > App > Build-Typen) aus. Sie können beispielsweise eine Beta-Quellgruppe definieren und eine Version eines Symbols erstellen, die rechts unten den Text „BETA“ enthält. Weitere Informationen finden Sie unter Build-Varianten konfigurieren.

    Im Bereich Ausgabeverzeichnisse werden das Vektordrawable und das Verzeichnis angezeigt, in dem es sich befindet.

  7. Klicken Sie auf Fertig.

    Vector Asset Studio fügt dem Projekt im Ordner app/src/main/res/drawable/ eine XML-Datei hinzu, in der das Vektordrawable definiert ist. In der Android-Ansicht des Fensters Projekt können Sie die generierte XML-Datei für Vektoren im Ordner drawable aufrufen.

  8. Erstellen Sie das Projekt:

    Wenn das Mindest-API-Level Android 4.4 (API-Level 20) oder niedriger ist und Sie die AndroidX-Technik nicht aktiviert haben, generiert Vector Asset Studio PNG-Dateien. In der Projektdateiansicht des Projektfensters können Sie die generierten PNG- und XML-Dateien im Ordner app/build/generated/res/pngs/debug/ ansehen.

    Sie sollten diese generierten Rasterdateien nicht bearbeiten, sondern mit der Vektor-XML-Datei arbeiten. Das Build-System regeneriert die Rasterdateien bei Bedarf automatisch, sodass Sie sie nicht verwalten müssen.

SVG- oder PSD-Datei importieren

Nachdem Sie Vector Asset Studio geöffnet haben, können Sie eine SVG- oder PSD-Datei so importieren:

  1. Wählen Sie in Vector Asset Studio die Option Local file (Lokale Datei) aus.

    Die Datei muss sich auf einem lokalen Laufwerk befinden. Wenn sich die Datei beispielsweise im Netzwerk befindet, müssen Sie sie zuerst auf ein lokales Laufwerk herunterladen.

  2. Geben Sie eine Bilddatei an, indem Sie auf klicken .

    Das Bild wird in der Vector Drawable Preview (Vorschau für Vektordrawable) angezeigt.

    Wenn die SVG- oder PSD-Datei nicht unterstützte Funktionen enthält, wird unten in Vector Asset Studio ein Fehler angezeigt (siehe Abbildung 3).

    Abbildung 3. Vector Asset Studio zeigt einige Fehler an.

    Wenn Fehler angezeigt werden, müssen Sie dafür sorgen, dass das importierte Vektordrawable richtig gerendert wird. Scrollen Sie durch die Liste, um die Fehler aufzurufen.

    Eine Liste der unterstützten Elemente finden Sie unter Lösungen für die Abwärtskompatibilität von Vektordrawables. Weitere Informationen zu zulässigen PSD-Dateien finden Sie unter Unterstützung und Einschränkungen für PSD-Dateien.

  3. Optional können Sie den Ressourcennamen, die Größe, die Deckkraft und die Einstellung für die Spiegelung von rechts nach links ändern:

    • Name: Geben Sie einen neuen Namen ein, wenn Sie den Standardnamen nicht verwenden möchten. Vector Asset Studio erstellt automatisch einen eindeutigen Namen (fügt eine Zahl an das Ende des Namens an), wenn dieser Ressourcenname bereits im Projekt vorhanden ist. Der Name darf nur Kleinbuchstaben, Unterstriche und Ziffern enthalten.

    • Überschreiben: Wählen Sie diese Option aus, wenn Sie die Größe des Bildes anpassen möchten. Nachdem Sie es ausgewählt haben, ändert sich die Größe in die Größe des Bildes. Wenn Sie die Größe ändern, wird die Änderung im Vorschau-Bereich angezeigt. Der Standardwert ist 24 × 24 dp, wie in der Material Design-Spezifikation definiert.

    • Deckkraft: Mit dem Schieberegler können Sie die Deckkraft des Bildes anpassen. Die Änderung wird im Vorschau-Bereich angezeigt.

    • Automatische Spiegelung für RTL-Layout aktivieren: Wählen Sie diese Option aus, wenn bei einem RTL-Layout (von rechts nach links) ein Spiegelbild anstelle eines LTR-Layouts (von links nach rechts) angezeigt werden soll. In einigen Sprachen wird beispielsweise von rechts nach links gelesen. Wenn Sie ein Pfeilsymbol haben, sollten Sie in diesem Fall ein Spiegelbild davon anzeigen. Beachten Sie, dass Sie bei der Arbeit mit einem älteren Projekt möglicherweise android:supportsRtl="true" in das App-Manifest einfügen müssen. Die automatische Spiegelung wird von Android 5.0 (API-Level 21) und höher sowie von AndroidX unterstützt.

  4. Klicken Sie auf Weiter.

  5. Optional können Sie das Ressourcenverzeichnis ändern:

    • Res-Verzeichnis: Wählen Sie das Ressource-Source-Set aus, dem Sie das Vektor-Drawable hinzufügen möchten: src/main/res, src/debug/res, src/release/res oder ein benutzerdefiniertes Source-Set. Der Haupt-Source-Set gilt für alle Build-Varianten, einschließlich Debug- und Release-Varianten. Die Debug- und Release-Source-Sets überschreiben das Haupt-Source-Set und gelten für eine Version eines Builds. Das Debug-Source-Set ist nur für das Debugging vorgesehen. Wenn Sie ein neues Quellset definieren möchten, wählen Sie File > Project Structure > app > Build Types (Datei > Projektstruktur > App > Build-Typen) aus. Sie könnten beispielsweise eine Beta-Quellgruppe definieren und eine Version eines Symbols erstellen, die in der unteren rechten Ecke den Text „BETA“ enthält. Weitere Informationen finden Sie unter Build-Varianten konfigurieren.

    Im Bereich Ausgabeverzeichnisse werden das Vektordrawable und das Verzeichnis angezeigt, in dem es sich befindet.

  6. Klicken Sie auf Fertig.

    Vector Asset Studio fügt dem Projekt im Ordner app/src/main/res/drawable/ eine XML-Datei hinzu, in der das Vektordrawable definiert ist. In der Android-Ansicht des Fensters Projekt können Sie die generierte XML-Datei für Vektoren im Ordner drawable aufrufen.

  7. Erstellen Sie das Projekt:

    Wenn das Mindest-API-Level Android 4.4 (API-Level 20) oder niedriger ist und Sie die AndroidX-Technik nicht aktiviert haben, generiert Vector Asset Studio PNG-Dateien. In der Projektdateiansicht des Projektfensters können Sie die generierten PNG- und XML-Dateien im Ordner app/build/generated/res/pngs/debug/ ansehen.

    Sie sollten diese generierten Rasterdateien nicht bearbeiten, sondern mit der Vektor-XML-Datei arbeiten. Das Build-System regeneriert die Rasterdateien bei Bedarf automatisch, sodass Sie sie nicht verwalten müssen.

Auf ein Vektor-Asset in Jetpack Compose verweisen

Nachdem Sie mit Vector Asset Studio ein Asset zu Ihrem res/drawable-Ordner hinzugefügt haben, können Sie in Ihrem Code darauf verweisen.

In Jetpack Compose ist die häufigste Methode zum Anzeigen von Vektoren die Verwendung der Composables Icon oder Image.

Die zusammensetzbare Funktion Icon ist die Standardmethode zum Anzeigen kleiner, monochromer Assets. Es bietet integrierte Unterstützung für Material Design-Grundsätze, z. B. das Anwenden von dynamischen Tönungen basierend auf Material 3-Designs und automatische Barrierefreiheit durch Inhaltsbeschreibungen.

Verwenden Sie die painterResource API, um dem Composable XML-Vektor-Assets bereitzustellen:

Icon(
    painter = painterResource(id = R.drawable.ic_speedometer),
    tint = MaterialTheme.colorScheme.primary, // Applies dynamic theme color
    contentDescription = "Current Speed", // Essential for accessibility
)

Für komplexe und mehrfarbige Vektoren verwenden Sie die zusammensetzbare Funktion Image:

Image(
     painter = painterResource(id = R.drawable.ic_complex_vector),
     contentDescription = null // Decorative element
)

Informationen zu anderen komplexen Szenarien, z. B. zum Anpassen eines Bildes oder zum Optimieren der Leistung, finden Sie unter Mit Bildern arbeiten. Informationen zum Animieren von Vektoren finden Sie unter Animierte Vektorgrafiken in Compose.

Von Vector Asset Studio generierten XML-Code ändern

Sie können den XML-Code für Vektordrawables ändern, nicht aber die PNGs und den entsprechenden XML-Code, der zur Build-Zeit generiert wird. Wir raten jedoch davon ab.

Wenn Sie die PNG-Generierungstechnik verwenden, sorgt Vector Asset Studio dafür, dass das Vektordrawable und die PNGs übereinstimmen und dass das Manifest den richtigen Code enthält. Wenn Sie Code hinzufügen, der unter Android 4.4 (API-Level 20) und niedriger nicht unterstützt wird, können sich Ihre Vektor- und PNG-Bilder unterscheiden. Außerdem muss das Manifest den Code enthalten, der für die Änderungen erforderlich ist.

So ändern Sie die Vektor-XML-Datei, wenn Sie die AndroidX-Technik nicht verwenden:

  1. Doppelklicken Sie im Fenster Project (Projekt) auf die generierte Vektor-XML-Datei im Ordner drawable.

    Die XML-Datei wird im Editor und im Fenster Vorschau angezeigt.

    Abbildung 4. Eine Vektor-XML-Datei, die im Code-Editor und im Vorschaufenster angezeigt wird.

  2. Bearbeiten Sie den XML-Code entsprechend dem, was vom Mindest-API-Level unterstützt wird:

    • Android 5.0 (API-Level 21) und höher: Vector Asset Studio unterstützt alle Elemente von Drawable und VectorDrawable. Sie können XML-Elemente hinzufügen und Werte ändern. In Jetpack Compose können Sie das Vektordrawable in ImageVector laden, um es weiter anzupassen.

    • Android 4.4 (API-Level 20) und niedriger: Vector Asset Studio unterstützt alle Drawable-Elemente und eine Teilmenge der VectorDrawable-Elemente. Eine Liste finden Sie unter Lösungen für die Abwärtskompatibilität von Vektordrawables. Sie können Werte im generierten Code ändern und unterstützte XML-Elemente hinzufügen.

  3. Erstellen Sie das Projekt und prüfen Sie, ob das Vektordrawable und die entsprechenden Rasterbilder gleich aussehen.

    Die generierten PNGs können im Vorschaubereich anders als in der App dargestellt werden. Das liegt an den unterschiedlichen Rendering-Engines und an Änderungen, die vor einem Build am Vektordrawable vorgenommen wurden. Wenn Sie der von Vector Asset Studio erstellten XML-Datei für Vektoren Code hinzufügen, werden alle Funktionen, die in Android 4.4 (API-Level 20) und niedriger nicht unterstützt werden, nicht in den generierten PNG-Dateien angezeigt. Wenn Sie Code hinzufügen, sollten Sie daher immer prüfen, ob die generierten PNGs mit dem Vektordrawable übereinstimmen. Dazu können Sie im Fenster Projekt in der Ansicht „Projektdateien“ auf die PNG-Datei doppelklicken. Der linke Rand des Code-Editors zeigt auch das PNG-Bild an, wenn Ihr Code auf das Drawable verweist (siehe Abbildung 5).

    Abbildung 5. Ein PNG-Bild, das am linken Rand des Code-Editors angezeigt wird.

Vektordrawable aus einem Projekt löschen

So entfernen Sie ein Vektordrawable aus einem Projekt:

  1. Löschen Sie im Fenster Project die generierte Vektor-XML-Datei, indem Sie die Datei auswählen und die Entf-Taste drücken (oder Bearbeiten > Löschen auswählen).

    Das Dialogfeld Sicheres Löschen wird angezeigt.

  2. Wählen Sie optional Optionen aus, um herauszufinden, wo die Datei im Projekt verwendet wird, und klicken Sie auf OK.

    Android Studio löscht die Datei aus dem Projekt und vom Laufwerk. Wenn Sie jedoch ausgewählt haben, dass nach Stellen im Projekt gesucht werden soll, an denen die Datei verwendet wird, und einige Verwendungen gefunden werden, können Sie sie ansehen und entscheiden, ob Sie die Datei löschen möchten.

  3. Wählen Sie Build > Clean Project (Projekt bereinigen) aus.

    Alle automatisch generierten PNG- und XML-Dateien, die dem gelöschten Vektordrawable entsprechen, werden aus dem Projekt und dem Laufwerk entfernt.

Bereitstellung einer App mit Vektordrawables

Wenn Sie die AndroidX-Technik verwendet haben oder Ihr minimales API-Level Android 5.0 (API-Level 21) oder höher ist, enthält Ihr APK die Vektordrawables, die Sie mit Vector Asset Studio hinzugefügt haben. Diese APKs sind kleiner, als wenn die Vektorbilder in PNGs konvertiert würden.

Wenn Ihr Mindest-API-Level Android 4.4 (API-Level 20) oder niedriger umfasst und Sie entsprechende Vektordrawables und Rasterbilder in Ihrem Projekt haben, haben Sie zwei Möglichkeiten, Ihre APK-Dateien bereitzustellen:

  • Erstellen Sie ein APK, das sowohl die Vektordrawables als auch die entsprechenden Rasterdarstellungen enthält. Diese Lösung ist am einfachsten zu implementieren.
  • Erstellen Sie separate APKs für verschiedene API-Ebenen. Wenn Sie die entsprechenden Rasterbilder nicht in das APK für Android 5.0 (API-Level 21) und höher einfügen, kann das APK viel kleiner sein. Weitere Informationen finden Sie unter Unterstützung für mehrere APKs.

Unterstützung und Einschränkungen für PSD-Dateien

Vector Asset Studio unterstützt nicht alle PSD-Dateifunktionen. In der folgenden Liste sind die unterstützten und nicht unterstützten PSD-Merkmale sowie einige Details zur Konvertierung zusammengefasst.

Dokument

Unterstützt:

  • Der PSD-Farbmodus muss „Bitmap“, „Graustufen“, „Indiziert“, „RGB“, „Lab“ oder „CMYK“ sein.
  • Eine Farbtiefe von 8, 16 oder 32 Bit.

Details zur Conversion:

  • Die Abmessungen des PSD-Dokuments werden zu den Abmessungen des Vektordrawables und des Darstellungsbereichs.

Nicht unterstützt:

  • Ein PSD-Farbmodus mit Duoton oder Mehrkanal.

Formen

Unterstützt:

  • Beschneidungspfadmasken, wenn die Beschneidungsbasis eine andere Form ist.
  • Formvorgänge, einschließlich Zusammenführen/Hinzufügen, Überschneiden, Subtrahieren und Ausschließen.

Nicht unterstützt:

  • Regel zum Füllen von Formen in Photoshop. In Android 6.0 (API-Level 23) und niedriger unterstützen Vektordrawables nur die Nonzero-Füllregel. Bei sich selbst schneidenden Formen kann diese Einschränkung zu Unterschieden beim Rendern zwischen der PSD und dem resultierenden Vektordrawable führen. Um dieses Problem zu beheben, fügen Sie dem Shape im Vektordrawable android:fillType="evenOdd" hinzu. Beispiel:

    <vector xmlns:android="https://schemas.android.com/apk/res/android"
      android:viewportHeight="168"
      android:height="24dp"
      android:viewportWidth="209"
      android:width="24dp">
    
      <path
          android:fillAlpha="1.0"
          android:fillColor="#000000"
          android:fillType="evenOdd"
          android:pathData="M24,58 L24,167 L114,167 L114,66 M64,1 L64,96 L208,96 L208,8 M1,97 L146,139 L172,47"/>
    </vector>

Striche und Füllungen

Unterstützt:

  • Striche, einschließlich Farbe, Deckkraft, Breite, Verbindung, Abschluss, Strichen und Ausrichtung.
  • Füllungen und Striche in Volltonfarben
  • Strich- und Füllfarben, die als RGB, Lab oder CMYK angegeben sind.

Details zur Conversion:

  • Wenn ein Strich gestrichelt ist, mit einer Clipping-Basis beschnitten wird oder eine andere Ausrichtung als „Mitte“ verwendet, wird er in Vector Asset Studio in eine Füllform im Vektordrawable konvertiert.

Nicht unterstützt:

  • Farbverläufe und andere Füllungen und Striche als einfarbige.

Deckkraft

Unterstützt:

  • Formebenen mit einer Deckkraft von 0.

Details zur Conversion:

  • In Vector Asset Studio wird die Fülldeckkraft mit der Deckkraft der Ebene multipliziert, um den Alpha-Wert der Füllung zu berechnen.
  • Das Tool multipliziert die Deckkraft der Clipping-Basis (falls vorhanden) mit dem Füll-Alpha, um das endgültige Füll-Alpha zu berechnen.
  • Das Tool multipliziert die Deckkraft des Strichs mit der Deckkraft der Ebene, um den Alpha-Wert des Strichs zu berechnen.
  • Das Tool multipliziert die Deckkraft der Clipping-Basis (falls vorhanden) mit dem Strich-Alpha, um das endgültige Strich-Alpha zu berechnen.

Ebenen

Unterstützt:

  • Jede sichtbare Formebene.

Details zur Conversion:

  • In Vector Asset Studio bleiben die Namen der Ebenen in der Vektordrawable-Datei erhalten.

Nicht unterstützt:

  • Ebeneneffekte
  • Korrektur- und Textebenen
  • Mischmodi (werden ignoriert).

Unterstützung und Einschränkungen für SVG-Dateien

Vector Asset Studio unterstützt nicht alle SVG-Dateifunktionen. Im folgenden Abschnitt werden die unterstützten und nicht unterstützten Funktionen zusammengefasst, wenn das Tool eine SVG-Datei in eine VectorDrawable-Datei konvertiert. Außerdem finden Sie dort zusätzliche Details zur Konvertierung.

Unterstützte Funktionen

VectorDrawable unterstützt alle Funktionen von Tiny SVG 1.2 mit Ausnahme von text.

Formen

VectorDrawable unterstützt SVG-Pfade.

Das Tool wandelt einfache Formen wie Kreise, Quadrate und Polygone in Pfade um.

Transformationen

Das Tool unterstützt Transformationsmatrizen und wendet sie direkt auf untergeordnete Pfade an.

Gruppen

Das Tool unterstützt Gruppenelemente für Übersetzung, Skalierung und Drehung. Gruppen unterstützen keine Deckkraft-Eigenschaft.

Das Tool wendet auch alle Gruppenformatierungen oder ‑transparenzen auf untergeordnete Pfade an.

Füllungen und Striche

Pfade können mit Volltonfarben oder Farbverläufen (linear, radial oder winklig) gefüllt und mit Strichen versehen werden. Es werden nur zentrierte Striche unterstützt. Mischmodi werden nicht unterstützt. Gestrichelte Pfade werden nicht unterstützt.

Masken

Das Tool unterstützt eine Beschneidungspfadmaske pro Gruppe.

Vom SVG-Importer nicht unterstützte Funktionen

Alle Funktionen, die nicht im Abschnitt Unterstützte Funktionen aufgeführt sind, werden nicht unterstützt. Zu den nicht unterstützten Funktionen gehören:

  • Filtereffekte: Effekte wie Schlagschatten, Unschärfe und Farbmatrix werden nicht unterstützt.
  • Text: Es wird empfohlen, Text mit anderen Tools in Formen umzuwandeln.
  • Musterfüllungen

Zusätzliche Ressourcen

Weitere Informationen zu Vektorgrafiken finden Sie in den folgenden zusätzlichen Ressourcen:

Dokumentation

Inhalte ansehen