Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Swiftui button press does not always work

Tags:

swiftui

When I press the button "Get New Connection Pin" it does not always print to console. Let's like I have to press the button a few times before it will print to console or for me to see the button visibly being pressed.

swiftui:

import SwiftUI

struct JokeView: View {
    @State private var jokeString = "No Joke Available"
    @State private var fetching = false
    
    var body: some View {
        VStack(spacing: 20) {
            VStack(alignment: .leading, spacing: 10) {
                Text("Connection Pin:")
                    .font(.headline)
                    .foregroundColor(.gray)
                
                Button(action: {
                    print("Copy Connection Pin to clipboard")
                }) {
                    Text("3kus-32dak")
                        .fontWeight(.semibold)
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
                .cornerRadius(8)
            }
            .frame(maxWidth: .infinity, alignment: .leading)
            .padding()
            .background(Color.gray.opacity(0.2))
            .cornerRadius(8)
            
            Button(action: {
                print("Requesting a new connection pin")
            }) {
                Text("Get New Connection Pin")
            }
            .frame(maxWidth: .infinity, minHeight: 40)
            .buttonStyle(PlainButtonStyle())
            .background(Color.blue)
            .cornerRadius(4)
            .contentShape(Rectangle()) // Make the entire button tappable
            
        }
        .padding()
        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .topLeading)
    }
}

struct JokeView_Previews: PreviewProvider {
    static var previews: some View {
        JokeView()
            .frame(width: 225, height: 225)
            .background(Color.white.opacity(0.1))
    }
}

like image 469
Pastor J.G Seigle Avatar asked Oct 19 '25 06:10

Pastor J.G Seigle


1 Answers

Running your code, seems that .contentShape(Rectangle()) // Make the entire button tappable is not actually accomplishing what you want it to accomplish and the text is still the only tappable portion of the button.

Fix is to apply your sizing transformations on the Text inside the Button Label instead of to the button.

For example (you could do it in a few ways):

Button(action: {
    print("Requesting a new connection pin")
}) {
    Text("Get New Connection Pin")
        .frame(maxWidth: .infinity, minHeight: 40)
        .background(Color.blue)
        .cornerRadius(4)
        .contentShape(Rectangle()) // Make the entire button tappable
}
.buttonStyle(PlainButtonStyle())

More in here: SwiftUI Button tap only on text portion

This blog post has a pretty good explanation too.

However, the following would be much simpler to accomplish more or less the same thing, plus you let the OS choose the sizes / colours somewhat (though it's only available in iOS 15+):

Button("Get New Connection Pin", action: {
    print("Requesting a new connection pin")
})
.tint(.blue)
.controlSize(.large)
.buttonStyle(.borderedProminent)
like image 73
shim Avatar answered Oct 22 '25 03:10

shim



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!