How to hide Button on Click in SwiftUI-CodePudding

i want to hide one button after it's clicked and show the other and vice versa.

By default the lock button should be the one that displays first. After clicking on it, only the second unlock button should show in the same position.

                  Button { //lock button
                    app.statusBar?.stop()
                   
                } label: {
                    Image(systemName: "lock")
                }
                                  
                    Button { //unlock button
                        app.statusBar?.start()
                       
                    } label: {
                        Image(systemName: "lock.open")
                    }
                }

This is for a macOS app.

CodePudding user response：

Why not simply one button?

@State private var isLocked = false

...
    
    Button { //lock button
        isLocked.toggle()
        if isLocked {
            app.statusBar?.stop()
        } else {
            app.statusBar?.start()
        }
    } label: {
        Image(systemName: isLocked ? "lock" :  "lock.open")
    }

If you really want two buttons you can hide one with the opacity modifier

Button {

  ... 

}
.opacity(isLocked ? 1.0 : 0.0)

CodePudding user response：

You need to set a condition through an @State variable. When the variable toggles between true to false, the proper Button will be shown accordingly.

Here is an example:

struct Example: View {
    @State private var free = true

    var body: some View {

            if free {

                Button { //lock button
                    app.statusBar?.stop()
                    free = false                   
                } label: {
                    Image(systemName: "lock")
                }

            } else {
                                  
                 Button { //unlock button
                        app.statusBar?.start()
                        free = true
                 } label: {
                        Image(systemName: "lock.open")
                 }
            }

    }
}