@State private var showAlert = false
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Not OK") {} }
showAlert.toggle()
struct DevTechieAlertsExample: View { @State private var showAlert = false var body: some View { NavigationView { VStack { Text("Learn iOS with DevTechie") .font(.largeTitle) .foregroundColor(.white) .padding() .background(.orange, in: RoundedRectangle(cornerRadius: 20)) Button { showAlert.toggle() } label: { Text("Show alert") } .alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Not OK") {} } } } } }
alert("This is an alert", isPresented: $showAlert) {}
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Not OK") {} Button("Hmm OK") {} Button("Well OOOK") {} Button("But wait") {} Button("Can I say something?") {} Button("Why close") {} Button("Only if you want to close") {} Button("Think again") {} Button("OK close") {} }
.alert("This is an alert", isPresented: $showAlert) { Group { Button("OK") {} Button("Not OK") {} Button("Hmm OK") {} Button("Well OOOK") {} Button("But wait") {} Button("Can I say something?") {} Button("Why close") {} Button("Only if you want to close") {} Button("Think again") {} Button("OK close") {} } Group { Button("OK") {} Button("Not OK") {} Button("Hmm OK") {} Button("Well OOOK") {} Button("But wait") {} Button("Can I say something?") {} Button("Why close") {} Button("Only if you want to close") {} Button("Think again") {} Button("OK close") {} } }
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Cancel") {} }
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Cancel", role: .cancel) {} }
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Hmm OK", role: .destructive) {} }
.alert("This is an alert", isPresented: $showAlert) { Button("OK") {} Button("Hmm OK", role: .cancel) {} } message: { Text("Message: learn iOS with DevTechie") }
Note: formatting modifiers don’t work with message parameter. Following will not work.
message: { Text("Message: learn iOS with DevTechie") .font(.largeTitle) }
Note: alert with two buttons and if one of the button has cancel role, then the button with cancel will go to the leading side. It can be better understood with an example:
.alert("This is an alert", isPresented: $showAlert) { Button("Button 1") {} Button("Button 2", role: .cancel) {} }
struct DevTechieAlertsExample: View { @State private var showAlert = false @State private var details = "Visit DevTechie.com" var body: some View { NavigationView { VStack { Text("Learn iOS with DevTechie") .font(.largeTitle) .foregroundColor(.white) .padding() .background(.orange, in: RoundedRectangle(cornerRadius: 20)) Button { showAlert.toggle() } label: { Text("Show alert") } .alert("This is an alert", isPresented: $showAlert, presenting: details) { someDetails in Button(someDetails) {} Button("Cancel", role: .cancel) {} } message: { someDetails in Text("Message: \(someDetails)") } } } } }
Examples we have seen uses button to toggle the State parameter but alert can be launched by any view as long as the State parameter attached to isPresenting changes its state.
With that we have reached the end of this article. Thank you once again for reading. Don’t forget to follow 😍. Also subscribe our newsletter at https://www.devtechie.com