UITableView swipe actions on iOS

Since iOS 11 it is easy to add swipe actions in a table view. What we need to do, is to implement UITableView delegate methods for providing actions for leading and trailing edge. Let’s jump right into it.

Default swipe actions

Swipe actions are provided by two delegate methods which return UISwipeActionsConfiguration. It should be mentioned that when returning nil in those delegates, table view will use its default set of actions. Default action is delete action and acton should be implemented in the editingStyle delegate method.

	optional func tableView(_ tableView: UITableView, leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
	optional func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
	override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCell.EditingStyle, forRowAt indexPath: IndexPath) {
	switch editingStyle {
	case .delete:
	showAlert("Delete triggered")
	case .insert, .none:
	break
	}
	}

view raw UITableViewDelegate.swift hosted with ❤ by GitHub

Custom swipe actions

Let’s leave default actions aside and see what is this configuration object swipe action delegates need to return. It just provides the set of different actions and a property of controlling if the full swipe triggers the first action or not. By default, this is turned on and full swipe triggers the first action. Action itself is represented by UIContextualAction class. This class defines handler block, title, image and background color of the action. Action can’t have both image and title, whenever image is set, title is ignored. In addition, action’s initialiser defines style: normal style means light grey background and destructive style uses red background. One needs to be aware that when adding too many actions results in having overlapping action buttons in the table view. Therefore it always makes to test and see if the amount of actions really works on the smallest display size.

	override func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
	let item = content[indexPath.item]
	switch item {
	case .iconAction:
	let action = UIContextualAction(style: .normal, title: item.rawValue, handler: { [weak self] (action, view, block) in
	self?.showAlert(item.rawValue)
	})
	action.backgroundColor = UIColor(hue: 0.11, saturation: 0.56, brightness: 0.48, alpha: 1.0)
	action.image = UIImage(named: "Icon")
	return UISwipeActionsConfiguration(actions: [action])
	case .multipleTrailingActions:
	let action1 = UIContextualAction(style: .normal, title: "Action1", handler: { [weak self] (action, view, block) in
	self?.showAlert("Action1")
	})
	action1.backgroundColor = UIColor(hue: 0.56, saturation: 0.56, brightness: 0.55, alpha: 1.0)
	let action2 = UIContextualAction(style: .normal, title: "Action2", handler: { [weak self] (action, view, block) in
	self?.showAlert("Action2")
	})
	action2.backgroundColor = UIColor(hue: 0.35, saturation: 0.33, brightness: 0.55, alpha: 1.0)
	return UISwipeActionsConfiguration(actions: [action1, action2])
	case .trailingAction:
	let action = UIContextualAction(style: .normal, title: item.rawValue, handler: { [weak self] (action, view, block) in
	self?.showAlert(item.rawValue)
	})
	return UISwipeActionsConfiguration(actions: [action])
	case .trailingDestructiveAction:
	let action = UIContextualAction(style: .destructive, title: item.rawValue, handler: { [weak self] (action, view, block) in
	self?.showAlert(item.rawValue)
	})
	return UISwipeActionsConfiguration(actions: [action])
	case .trailingTableViewDefaultAction:
	return nil
	case .leadingAction, .leadingDestructiveAction, .tooManyLeadingActions:
	return UISwipeActionsConfiguration(actions: []) // when returning nil, default actions are shown
	}
	}

view raw UITableViewSwipeActions.swift hosted with ❤ by GitHub

Summary

In summary, swipe actions are extremely simple to add using table view delegates. It is an easy way of providing important actions in an accessible manner.

If this was helpful, please let me know on Twitter @toomasvahter. Feel free to subscribe to RSS feed. Thank you for reading.

Example project

UITableViewSwipeActions Xcode 10.2, Swift 4.2

Resources

• UISwipeActionsConfiguration (Apple)
• UIContextualAction (Apple)