Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

All buttons are pressed even only one button is pressed in HStack SwiftUI

I want to build a top bar that consist of 3 icon buttons but when I press one button, the other buttons are also pressed. Maybe because of the systemName SF Symbols? I don’t know if I miss something. Help a newbie here

import SwiftUI

struct ContentView: View {
    var body: some View {
        ZStack {
            Color.black
                .ignoresSafeArea()
            VStack {
                HStack(alignment: .top, spacing: 0) {
                    
                        Button(action: {
                        }){
                            Image(systemName: "house.fill").tint(.white)
                        Spacer()
                            
                        Button(action: {}){
                            Image(systemName: "cart.fill").tint(.white)
                        }
                            
                        Button(action: {}){
                            Image(systemName: "magnifyingglass").tint(.white)
                        }
                    }
                }.font(.system(size: 23))
                
                    HStack{
                            Text("New Released")
                                .foregroundColor(.white)
                                .font(.title2)
                                .bold()
                                .padding(EdgeInsets(top: 16, leading: 0, bottom: 0, trailing: 0))
                            Spacer()
                    }
                Spacer()
            }
            .padding()
        }
    }
}

THE PREVIEW
Not press anything

When pressing

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

Is this a SwiftUI bug or am I missing something here?

I tried to add .buttonStyle(BorderlessButtonStyle()) but not worked.

>Solution :

please check your first button code, you mistakenly wrapped other 2 buttons inside it that’s way they all are effecting each other. Here is the correct code

    struct ContentView: View {
    var body: some View {
        ZStack {
            Color.black
                .ignoresSafeArea()
            VStack {
                HStack(alignment: .top, spacing: 0) {
                    
                        Button(action: {
                            print("Button1")
                        }){
                            Image(systemName: "house.fill").tint(.white)
                        } // this was placed wrongly  
                        Spacer()
                            
                        Button(action: {
                            print("Button2")
                        }){
                            Image(systemName: "cart.fill").tint(.white)
                        }
                            
                        Button(action: {
                            print("Button3")
                        }){
                            Image(systemName: "magnifyingglass").tint(.white)
                        }
                    
                }
                .font(.system(size: 23))
                
                    HStack{
                            Text("New Released")
                                .foregroundColor(.white)
                                .font(.title2)
                                .bold()
                                .padding(EdgeInsets(top: 16, leading: 0, bottom: 0, trailing: 0))
                            Spacer()
                    }
                Spacer()
            }
            .padding()
        }
    }
}

  
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading