iOS Action Sheet using Alert Controller

In this tutorial, we’ll be implementing Action Sheet in our iOS Application using Swift.

iOS Action Sheet

UIActionSheet class has now been deprecated. In order to implement ActionSheets we use UIAlertController now.

ActionSheets are like BottomSheet Dialogs in Android. They slide up from the bottom of the screen. You must select one of the options present in it. An ActionSheet doesn’t close otherwise.

An ActionSheet can have buttons of three styles:

• default: The normal options. Default color is blue.
• destructive: Default color is red and is generally used for Delete options.
• cancel: This comes at the bottom of the ActionSheet and is used to close it.

Creating an ActionSheet in Swift:

Copy
let alertController = UIAlertController(title: "Question", message: "Will India ever win a FIFA World Cup?", preferredStyle: .actionSheet)
        
        let yesAction = UIAlertAction(title: "Yes", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Yes")
        })
        
        alertController.addAction(yesAction)
      
        self.present(alertController, animated: true, completion: nil)

We’ve used UIAlertController with the preferred style set to actionSheet. The default style is alert which is used for displaying alert dialogs.

addAction is used to add a UIAlertAction option into the ActionSheet.

In the UIAlertAction, we define the style as default in the above code. We could use destructive or cancel as well which we will do in the XCode project below.

present displays the ActionSheet instance in our View.

Let’s create a new XCode project. We will create a single view application.

iOS Action Sheet Example Storyboard

The Main.Storyboard is empty by default.
We’ll add three Buttons for each of the ActionSheets types. Set the Auto-layout constraints as well.
Following is how our Main.storyboard looks :

Each of the Buttons IBActions is linked to the ViewController.swift using the assistant editor.

The code for the ViewController.swift is given below.

Copy
import UIKit

class ViewController: UIViewController {

    @IBAction func showColored(_ sender: Any) {
        
        let alertController = UIAlertController(title: nil, message: "Colored options exists", preferredStyle: .actionSheet)
        
        let action1 = UIAlertAction(title: "Option 1", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Action 1")
        })
        
        let action2 = UIAlertAction(title: "Option 2", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Action 2")
        })
        
        
        let maybeAction = UIAlertAction(title: "Maybe", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Maybe")
        })
        
        action1.setValue(UIColor.purple, forKey: "titleTextColor")
        action2.setValue(UIColor.green, forKey: "titleTextColor")
        maybeAction.setValue(UIColor.black, forKey: "titleTextColor")
        
        alertController.addAction(action1)
        alertController.addAction(action2)
        alertController.addAction(maybeAction)
        
        self.present(alertController, animated: true, completion: nil)
        
    }
    
    @IBAction func showDeleteAndCancel(_ sender: Any) {
        
        let alertController = UIAlertController(title: "Title", message: "Delete And Cancel option exists", preferredStyle: .actionSheet)
        
        let deleteAction = UIAlertAction(title: "Delete", style: .destructive, handler: { (alert: UIAlertAction!) -> Void in
            print("delete")
        })
        
        let cancelAction = UIAlertAction(title: "Cancel", style: .cancel, handler: { (alert: UIAlertAction!) -> Void in
            print("Cancel")
        })
        
        let noAction = UIAlertAction(title: "No", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("No")
        })
        
        let maybeAction = UIAlertAction(title: "Maybe", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Maybe")
        })
        
        alertController.addAction(deleteAction)
        alertController.addAction(cancelAction)
        alertController.addAction(noAction)
        alertController.addAction(maybeAction)
        
        self.present(alertController, animated: true, completion: nil)
        
        
    }
    
    @IBAction func showNormal(_ sender: Any) {
        
        let alertController = UIAlertController(title: "Question", message: "Will India ever win a FIFA World Cup?", preferredStyle: .actionSheet)
        
        let yesAction = UIAlertAction(title: "Yes", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Yes")
        })
        
        let noAction = UIAlertAction(title: "No", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("No")
        })
        
        let maybeAction = UIAlertAction(title: "Maybe", style: .default, handler: { (alert: UIAlertAction!) -> Void in
            print("Maybe")
        })
        
        alertController.addAction(yesAction)
        alertController.addAction(noAction)
        alertController.addAction(maybeAction)
        
        self.present(alertController, animated: true, completion: nil)

    }
    
    @IBOutlet weak var showNormal: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

showNormal function displays an ActionSheet with buttons of the default style.

To change the text color of the options in the ActionSheet from the default color blue, we use the setValue method and pass the UIColor for the standard key of the text color:

Copy
action1.setValue(UIColor.purple, forKey: "titleTextColor")

On every UIAlertAction we have a handler set which is basically a Swift closure. Inside the closure, we can add the logic for the action. Here we’ve just printed the name of the action.

showDeleteAndCancel function displays the ActionSheet with delete and cancel buttons.

The output of the above application in action is given below:

This brings an end to this tutorial. You can download the XCode iOSActionSheets Project from the link below:

About Anupam Chugh

He loves learning new stuff in Android and iOS. Shoot him queries.