How to display Alerts with different messages in SwiftUI in a simple and elegant way ?

While building a SwiftUI application, I had to find a way to display an Alert with custom messages depending on errors returned by my API reponse. It turns out this is not trivial as we can only have a single .alert() container in our ContentView. Here is a nice elegant way to achieve this.

If we look at the documentation, we observe that there are two ways to initialise an alert view :

  • the first and most used using the 'isPresented' binding
.alert(isPresented: Binding<Bool>, content: () -> Alert)
  • the second using the 'item' binding
.alert(item: Binding<Identifiable?>, content: (Identifiable) -> Alert)

Using the second way, we can create and display different alerts depending on a state variable of type Identifiable.

First, we have to create a struct of type Identifiable that will hold our different Alerts choices :

struct AlertID: Identifiable {
var id: AlertType
enum AlertType {
case .error1
case .error2
case .error3
}
}

We also create an optional state variable that will enable to trigger and show the required Alert.

@State private var alertId: AlertID?

Then, we create a builder method to build the Alert depending on our state variable.

private func alertBuilder(alertId: AlertID) -> Alert {
switch alertId.id {
case .error1:
return Alert(title: Text(“Error 1”))
case .error2:
return Alert(title: Text(“Error 2))
case .error3 :
return Alert(title: Text(“Error 3”))
}
}

Finally, we update our alert view holder to call the builder method and build the Alert depending on our alertID variable :

.alert(item: $alertId) {(alertId) -> Alert in
return
createAlert(alertId: alertId)
}

And voilà ! We just have to change the state variable alertID with the value we want as following :

self.parent.alertId = AlertID(id: .otherError)

This will in turn trigger a refresh of the View, call the builder method and display our Alert to the user. We can even bind this state variable to another view in order to trigger the alert from it. This was very helpful to me to handle errors returned by my API and display them to the user.

--

--

--

🇨🇭Cybersecurity student. DJ & Musician. Interested about too much things. Improving every minute.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Why You Should Adopt Swift Async/Await Right Now

iOS 14 Widget Extension: Box Office Collection

Multiple Complications in watchOS 7

Miniature figurines alongside Apple products

Variable Definition, Arrays, Dictionaries and Set Structures in Swift

Firebase ML Kit: Building A Facial Gesture Detecting App In iOS (Part Three)

How to create a compositional layout using collection view in swift

How to UseVisualTransformation to Create Phone Number TextField and others in Jetpack Compose

Top 5 Xcode(Swift) shortcuts for more effective work

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Valentin Quelquejay

Valentin Quelquejay

🇨🇭Cybersecurity student. DJ & Musician. Interested about too much things. Improving every minute.

More from Medium

SwiftUI Tutorial: Working with Stepper

Adding SwiftUI view to UIKit project and interacting with it

Moving your first steps with Siri

Image of Siri’s icon

SwiftUI Tutorial — How to use a ProgressView with URLSession