Search code examples
androidwear-osandroid-bitmap

WearOS Icon from Bitmap doesn't display color

I have a Compose layout that creates a Bitmap/Canvas and draws two colored rectangles to it. However, when drawn (both on an emulator and an actual device), the rectangles show as white.

Here's the code:

@Composable
fun WearApp() {
    val bitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888)
    val canvas = Canvas(bitmap)

    val red = Paint()
    red.color = Color.rgb(255, 0, 0)
    canvas.drawRect(0f, 0f, 40f, 40f, red)

    val blue = Paint()
    blue.color = Color.BLUE
    canvas.drawRect(60f, 60f, 100f, 100f, blue)

    IconReproTheme {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(24.dp),
            verticalArrangement = Arrangement.Center,
        ) {
            Icon(bitmap = bitmap.asImageBitmap(),
                contentDescription = null)
        }
    }
}

Here's the result: WearOS emulator displaying two white rectangles

Full code can be found here. How do I get colors to work?

Solution

  • Use Image instead of Icon. Icon applies a tint to the shape of the image.

    Roughly related answer What is the difference between an Icon and an Image in Android Jetpack Compose?