点击状态变量为字符串更改按钮的图像？

Question

我们可以在按钮的帮助下使用状态变量作为布尔值来更改图像。但是我们如何使用字符串变量来实现呢？

例如：

如果状态变量是布尔值：-

Image（系统名称：self.typeClicked？“heart.fill”：“heart.fill”）

如果状态变量是字符串，“self.typeClicked ?”heart.fill“：”heart.fill“”会出现什么？

当 typeClicked = "success" 图像应该改变，如果它不是 "success" 图像应该保持它以前的状态。

到目前为止我尝试了什么：

State variables:

    @State private var type: String = "success"
    
    @State private var typeClicked: Bool =  false
    
    @StateObject var viewModel = addWishlist()

MyView :

  VStack{
            HStack {
                Image("resort1")
                Spacer()
                Button {
                    if viewModel.responses?.type == "success" {
                        typeClicked.toggle()
                    } else {
                        typeClicked = false
                    }
                } label: {
                    Image(systemName: self.typeClicked ? "heart.fill" : "heart.fill")
                        .font(.system(size: 25))
                        .foregroundColor(self.typeClicked ? .red : Color.init(uiColor: .systemGray3))
                }
            }
            .padding()
        }

Answer 1

尝试这种方法，当你想要

typeClicked

一个字符串：

 @State private var type: String = "success"
 @State private var typeClicked = "fail"  // <-- here
 @StateObject var viewModel = addWishlist()
 
  //.....
 
     VStack{
         HStack {
             Image("resort1")
             Spacer()
             Button {
                 if viewModel.responses?.type == "success" {
                     // toggle equivalent
                     typeClicked = typeClicked == "success" ? "fail" : "success"  // <-- here
                 } else {
                     typeClicked = "fail"   // <-- here
                 }
             } label: {
                 Image(systemName: typeClicked == "success" ? "heart.fill" : "heart")  // <-- here
                     .font(.system(size: 25))
                     .foregroundColor(typeClicked == "success" ? .red : Color.init(uiColor: .systemGray3))  // <-- here
             }
         }
         .padding()
     }

注意，你也可以只使用

Image(systemName: "heart.fill")

和填充颜色，

.foregroundColor(typeClicked == "success" ? .red : Color.init(uiColor: .systemGray3))

编辑-1：

这是我用来测试我的答案的完整工作代码。当您点击/点击

heart

按钮，它会根据

typeClicked

字符串值改变颜色。

struct ContentView: View {
    @State private var type: String = "success"
    @State private var typeClicked = "fail"  // <-- here
  // @StateObject var viewModel = addWishlist()  // commented for testing
    
    var body: some View {
        VStack{
            HStack {
                Image("resort1")
                Spacer()
                Button {
                    // simulated toggle, like you had it with the Bool
                    typeClicked = typeClicked == "success" ? "fail" : "success"
                    // commented for testing
//                    if viewModel.responses?.type == "success" {
//                        typeClicked = typeClicked == "success" ? "fail" : "success"
//                    } else {
//                        typeClicked = "fail"
//                    }
                } label: {
                    Image(systemName: "heart.fill")
                        .font(.system(size: 25))
                        .foregroundColor(typeClicked == "success" ? .red : Color.init(uiColor: .systemGray3))
                }
            }
            .padding()
        }
    }
}