'SwiftUI: first Button not tappable inside HStack

Going thru a very weird issue that looks like a bug to me.

Here's the code -

    HStack {
        
        Button(action: {
            print("DEBUG: follow pressed!")
        }, label: {
            Text("Follow")
                .frame(width: 180, height: 40)
                .background(Color.blue)
                .foregroundColor(.white)
        })
            .cornerRadius(20)
        
      
        Button(action: {
            print("DEBUG: message pressed!")
        }, label: {
            Text("Message")
                .frame(width: 180, height: 40)
                .background(Color.purple)
                .foregroundColor(.white)
        })
            .cornerRadius(20)
        
    }

Code for entire view (might be useful) -

import SwiftUI

struct ProfileActionButtonView: View {
    let viewModel: ProfileViewModel
    @Binding var isFollowed: Bool
    
    var body: some View {
        if viewModel.user.isCurrentUser {
            
        Button(action: {}, label: {
            Text("Edit Profile")
                .frame(width: 360, height: 40)
                .background(Color.blue)
                .foregroundColor(.white)
        })
            .cornerRadius(20)
        } else {
            HStack {
                
                Button(action: {
                    print("DEBUG: follow pressed!")
                }, label: {
                    Text("Follow")
                        .frame(width: 180, height: 40)
                        .background(Color.blue)
                        .foregroundColor(.white)
                })
                    .cornerRadius(20)
                
              
                Button(action: {
                    print("DEBUG: message pressed!")
                }, label: {
                    Text("Message")
                        .frame(width: 180, height: 40)
                        .background(Color.purple)
                        .foregroundColor(.white)
                })
                    .cornerRadius(20)
                
            }
        }
        
    }
}

What's weird?

If I switch the positions of both buttons in HStack, the first button (whichever is first) is always untappable. The second works just fine!

EDIT (adding image's code). Looks like the image (circular image of first tweet below the button) is overshadowing the follow button.

Image("batman")
                    .frame(width:  56, height: 56)
                    .scaledToFit()
                    .cornerRadius(56/2)
                    .padding(.leading)

Screenshot

In the image - Follow button is untappable, Message button is tappable.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source