Die beiden häufigsten Arten von Bildformaten sind Raster- und Vektorbilder.
Ein Rastergrafikformat enthält Pixel: kleine einzelne Quadrate, die eine Farbe enthalten (aus Rot, Grün, Blau und Alpha-Werten). Wenn viele Pixel zusammengefügt werden, kann ein sehr detailliertes Bild entstehen, z. B. ein Foto. Eine Rastergrafik hat eine feste Auflösung (feste Anzahl von Pixeln). Wenn Sie also die Größe des Bildes erhöhen, verliert es Details und verpixelt. Beispiele für Rastergrafikformate sind JPEG, PNG und WEBP.
Vektorbilder sind hingegen skalierbare mathematische Darstellungen eines visuellen Elements auf dem Bildschirm. Ein Vektor ist eine Reihe von Befehlen, die beschreiben, wie das Bild auf dem Bildschirm gezeichnet wird, z. B. eine Linie, ein Punkt oder eine Füllung. Wenn Sie einen Vektor auf dem Bildschirm skalieren, bleibt die Qualität erhalten, da die mathematische Formel die Beziehung zwischen den verschiedenen Befehlen aufrechterhält. Ein gutes Beispiel für ImageVector sind die Materialsymbole, da sie alle mit mathematischen Formeln definiert werden können.
ImageBitmap
In Compose kann ein Rasterbild (oft als Bitmap bezeichnet) in eine ImageBitmap-Instanz geladen werden. Ein BitmapPainter ist für das Zeichnen der Bitmap auf dem Bildschirm verantwortlich.
Für einfache Anwendungsfälle kann die painterResource() verwendet werden. Damit wird ein ImageBitmap erstellt und ein Painter-Objekt zurückgegeben (in diesem Fall ein BitmapPainter):
Image(
painter = painterResource(id = R.drawable.dog),
contentDescription = stringResource(id = R.string.dog_content_description)
)
Wenn Sie weitere Anpassungen benötigen (z. B. eine Custom Painter-Implementierung) und Zugriff auf das ImageBitmap selbst benötigen, können Sie es so laden:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
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 als Vektoren dargestellt werden. Fotos, die Sie mit Ihrer Kamera aufnehmen, lassen sich beispielsweise nicht in einen Vektor umwandeln.
Sie können ein benutzerdefiniertes ImageVector erstellen, indem Sie entweder eine vorhandene gezeichnete Vektor-XML-Datei importieren (mit dem Importtool in Android Studio importiert) oder die Klasse implementieren und Pfadbefehle manuell ausführen.
In einfachen Anwendungsfällen funktioniert es genauso wie painterResource() für die Klasse ImageBitmap, aber auch für ImageVectors, wobei ein VectorPainter als Ergebnis zurückgegeben wird. painterResource() übernimmt das Laden von VectorDrawables und BitmapDrawables in VectorPainter bzw. 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)
)
Wenn du weitere Anpassungen benötigst und selbst auf die ImageVector zugreifen möchtest, kannst du sie so laden:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
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}