Alerts are used to display messages with important information about the application, such as error or warning messages. This tutorial will dive into the use of UIAlertView to create alerts and how to respond to user interaction using UIAlertViewDelegate.
Step 1: Creating the Project
Go to Xcode and create a new Single View Application project.
Name the project AlertView, and make sure that Use Storyboard and Use Automatic Reference Counting are checked. Then, click Next and choose where to store the project.
Step 2: Setting Up the UI
In ViewController.h, you will need to add an IBAction method to be notified when the user presses the button that will make the alert appear.
- (IBAction)showAlert:(id)sender;
Now, in the storyboard, drag a Round Rect Button to the view. Control-drag from the button to View Controller and select showAlert: when prompted.
Step 3: Show a Simple Alert
In order to display an alert in iOS, you need to create a UIAlertView and then send a show message to it. When you create an alert, you need to specify its title, the message to be displayed, its delegate, the text shown in the button to dismiss the alert, and the text shown in other buttons in case you want more than one.
- (IBAction)showAlert:(id)sender
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"This is a UIAlertView."
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert show];
}
Step 4: Adding Buttons
You can add more buttons to your alert in two different ways. One of them is to add them when initializing the alert in the following way:
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"This is a UIAlertView."
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:@"1",@"2",@"3",nil];
The other way would be to add them after initializing the alert:
UIAlertView *alert = [[[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"This is a UIAlertView."
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert addButtonWithTitle:@"1"];
[alert addButtonWithTitle:@"2"];
[alert addButtonWithTitle:@"3"];
Step 5: Responding to User Interaction
If you want your app to do something when the user presses one of the buttons in your alert, you need to implement the UIAlertViewDelegate protocol. Change your ViewController.h to this:
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
- (IBAction)showAlert:(id)sender;
@end
Now, you need to set the delegate of the UIAlertView we created previously to self.
- (IBAction)showAlert:(id)sender
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"This is a UIAlertView."
delegate:self
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert addButtonWithTitle:@"1"];
[alert addButtonWithTitle:@"2"];
[alert addButtonWithTitle:@"3"];
[alert show];
}
Finally, we will use one of the methods that UIAlertViewDelegate provides to know when the user presses a button, and which of them is pressed. Once the user presses one of the three buttons that are not used to dismiss the alert, we will present a new alert. To do this, add the following code to ViewController.m:
- (void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex
{
NSString *title = [alertView buttonTitleAtIndex:buttonIndex];
if([title isEqualToString:@"1"])
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"1"
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert show];
}
else if([title isEqualToString:@"2"])
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"2"
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert show];
}
else if([title isEqualToString:@"3"])
{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"UIAlertView"
message:@"3"
delegate:nil
cancelButtonTitle:@"OK"
otherButtonTitles:nil];
[alert show];
}
}
Conclusion
And that’s it for today. As you can see, showing alerts is not complicated at all. You can use them to notify the user of important information. If you have any questions, please leave a comment!