在 Jetpack Compose 中动态更改图标

【问题标题】：Change icon dynamically in Jetpack Compose在 Jetpack Compose 中动态更改图标
【发布时间】：2021-10-11 20:46:09
【问题描述】：

我有两个“赞”按钮图标 - ic_thumb_up 和 ic_thumb_up_selected

图标的类型应该取决于offer.likedByUser 参数。

var thumbIcon by remember {
    mutableStateOf(if (offer.likedByUser) R.drawable.ic_thumb_up_selected else R.drawable.ic_thumb_up)
}

IconButton(
    onClick = {
        offer.likedByUser = !offer.likedByUser
    } 
) {
    Image(painter = painterResource(id = thumbIcon) )
}

为什么它不起作用？

【问题讨论】：

标签： android kotlin android-jetpack-compose

【解决方案1】：

这段代码

var thumbIcon by remember {
   mutableStateOf(if (offer.likedByUser) R.drawable.ic_thumb_up_selected else R.drawable.ic_thumb_up)
}

只运行一次，并将值设置为thumbs_up_selected 或thumbs_up。您没有更改 onClick 处理程序中的 mutableStateOf，因此没有任何反应。

你需要像这样改变它

var thumbIconLiked by remember {
   mutableStateOf(offer.likedByUser)
}

IconButton(
    onClick = {
        thumbIconLiked = !thumbIconLiked
    } 
) {
    Image(
        painter = painterResource(
            id = if (thumbIconLIked) { 
                R.drawable.ic_thumb_up_selected 
            } else { 
                R.drawable.ic_thumb_up 
            }
        )
    )
}

【讨论】：

感谢您的解释。效果很好