Question

我目前正在开发一个用于创建购物清单的应用。

该视图由HStack列表组成，该列表又由复选框和文本字段组成。到目前为止，该按钮仅选中/取消选中该复选框。

但是，我还希望按钮更改以下文本字段的透明度。

这是列表中每个元素的当前代码：


    struct Vare: View {
    
    @State var vare: String = ""
    @State var checked = false
    
    var body: some View {
        HStack {
            ZStack {
                Button(action: {
                    self.checked.toggle()
                }) {
                    Image("UnCheckbox")
                    .resizable()
                    .frame(width: 20, height: 20)
                    .padding(.leading)
                }
                
                if checked {
                    Image("Checkbox")
                    .resizable()
                    .frame(width: 20, height: 20)
                    .padding(.leading)
                    
                }
            }
           TextField("Neste vare...", text: $vare)
               .frame(maxWidth: .infinity)
        }
    }
}

Answer 1

我也希望按钮更改以下内容的透明度文本字段。

您可以像这样使用opacity修饰符：


    struct Vare: View {
    
    @State var vare: String = ""
    @State var checked = false
    
    var body: some View {
        HStack {
            ZStack {
                Button(action: {
                    self.checked.toggle()
                }) {
                    Image("UnCheckbox")
                    .resizable()
                    .frame(width: 20, height: 20)
                    .padding(.leading)
                }
                
                if checked {
                    Image("Checkbox")
                    .resizable()
                    .frame(width: 20, height: 20)
                    .padding(.leading)
                    
                }
            }
           TextField("Neste vare...", text: $vare)
               .frame(maxWidth: .infinity)
               .opacity(self.checked ? 1:0) // here
        }
    }
}

如果我建议的话，可以使用相同的逻辑将代码缩短很多。像这样：

@State var vare: String = ""
@State var checked = false

var body: some View {
    HStack {
        
        Button(action: {
            self.checked.toggle()
        }) {
            Image(self.checked ? "Checkbox":"UnCheckbox")
            .resizable()
            .frame(width: 20, height: 20)
            .padding(.leading)
        }
        
       TextField("Neste vare...", text: $vare)
           .frame(maxWidth: .infinity)
           .opacity(self.checked ? 1:0) // here
    }
}

如何在SwiftUI中使用按钮更改TextField的颜色？

1 个答案: