调整UI图像颜色

Question

我想修改 SwiftUI 中

Image

的颜色。目前，我正在尝试修改

.foregroundColor()

，但它实际上并没有从黑色

修改它

                        Image(uiImage: resizeImage(UIImage(systemName: isLiked ? "heart.fill" : "heart")!, 
                            targetSize: CGSize(width: 75, height: 27))!)
                            .foregroundColor(isLiked ? .yellow : .gray)

如你所见，颜色仍然是黑色：

理想情况下，我想将其修改为具有此

.foregroundColor

，即其轮廓的颜色，并且当按下“like”按钮（心形）时，它会填充相同的颜色：

foregroundColor(colorPalettes[safe: sharedVars.colorPaletteIndex]?[2] ?? .white)

这是当前应用于点赞按钮旁边的点赞计数的颜色（心形图像）：

Answer 1

感谢 @aheze 和 @LawrenceGimenez 在我的问题下提出的评论，建议进行这些更改：

                            Image(systemName: isLiked ? "heart.fill" : "heart")
                                .font(.title)
                                .scaleEffect(1)
                                .foregroundStyle(colorPalettes[safe: sharedVars.colorPaletteIndex]?[2] ?? .white)

使用基本

Image

对象并调整其

.foregroundStyle

按照我的问题中的预期工作，以使颜色与我的变量相匹配：

Answer 2

根据我的观察，不需要

font

或

scaleEffect

修饰符来修改图像的颜色。

以下代码执行您在没有 UIKit、自定义函数和强制展开的纯 SwiftUI 中编写的操作：

struct LikeView: View {
    @State private var isLiked = false
    
    var body: some View {
        Image(systemName: isLiked ? "heart.fill" : "heart")
            .resizable()
            .scaledToFit()
            .frame(width: 75, height: 27)
            .foregroundStyle(isLiked ? .yellow : .primary) // <- use primary system color instead of `white`
        
            .onTapGesture {
                isLiked.toggle()
            }
    }
}

注意：添加

onTapGesture

是为了易于重现。

正如评论中所建议的，您还可以跳过硬编码调整大小，并使图像适应任何父视图的

font

大小调整：

someView {
    Image(systemName: isLiked ? "heart.fill" : "heart")
        .foregroundStyle(isLiked ? .yellow : .primary)
}
.font(.title)