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. Ein gutes Beispiel 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. Die Bitmap wird dann von einem BitmapPainter auf dem Bildschirm gezeichnet.
Für einfache Anwendungsfälle kann die painterResource() verwendet werden, die sich um die Erstellung eines ImageBitmap kümmert und ein Painter-Objekt zurückgibt (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. Nicht alle Bilder können als Vektoren dargestellt werden. So können beispielsweise 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 (mit dem Importtool in Android Studio) oder die Klasse implementieren und Pfadbefehle manuell ausgeben.
Bei einfachen Anwendungsfällen funktioniert painterResource() für die Klasse ImageBitmap genauso wie für ImageVectors. Als Ergebnis wird ein VectorPainter zurückgegeben. painterResource() übernimmt das Laden von VectorDrawables und BitmapDrawables in VectorPainter bzw. BitmapPainter. So laden Sie ein 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 zugreifen müssen, können Sie es so laden:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Empfehlungen für dich
- Hinweis: Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Benutzerdefinierte Maler {:#custom-painter}
- Ressourcen in Compose
- Bilder werden geladen {:#loading-images}