Launch the Action Sheet in iOS

An action sheet can be useful in displaying the options to the users. Launch the Action sheet in iOS using the UIKit’s UIAlertViewController class.

In this blog, we will explore how you can display the options to the users using the UIAlertViewController’s property Style.

Launch action sheet in iOS

If you want to perform multiple actions from one single button you can make an action sheet that will come up from the bottom of the screen.

You can dismiss the action sheet using the cancel action.

You have to set the style of cancel as “.cancel” and others have a “.normal” style.

The action sheet comes from the bottom of the iPhone. To launch on iPad you have to set the frame of that action sheet. A simple example using an action sheet in Swift is. shown below.

func confirmDelete(product: String) {
        let alert = UIAlertController(title: "title", message: "Are you sure you want to permanently delete ", preferredStyle: .actionSheet)
        
        let DeleteAction = UIAlertAction(title: "Delete", style: .destructive, handler: Delete)
        let CancelAction = UIAlertAction(title: "Cancel", style: .cancel, handler: cancel)
        
        alert.addAction(DeleteAction)
        alert.addAction(CancelAction)
        
        // Support display in iPad
        alert.popoverPresentationController?.sourceView = self.view
        alert.popoverPresentationController?.sourceRect = CGRect(x:self.view.bounds.size.width / 2.0, y: self.view.bounds.size.height / 2.0, width : 1.0, height : 1.0)
        
        self.present(alert, animated: true, completion: nil)
}

func confirmDelete(product: String) {

let alert = UIAlertController(title: "title", message: "Are you sure you want to permanently delete ", preferredStyle: .actionSheet)

let DeleteAction = UIAlertAction(title: "Delete", style: .destructive, handler: Delete)

let CancelAction = UIAlertAction(title: "Cancel", style: .cancel, handler: cancel)

alert.addAction(DeleteAction)

alert.addAction(CancelAction)

// Support display in iPad

alert.popoverPresentationController?.sourceView = self.view

alert.popoverPresentationController?.sourceRect = CGRect(x:self.view.bounds.size.width / 2.0, y: self.view.bounds.size.height / 2.0, width : 1.0, height : 1.0)

self.present(alert, animated: true, completion: nil)

}

Methods of those actions:-

//for delete

 func Delete(alertAction: UIAlertAction!) -&gt; Void {


 }

//for cancel

 func cencel(alertAction: UIAlertAction!) -&gt; Void {


 }

//for delete

func Delete(alertAction: UIAlertAction!) -> Void {

}

//for cancel

func cencel(alertAction: UIAlertAction!) -> Void {

}

Sometimes, there are multiple options to display to the users. We can achieve this by adding a for loop to the available options array.

The below code describes how you can achieve this.

var setJson = ["100 miles", "200 miles", "300 miles", "400 miles", "500 miles"]
let alertController = UIAlertController(
			title: "Title",
			message: nil,
			preferredStyle: .actionSheet
		)
		for action in 0..&lt;setJson.count {
			var checkValue = false
			let imgTitle = UIImage(named:"check")
			let imgViewTitle = UIImageView(frame: CGRect(x: 10, y: 10, width: 30, height: 30))
			imgViewTitle.image = imgTitle
			checkValue = true
			alertController.addActions(actions: [
				UIAlertAction(title: setJson[action], style: .default, handler: { (action) -> Void in
					if let alertIndex = alertController.actions.index(of: action) {
						// perform actions to each options here
					}
				})
			], check: checkValue, preferred: "Cancel")
			
		}
		alertController.addActions(actions: [
			UIAlertAction(title: "Cancel", style: .cancel, handler: nil)
		], check: false, preferred: "Cancel")
		alertController.popoverPresentationController?.sourceView = self.view
		alertController.popoverPresentationController?.sourceRect = CGRect(x: self.view.bounds.size.width / 2.0, y: self.view.bounds.size.height / 2.0, width: 1.0, height: 1.0)
		present(alertController, animated: true, completion: nil)

var setJson = ["100 miles", "200 miles", "300 miles", "400 miles", "500 miles"]

let alertController = UIAlertController(

title: "Title",

message: nil,

preferredStyle: .actionSheet

)

for action in 0..<setJson.count {

var checkValue = false

let imgTitle = UIImage(named:"check")

let imgViewTitle = UIImageView(frame: CGRect(x: 10, y: 10, width: 30, height: 30))

imgViewTitle.image = imgTitle

checkValue = true

alertController.addActions(actions: [

UIAlertAction(title: setJson[action], style: .default, handler: { (action) -> Void in

if let alertIndex = alertController.actions.index(of: action) {

// perform actions to each options here

}

})

], check: checkValue, preferred: "Cancel")

}

alertController.addActions(actions: [

UIAlertAction(title: "Cancel", style: .cancel, handler: nil)

], check: false, preferred: "Cancel")

alertController.popoverPresentationController?.sourceView = self.view

alertController.popoverPresentationController?.sourceRect = CGRect(x: self.view.bounds.size.width / 2.0, y: self.view.bounds.size.height / 2.0, width: 1.0, height: 1.0)

present(alertController, animated: true, completion: nil)

addActions is a method defined in the extension for the UIAlertViewController.

extension UIAlertController {
	func addActions(actions: [UIAlertAction],check:Bool, preferred: String? = nil) {
		
		for action in actions {
			self.addAction(action)
			if check == true{
				action.image = UIImage(named: "check")
			}else {
				action.image = nil
			}
			if let preferred = preferred, preferred == action.title {
				self.preferredAction = action
			}
		}
	}
}

extension UIAlertAction{
	@NSManaged var image : UIImage?
	
	convenience init(title: String?, style: UIAlertAction.Style,image : UIImage?, handler: ((UIAlertAction) -> Swift.Void)? = nil ){
		self.init(title: title, style: style, handler: handler)
		self.image = image
	}
}

extension UIAlertController {

func addActions(actions: [UIAlertAction],check:Bool, preferred: String? = nil) {

for action in actions {

self.addAction(action)

if check == true{

action.image = UIImage(named: "check")

}else {

action.image = nil

}

if let preferred = preferred, preferred == action.title {

self.preferredAction = action

}

extension UIAlertAction{

@NSManaged var image : UIImage?

convenience init(title: String?, style: UIAlertAction.Style,image : UIImage?, handler: ((UIAlertAction) -> Swift.Void)? = nil ){

self.init(title: title, style: style, handler: handler)

self.image = image

}

Here is the output of the above code.

Conclusion

The action sheet is a popular and efficient way to display options to the users.

It can handle multiple options from an array.

We hope you would like this blog.

Please check our other blogs here.

You may also check our Flutter app development page.

animation bottom iOS popover swift uiactionsheet UIAlertController uialertview uiview view

bhavuk chawla

Proficient in designing and developing iOS applications for e-commerce and retail banking. Focused on building core app features that enhance functionality, user engagement, and seamless integration.

27 Mar, 2024
Updated by - Jitendra Kumar
13 Apr, 2017
Updated by - Mobikul

. . .

Launch the Action Sheet in iOS

Launch action sheet in iOS

Conclusion

Leave a Comment Cancel Reply

Message Sent!