swiftui 文本字段和按钮内的按钮

Posted

技术标签:

【中文标题】swiftui 文本字段和按钮内的按钮【英文标题】:swiftui textfiled and button inside a button 【发布时间】:2020-01-19 05:16:53 【问题描述】:

当用户单击视图的背景区域时,我试图触发按钮。 作为一种解决方案,我决定制作一个按钮并将视图作为标签放入按钮中。 但问题是按钮即使在 TextField 上也会触发,有时也会在内部的另一个按钮上触发。

如何禁用我选择的某些视图(在这种情况下为 TextField 和 Button)上的后退按钮?

我在下面附上我的代码和rendered preview。

import SwiftUI

struct ButtonOnbutton: View 
    @State var memo: String = ""
    var body: some View 
        Button(action: 
            print("down button clicked")
        ) 
            VStack(spacing: 10) 
                Text("before")
                    .foregroundColor(.white)
                TextField("type memo", text: $memo)
                    .font(.custom("SFProDisplay-Regular", size: 12))
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                Text("after")
                    .foregroundColor(.white)
                Button(action: 
                    print("inside button clicked")
                ) 
                    Text("inside button")
                        .foregroundColor(.white)
                
                .background(Color.red)
            
        
        .background(Color.blue)
    .padding()
    


struct buttonOnbutton_Previews: PreviewProvider 
    static var previews: some View 
        ButtonOnbutton()
    

【问题讨论】:

【参考方案1】:

如果我正确理解您的目标,那么最好使用onTapGesture 而不是按钮,如下所示

var body: some View 
    VStack(spacing: 10) 
        Text("before")
            .foregroundColor(.white)
        TextField("type memo", text: $memo)
            .font(.custom("SFProDisplay-Regular", size: 12))
            .textFieldStyle(RoundedBorderTextFieldStyle())
            .onTapGesture  // << just blocks outer tap
        Text("after")
            .foregroundColor(.white)
        Button(action: 
            print("inside button clicked")
        ) 
            Text("inside button")
                .foregroundColor(.white)
        
        .background(Color.red)
    
    .background(Color.blue)
    .onTapGesture 
        print("background area clicked")
    
    .padding()

【讨论】:

我想不出在 textField 上添加 tapGesture 的想法。我解决了这个问题。谢谢!

以上是关于swiftui 文本字段和按钮内的按钮的主要内容,如果未能解决你的问题,请参考以下文章

当嵌入到 SwiftUI 中的 ScrollView 中时,VStack 内的内容会缩小

SwiftUI - 在按钮单击时添加一行多个文本字段/视图

清除按钮按下swiftui时如何自动上一个文本字段

SwiftUI:仅当输入不为空时才启用保存按钮

SwiftUI - 检测文本字段中的变化

从按钮操作中更改时未触发 SwiftUI 绑定