Die beiden häufigsten Arten von Bildformaten sind Raster- und Vektorbilder.
Ein Rastergrafikformat enthält Pixel: winzige einzelne Quadrate, die eine Farbe enthalten (bestehend aus Rot-, Grün-, Blau- und Alphawerten). 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 die Größe des Bildes erhöhen, gehen Details verloren und es kann zu Pixelbildung kommen. Beispiele für Rastergrafikformate sind JPEG, PNG und WEBP.
Vektor-Images hingegen sind 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 werden soll, z. B. eine Linie, ein Punkt oder eine Füllung. Wenn Sie einen Vektor auf dem Bildschirm skalieren, verliert er nicht an Qualität, da die mathematische Formel die Beziehung zwischen den verschiedenen Befehlen beibehält. Gute Beispiele für ImageVectors sind die Material-Symbole, 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 grundlegende Anwendungsfälle kann painterResource() verwendet werden, um ein ImageBitmap zu erstellen. Es wird 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 benutzerdefinierte Painter-Implementierung) und Zugriff auf die ImageBitmap selbst benötigen, können Sie sie so laden:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
Ein VectorPainter ist dafür verantwortlich, ein ImageVector auf dem Bildschirm zu zeichnen.
ImageVector unterstützt eine Teilmenge von SVG-Befehlen (Scalable Vector Graphics). Nicht alle Bilder können als Vektoren dargestellt werden. Beispielsweise können die Fotos, die Sie mit Ihrer Kamera aufnehmen, nicht in einen Vektor umgewandelt werden.
Sie können ein benutzerdefiniertes ImageVector erstellen, indem Sie entweder eine vorhandene XML-Datei für ein Vektor-Drawable importieren (mit dem Importtool in Android Studio) oder die Klasse implementieren und Pfadbefehle manuell ausgeben.
Für grundlegende Anwendungsfälle funktioniert painterResource() für ImageVectors genauso wie für die Klasse ImageBitmap und gibt ein VectorPainter als Ergebnis zurück. painterResource() übernimmt das Laden von VectorDrawables und BitmapDrawables in VectorPainter bzw. BitmapPainter. Verwenden Sie Folgendes, um ein VectorDrawable in ein Image zu laden:
Image( painter = painterResource(id = R.drawable.baseline_shopping_cart_24), contentDescription = stringResource(id = R.string.shopping_cart_content_desc) )
Wenn Sie weitere Anpassungen vornehmen und auf das ImageVector selbst zugreifen möchten, können Sie es so laden:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Empfehlungen für Sie
- Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Benutzerdefinierter Painter {:#custom-painter}
- Ressourcen in Compose
- Bilder laden {:#loading-images}