如何在Compose中以编程方式设置矢量图标的色调模式和色调颜色

Question

我有一些从SVG转换而来的矢量图标，需要根据一些条件自定义它们的色调颜色，我正在尝试以编程方式更改色调颜色。

Image(
        modifier = Modifier.size(128.dp),
        painter = painterResource(id = R.drawable.icon_1),
        contentDescription = null,
        colorFilter =  ColorFilter.tint(Color.Red)
    )

它给了我以下结果

此外，当我尝试使用时

Image(
    modifier = Modifier.size(128.dp),
    painter = painterResource(id = R.drawable.icon_1),
    contentDescription = null,
    colorFilter =  ColorFilter.tint(Color.Red, blendMode = BlendMode.Multiply)
)

我也得到了同样的结果。但是，当我尝试通过在XML文件中添加来更改图标色调时

android:tint="@color/red"
android:tintMode="multiply"

它能正确地给我所需的结果，如下图所示：

那么我该如何通过编程来实现相同的结果呢？因为我需要根据某些条件以编程方式改变颜色。

- MARK

Answer 1

我通过使用blendMode = BlendMode.Modulate成功修复了它。

    Image(
        modifier = Modifier.size(128.dp),
        painter = painterResource(id = resultType.resId),
        contentDescription = null,
        colorFilter = ColorFilter.tint(color = Color.Red, blendMode = BlendMode.Modulate) }
    )

- MARK

Answer 2

使用Icon代替Image。 Icon函数有一个参数可以更改图标颜色：

Icon(
    modifier = Modifier.size(128.dp),
    painter = painterResource(id = R.drawable.icon_1),
    contentDescription = null,
    tint = Color.Red,
)

- cd1

---

它给了我与图像相同的结果。 - MARK