28

In SwiftUI I discovered the Alert type. But I wonder how to show it with the presentation method.

Initializing an Alert is pretty easy. But how to use the binding?

struct ContentView : View {
    var body: some View {
        Button(action: {
            // Don't know how to use the `binding` below
            presentation(binding, alert: {
                Alert(title: Text("Hello"))
            })
        }, label: {
            Text("asdf")
        })
    }
}

The binding is of type Binding<Bool>

10 Answers 10

32

.presentation() was actually deprecated in Beta 4. Here is a version that currently works with the .alert() Modifier.

struct ContentView: View {
    @State var showsAlert = false
    var body: some View {
        Button(action: {
            self.showsAlert.toggle()
        }) {
            Text("Show Alert")
        }
        .alert(isPresented: self.$showsAlert) {
            Alert(title: Text("Hello"))
        }
    }
}
3
  • 2
    How can we use it in a Helper? As we have to call Alert many times.
    – Rob
    Oct 1, 2019 at 6:34
  • I would like to know as well. I would love to have a helper: "showAlert" which expects a title and a text. And for example shows a generic alert if no parameters are provided. I tried to implement this as an extension for view struct but no chance to get it working :/. Nov 12, 2019 at 12:34
  • You can make a simple extension like this @Schnodderbalken Oct 26, 2020 at 7:50
15

You can use a @State variable as the binding. Alternatively you can use a @EnvironmentObject variable that uses a BindableObject.

I think you need to call presentation on the root View to get it to work, adding it to a Stack, Group, etc. doesn't seem to work.

This snippet seems to do the trick. Note that @State variable is set to false after the alert is dismissed.

struct ContentView: View {

    @State var showsAlert = false

    var body: some View {
        Button(action: {
            self.showsAlert = true
        }, label: {
            Text("asdf")
        }).presentation($showsAlert, alert: {
            Alert(title: Text("Hello"))
        })
    }
}
3
  • 1
    Or you could use a PresentationButton, that does what you do in less code
    – Fab1n
    Jun 6, 2019 at 16:25
  • 6
    Unfortunately this answer is no longer correct because .presentation has been deprecated in SwiftUI. Aug 31, 2019 at 22:05
  • How would this be modified to handle Alerts with handlers!? Swift had the ability to have handlers.
    – Learn2Code
    Jun 21, 2020 at 14:11
14

Full Code of Alert with dismiss and okay action:

Code:

import SwiftUI

struct ContentView: View {
    @State private var isAlert = false

    var body: some View {
            Button(action: {
                self.isAlert = true
            }) {
                Text("Click Alert")
                .foregroundColor(Color.white)
            }
            .padding()
            .background(Color.blue)
            .alert(isPresented: $isAlert) { () -> Alert in
                Alert(title: Text("iOSDevCenters"), message: Text("This Tutorial for SwiftUI Alert."), primaryButton: .default(Text("Okay"), action: {
                    print("Okay Click")
                }), secondaryButton: .default(Text("Dismiss")))
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Output:

Output

10

Here's the solution for presenting multiple alerts. Works on iOS13-iOS15:

struct YourView: View {
    enum AlertType: Identifiable {
        case first, second
        
        var id: Int {
            hashValue
        }
    }
    
    @State var alertType: AlertType?
    
    var body: some View {
        VStack {
            Button("Show alert #1") {
                alertType = .first
            }
            
            Button("Show alert #2") {
                alertType = .second
            }
        }
        .alert(item: $alertType) { type in
            switch type {
            case .first:
                return Alert(title: Text("First alert"))
            case .second:
                return Alert(title: Text("Second alert"))
            }
        }
    }
}
6

In addition to @tsp's answer, to display an alert with two buttons and handle button tap action, you can do as below:

@State var showAlert = false

var body: some View {
  Button(action: {
    self.showAlert = true
  }) {
    Text("Show Alert")
  }
  .presentation($showAlert) {
      Alert(title: Text("Title"), message: Text("Message..."),
          primaryButton: .default (Text("OK")) {
            print("OK button tapped")
          },
          secondaryButton: .cancel()
      )
  }
}

Result:

enter image description here

4

SwiftUI present Alert

Example with onTapGesture

struct MyRow: View {
    @State private var showingAlert = false
    
    var body: some View {
        HStack {
            Text("Hello")
            Text("World")
        }
        .onTapGesture {
            self.showingAlert = true
        }
        .alert(isPresented: $showingAlert, content: {
            Alert(title: Text("Title"), message: Text("Message"), dismissButton: .default(Text("OK")))
        })
    }
}
1
  • I have been unable to get alerts to work from draggesture in swiftui. Anu idea how to do it in this case? Thanks! .overlay(Rectangle() .gesture( DragGesture(minimumDistance: 50) .onEnded { gesture in if correct gesture... { .alert(isPresented: $showAlert, content: { Alert()... this alert does not compile
    – Tim
    Jun 5, 2020 at 20:13
2

In addition to @thisIsTheFoxe 's answer, you can implement a simple extension:

Extension

public extension View {
    func alert(isPresented: Binding<Bool>,
               title: String,
               message: String? = nil,
               dismissButton: Alert.Button? = nil) -> some View {

        alert(isPresented: isPresented) {
            Alert(title: Text(title),
                  message: {
                    if let message = message { return Text(message) }
                    else { return nil } }(),
                  dismissButton: dismissButton)
        }
    }
}

Usage:

So you can now use it easily like:

struct ContentView: View {
    @State var showsAlert = false
    var body: some View {
        Button("Show Alert") {
            self.showsAlert.toggle()
        }
        .alert(isPresented: $showsAlert, title: "title", message: "Message") // <- Here
    }
}
1
struct ContentView: View {

    @State var aAlert = false

    var body: some View {
        Text("Alert").tapAction {
            self.aAlert = true
        }.presentation($aAlert, alert:{ Alert(title: Text("Alert"))})
    }
}
1
  • 1
    Can you elaborate on your answer a little bit? For example, explanations about interesting parts of your code snippet, or links to the documentation? Jun 10, 2019 at 16:01
1

SwiftUI

First create basic alert :

Alert(title: Text("Alert title"), message: Text("Alert message"), dismissButton: .default(Text("Got it!")))

Then define a bindable condition that tells when the alert will be visible or not. Toggle that condition to show/hide the alert.

struct ContentView: View {
    @State private var showingAlert = false

    var body: some View {
        Button(action: {
            self.showingAlert = true
        }) {
            Text("Show Alert")
        }
        .alert(isPresented: $showingAlert) {
            Alert(title: Text("Important message"), message: Text("Wear sunscreen"), dismissButton: .default(Text("Got it!")))
        }
    }
}
-1
public extension View {
    func alert(isPresented: Binding<Bool>,
               title: String,
               message: String? = nil,
               dismissButton: Alert.Button? = nil) -> some View {

        alert(isPresented: isPresented) {
            Alert(title: Text(title),
                  message: {
                    if let message = message { return Text(message) }
                    else { return nil } }(),
                  dismissButton: dismissButton)
        }
    }
}
1
  • 2
    How is this answer different from @MojtabaHosseini's answer?
    – Ranoiaetep
    Nov 26, 2022 at 20:01

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.