Die zusammensetzbare Funktion Icon ist eine bequeme Möglichkeit, ein einfarbiges Symbol auf dem Bildschirm zu zeichnen, das den Material Design-Richtlinien entspricht. Wenn Sie Icon verwenden möchten, schließen Sie die Bibliothek Compose Material oder die Compose Material 3-Bibliothek ein.
Wenn Sie beispielsweise ein Vektor-Drawable haben, das Sie mit Material-Standardeinstellungen laden möchten, können Sie die zusammensetzbare Funktion Icon so verwenden:
Icon(
painter = painterResource(R.drawable.baseline_directions_bus_24),
contentDescription = stringResource(id = R.string.bus_content_description)
)
Standardmäßig ist die zusammensetzbare Funktion Icon mit LocalContentColor.current eingefärbt und hat die Größe 24.dp. Außerdem wird ein tint-Farbparameter verfügbar gemacht, der denselben Mechanismus zur Färbung nutzt, wie im Abschnitt Bildtöne beschrieben.
Die zusammensetzbare Funktion Icon ist für die Verwendung kleiner Symbolelemente vorgesehen. Für weitere Anpassungsoptionen sollten Sie die zusammensetzbare Funktion Image verwenden.
Die Material Icon-Bibliothek enthält auch eine Reihe vordefinierter Icons, die in Compose verwendet werden können, ohne eine SVG manuell importieren zu müssen. So zeichnen Sie die runde Version des Einkaufswagensymbols:
Icon(
Icons.Rounded.ShoppingCart,
contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
Icon ist nicht erforderlich, um ein VectorDrawable-Objekt im Hintergrund auf dem Bildschirm zu rendern. Icon verwendet Modifier.paint(painterResource(R.drawable.ic_bus_stop)), um das Icon-Element auf dem Bildschirm zu zeichnen. Weitere Informationen zu allen verfügbaren Symbolen finden Sie in der Dokumentation zu Symbolen.
Empfehlungen für dich
- Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Ressourcen in Compose
- Bedienungshilfen in der Funktion „Compose“
- Bilder werden geladen {:#loading-images}