Jetpack Compose 中的動態圖標值選擇器

Question

有沒有辦法在 Jetpack Compose 中動態設置圖標值？

示例，而不是：

Icon(Icons.Filled.Print, "print")

我想做：

Icon(Icons.Filled.(iconValue), iconValueName)

Answer 1

您可以使用 Java 反射。 我依賴於每個材質圖標都放在一個單獨的文件中，並且它們都在androidx.compose.material.icons.filled package 下聲明。

@Composable
fun IconByName(name: String) {
    val icon: ImageVector? = remember(name) {
        try {
            val cl = Class.forName("androidx.compose.material.icons.filled.${name}Kt")
            val method = cl.declaredMethods.first()
            method.invoke(null, Icons.Filled) as ImageVector
        } catch (_: Throwable) {
            null
        }
    }
    if (icon != null) {
        Icon(icon, "$name icon")
    }
}

您可以查看此答案以獲取更多詳細信息，了解如何將 Kotlin 擴展編譯為 Java 代碼。

我還將使用幾個圖標為此邏輯編寫一個測試，以防 Compose 在將來的版本中更改某些內容 - package 名稱或將多個圖標一起移動到同一個文件中，盡管這不太可能。

Answer 2

您可以在您的可組合物中使用以下可重復使用的可組合物。

@Composable
fun CustomIcon(
    imageVector: ImageVector,
    contentDescription: String?
) {
    Icon(
        imageVector = imageVector,
        contentDescription = contentDescription
    )
}

然后，您可以使用 when 語句和 select 適當的圖像矢量。

when(imageStringFromWeb) {
    is "email" -> {
        CustomIcon(Icons.Filled.Email, null)
    }
    ...
}