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 einer Verpixelung kommen. Beispiele für Rastergrafikformate sind JPEG, PNG und WEBP.
Vektorgrafiken 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, geht keine Qualität verloren, da die mathematische Formel die Beziehung zwischen den verschiedenen Befehlen beibehält. Gute Beispiele für ImageVector 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 dafür verantwortlich, die Bitmap auf dem Bildschirm zu zeichnen.
Für einfache Anwendungsfälle kann painterResource() verwendet werden, um ein ImageBitmap zu erstellen und ein Painter-Objekt zurückzugeben (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 ImageBitmap selbst benötigen, können Sie es so laden:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
Ein VectorPainter ist für das Zeichnen eines ImageVector auf dem Bildschirm verantwortlich.
ImageVector unterstützt eine Teilmenge von SVG-Befehlen (Scalable Vector Graphics). Nicht alle Bilder können als Vektoren dargestellt werden. So können beispielsweise 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 Vektordrawables importieren (in Android Studio über das Import-Tool) oder die Klasse implementieren und Pfadbefehle manuell ausgeben.
Für einfache Anwendungsfälle funktioniert painterResource() für ImageVectors auf dieselbe Weise wie für die Klasse ImageBitmap. Als Ergebnis wird ein VectorPainter zurückgegeben. painterResource() übernimmt das Laden von VectorDrawables und BitmapDrawables in VectorPainter bzw. BitmapPainter. So laden Sie eine VectorDrawable in ein Bild:
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üssen, können Sie es so laden:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Empfehlungen für Sie
- Hinweis: Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Benutzerdefinierter Painter {:#custom-painter}
- Ressourcen in Compose
- Bilder laden {:#loading-images}