In this tutorial, we’ll be implementing Action Sheet in our iOS Application using Swift.
Table of Contents
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:
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.
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:
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:
Is it possible to use different colors in action text that is multi color in one UIAlertAction ….. Attributed string?
This is swift, I think it was a Objective C tutorial … :/
Please help me :{
I created an actionSheet but I want one of the optionMenu to open another actionSheet when pressed!
Hi Anupam.
That was a really nice article. I was trying to change ActionSheet text so I found out your post.
It’s so interesting the way you solve it. How can I know what other changeable keys action sheet has?
I mean, in your project you changed “titleTextColor” how can I know what other I can change?