SwiftUI: alert messages
A common way to give feedback to users, but also to help you debug your applications sometimes, is to use alerts.
SwiftUI provides the .alert()
modifier that we can use to show an alert based on some condition.
Letโs start from this example where we have a Button
with a counter:
import SwiftUI
struct ContentView: View {
@State var count = 0
var body: some View {
Button("Count: \(count)") {
self.count += 1
}
.font(.title)
}
}
when count
reaches 10 I want to show an alert message.
How do we do that?
I can add a showAlert
boolean property to the ContentView
and edit the content of the Button
tap action:
struct ContentView: View {
@State var count = 0
@State var showAlert = false
var body: some View {
Button("Count: \(count)") {
self.count += 1
if self.count == 10 {
showAlert = true
self.count = 0
}
}
.font(.title)
}
}
When we reach 10, we set showAlert
to true
and we set the count to 0.
Then I add the .alert()
modifier to the Button
view:
.alert(isPresented: $showAlert) {
Alert(title: Text("Great!"), message: Text("You reached 10"))
}
This alert is shown only when the showAlert
property is true. When we dismiss the alert, the showAlert
property is automatically set to false
.
Hereโs the full code:
struct ContentView: View {
@State var count = 0
@State var showAlert = false
var body: some View {
Button("Count: \(count)") {
self.count += 1
if self.count == 10 {
showAlert = true
self.count = 0
}
}
.font(.title)
.alert(isPresented: $showAlert) {
Alert(title: Text("Great!"), message: Text("You reached 10"))
}
}
}
Try running the app. The counter starts at 0. Click the button and the counter will increase:
Until you reach 10:
Then the counter will start again from 0:
THE VALLEY OF CODE
THE WEB DEVELOPER's MANUAL
You might be interested in those things I do:
- Learn to code in THE VALLEY OF CODE, your your web development manual
- Find a ton of Web Development projects to learn modern tech stacks in practice in THE VALLEY OF CODE PRO
- I wrote 16 books for beginner software developers, DOWNLOAD THEM NOW
- Every year I organize a hands-on cohort course coding BOOTCAMP to teach you how to build a complex, modern Web Application in practice (next edition February-March-April-May 2024)
- Learn how to start a solopreneur business on the Internet with SOLO LAB (next edition in 2024)
- Find me on X