ImageBitmap und ImageVector im Vergleich

Die beiden häufigsten Arten von Bildformaten sind Raster- und Vektorbilder.

Ein Rastergrafikformat enthält Pixel, d. h. kleine einzelne Quadrate, die ein Farbe (bestehend aus Rot-, Grün-, Blau- und Alpha-Werten). Wenn Sie viel Pixel zusammen bilden, kann ein sehr detailliertes Bild entstehen, etwa ein Foto. A Rastergrafik hat eine feste Auflösung (feste Pixelanzahl). Das bedeutet, dass Vergrößert das Bild, verliert es Details und die Verpixelung kann auftreten. Beispiele für Rastergrafikformate sind JPEG, PNG und WEBP.

<ph type="x-smartling-placeholder">

</ph>

Vektorbilder sind hingegen skalierbare mathematische Darstellungen eines visuelles Element auf dem Bildschirm. Ein Vektor ist eine Reihe von Befehlen, die beschreiben, wie das Bild auf dem Bildschirm, zum Beispiel eine Linie, einen Punkt oder eine Füllung. Beim Skalieren eines Vektors wird nicht an Qualität verloren, da die mathematische Formel Beziehung zwischen den verschiedenen Befehlen. Ein gutes Beispiel für ImageVector sind die Materialsymbole, da sie alle mit mathematische Formeln erstellen können.

<ph type="x-smartling-placeholder">

</ph>

ImageBitmap

In Compose kann ein Rasterbild (oft auch Bitmap genannt) nach oben in eine ImageBitmap-Instanz verwandelt, wobei ein BitmapPainter indem Sie die Bitmap auf dem Bildschirm zeichnen.

Für einfache Anwendungsfälle kann das painterResource() verwendet werden, das beim Erstellen eines ImageBitmap und gibt ein Painter-Objekt zurück (in diesem Fall ein BitmapPainter):

Image(
    painter = painterResource(id = R.drawable.dog),
    contentDescription = stringResource(id = R.string.dog_content_description)
)
VectorVsBitmapSnippets.kt

Wenn Sie weitere Anpassungen benötigen (z. B. einen benutzerdefinierten Maler Implementierung) und Zugriff auf das ImageBitmap selbst benötigen, können Sie es laden, auf folgende Weise:

val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
VectorVsBitmapSnippets.kt

ImageVector

Ein VectorPainter ist dafür verantwortlich, ein ImageVector auf den Bildschirm zu ziehen. ImageVector unterstützt einen Teil der SVG-Befehle. Nicht alle Bilder können die als Vektoren dargestellt werden (z. B. können Fotos, die Sie mit Ihrer Kamera aufnehmen, in einen Vektor umgewandelt werden.

Sie können einen benutzerdefinierten ImageVector erstellen, indem Sie entweder einen vorhandenen Vektor importieren Drawable-XML-Datei (mit dem Importtool in Android Studio importiert) oder Implementierung der Klasse und manuelle Ausgabe von Pfadbefehlen.

Bei einfachen Anwendungsfällen funktioniert wie bei painterResource() für den ImageBitmap verwendet wird, funktioniert es auch für ImageVectors. Es wird Folgendes zurückgegeben: VectorPainter als Ergebnis. painterResource() übernimmt das Laden von VectorDrawables und BitmapDrawables in VectorPainter und BitmapPainter . Um ein VectorDrawable in ein Bild zu laden, verwenden Sie:

Image(
    painter = painterResource(id = R.drawable.baseline_shopping_cart_24),
    contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
VectorVsBitmapSnippets.kt

Wenn Sie weitere Anpassungen benötigen und auf die ImageVector zugreifen möchten können Sie sie folgendermaßen laden:

val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
VectorVsBitmapSnippets.kt

Empfehlungen für dich

• Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
• Benutzerdefinierter Maler {:#custom-painter}
• Ressourcen in „Compose“
• Bilder werden geladen {:#loading-images}