Vector Icons

Vector Icons

Vector Graphics with Icons and Painter

Compose 234 draws every image through a Painter: painterResource(R.drawable.x) for a vector drawable or bitmap in res/, rememberVectorPainter() for an ImageVector built in code, ColorPainter for a color, and Coil 11,909 's AsyncImagePainter. Icon sizes a painter to 24 dp and tints it; Image doesn't.

The demo's Icons.Filled.Star comes from material-icons-core (Material 3 and Theming). Google's documentation now says the Material Icons artifacts are no longer maintained, and the extended set can slow builds significantly; use Material Symbols instead, one icon at a time as vector XML from Google Fonts 1 or github.com/google/material-design-icons (https://github.com/google/material-design-icons 54,032 ) (Apache 2.0):

Adding one Material Symbol as a vector drawableKotlin

U=https://raw.githubusercontent.com/google/material-design-icons/master/symbols/android
wget -q -O app/src/main/res/drawable/menu_book_24px.xml \
  $U/menu_book/materialsymbolsoutlined/menu_book_24px.xml
grep tint app/src/main/res/drawable/menu_book_24px.xml

Output

    android:tint="?attr/colorControlNormal"

As downloaded, that line broke the build with resource attr/colorControlNormal ... not found: the attribute belongs to AppCompat and Material Components themes, which a pure Compose app doesn't have. Changing it to ?android:attr/colorControlNormal fixed it, and Icon(painterResource(R.drawable.menu_book_24px), null, tint = MaterialTheme.colorScheme.primary) tints it anyway. Graphics drawn from data, such as rating stars, belong on a Canvas or in a Painter subclass that overrides onDraw().

MENU