Creating Custom Swipe to Delete iOS Feature Using iOS TableView

When iOS 7 was first released, Apple introduced a great user interface in the Mail app. Swiping right revealed a menu with multiple choice of actions. Choices included swipe to delete iOS feature with a trash button, plus a More button. This button brings up the a list of options like Flag, Reply, Archive, etc. This was a great feature and within no time, our clients demanded to add Swipe to delete iOS feature in their startup apps as well.

Fortunately for us, we figured out the free solution for the same and integrated the feature in our client’s apps. Also, in this iOS app tutorial, we’re about to do the same. Share the whole process of adding swipe to delete iOS feature using iOS tableview.

Let’s Get Started

Create a new project under file menu and select “Single View Application.”

in the next tab, customize your project details and click on finish.

Add a UITableview in ViewController in Main.storyboard and set outlet, datasource and delegate in ViewController.swift

@IBOutlet weak var tblEditing: UITableView!

Now create an array of city and load it into the tableview

let arrCity = ["Delhi", "Mumbai", "Chennai", "Kolkata"]

 

// MARK: - Table view data source

 

func numberOfSectionsInTableView(tableView: UITableView) -> Int {

return 1

}

 

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

return arrCity.count

}

 

 

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath)

cell.textLabel?.text = arrCity[indexPath.row]

 

return cell

}

Once loading done now we have requirement to add 3 options in UITableView for

a) More

b) Share

c) Delete

and for this we have to add following code snippet in ViewController.swift

func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {

}

 

 

func tableView(tableView: UITableView, editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [UITableViewRowAction]? {

//1

let moreAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "More" , handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in

// 2

let moreMenu = UIAlertController(title: nil, message: "About City", preferredStyle: .ActionSheet)

 

let moreOpenAction = UIAlertAction(title: "Know More", style: UIAlertActionStyle.Default, handler: nil)

let cancelAction = UIAlertAction(title: "Cancel", style: UIAlertActionStyle.Cancel, handler: nil)

 

moreMenu.addAction(moreOpenAction)

moreMenu.addAction(cancelAction)

 

self.presentViewController(moreMenu, animated: true, completion: nil)

})

moreAction.backgroundColor = UIColor.brownColor()

 

 

// 3

let shareAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Share" , handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in

// 4

let shareMenu = UIAlertController(title: nil, message: "Share using", preferredStyle: .ActionSheet)

 

let facebookAction = UIAlertAction(title: "Facebook", style: UIAlertActionStyle.Default, handler: nil)

let cancelAction = UIAlertAction(title: "Cancel", style: UIAlertActionStyle.Cancel, handler: nil)

 

shareMenu.addAction(facebookAction)

shareMenu.addAction(cancelAction)

 

 

self.presentViewController(shareMenu, animated: true, completion: nil)

})

shareAction.backgroundColor = UIColor.lightGrayColor()

 

// 5

let deleteAction = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Delete" , handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in

// 6

let deleteMenu = UIAlertController(title: nil, message: "Remove City", preferredStyle: .ActionSheet)

 

let deleteAction = UIAlertAction(title: "Delete", style: UIAlertActionStyle.Default, handler: nil)

let cancelAction = UIAlertAction(title: "Cancel", style: UIAlertActionStyle.Cancel, handler: nil)

 

deleteMenu.addAction(deleteAction)

deleteMenu.addAction(cancelAction)

 

self.presentViewController(deleteMenu, animated: true, completion: nil)

})

deleteAction.backgroundColor = UIColor.redColor()

 

 

// 7

return [deleteAction, shareAction, moreAction]

}

And done!
Now when you run the demo, it will look like this:

The iOS Tableview makes it really easy to implement the swipe to delete iOS feature in any iOS app. So if you’re developing an iOS app or looking to hire swift developer for creating a brand new startup app, consider to add swipe to delete iOS feature. It helps to improve the user interface and offer more actions to your app users in your app.

Grab a free copy of custom swipe demo from Github.

This page was last edited on November 22nd, 2016, at 17:38.