Swipe-able Table View Cell in iOS 9
SwiftUitableviewCustom CellIos9TableviewcellSwift Problem Overview
I want my table list to have a swipe-able menu like in iOS 8 (first introduced in iOS 7).
I've found a Ray Wenderlich guide that is clear on how to do it, but it was written a year and 4 months ago and the code is in Objective-C.
Did iOS 8 or the upcoming iOS 9 finally include this function in Apple's SDK? I know they made the "swipe to reveal delete function" built-in years ago. I don't want to waste my time implementing patched-together code to mimic the iOS 8 mail function, if Apple's new iOS is going to hand it to me in a neatly wrapped package.
Swift Solutions
Solution 1 - Swift
Try this, updated for Swift 3 (Developer Docs)
override func tableView(_ tableView: UITableView, editActionsForRowAt: IndexPath) -> [UITableViewRowAction]? {
let more = UITableViewRowAction(style: .normal, title: "More") { action, index in
print("more button tapped")
}
more.backgroundColor = .lightGray
let favorite = UITableViewRowAction(style: .normal, title: "Favorite") { action, index in
print("favorite button tapped")
}
favorite.backgroundColor = .orange
let share = UITableViewRowAction(style: .normal, title: "Share") { action, index in
print("share button tapped")
}
share.backgroundColor = .blue
return [share, favorite, more]
}
Also implement this: (You can make it conditional, but here everything is editable)
override func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
return true
}
Solution 2 - Swift
This code is work for me in the swift4.
> Answer of the above screen is:-
func tableView(_ tableView: UITableView,
trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
{
// Write action code for the trash
let TrashAction = UIContextualAction(style: .normal, title: "Trash", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("Update action ...")
success(true)
})
TrashAction.backgroundColor = .red
// Write action code for the Flag
let FlagAction = UIContextualAction(style: .normal, title: "Flag", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("Update action ...")
success(true)
})
FlagAction.backgroundColor = .orange
// Write action code for the More
let MoreAction = UIContextualAction(style: .normal, title: "More", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("Update action ...")
success(true)
})
MoreAction.backgroundColor = .gray
return UISwipeActionsConfiguration(actions: [TrashAction,FlagAction,MoreAction])
}
> Answer of the above screen:-
func tableView(_ tableView: UITableView,
leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration?
{
let closeAction = UIContextualAction(style: .normal, title: "Mark as Read", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("CloseAction ...")
success(true)
})
closeAction.backgroundColor = .blue
return UISwipeActionsConfiguration(actions: [closeAction])
}
>Write tableview Delegate method likewise:-
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return arrPerson.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
let personName = arrPerson[indexPath.row]
cell.textLabel?.text = personName.personName
return cell
}
>And in the viewDidLoad
override func viewDidLoad() {
super.viewDidLoad()
tblView.delegate = self
tblView.dataSource = self
let person1 = personData(personName: "Jonny", personAge: 30)
let person2 = personData(personName: "Chandan", personAge: 20)
let person3 = personData(personName: "Gopal", personAge: 28)
arrPerson.append(person1)
arrPerson.append(person2)
arrPerson.append(person3)
}
Solution 3 - Swift
You can use a UITableView delegate method to ask for those actions. Implement this method as follows:
- (NSArray *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewRowAction *modifyAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@"Modify" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {
// Respond to the action.
}];
modifyAction.backgroundColor = [UIColor blueColor];
return @[modifyAction];
}
You can of course return multiple actions and customize the text and background color.
Implementing this method is also required to make the row editable:
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
}
Solution 4 - Swift
I found this library MGSwipeTableCell After searching a lot to implement a slide cell in table view using swift I found this one and its just one line of code to do the implementation and found it extremely useful.
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
{
let reuseIdentifier = "programmaticCell"
var cell = self.table.dequeueReusableCellWithIdentifier(reuseIdentifier) as! MGSwipeTableCell!
if cell == nil
{
cell = MGSwipeTableCell(style: UITableViewCellStyle.Subtitle, reuseIdentifier: reuseIdentifier)
}
cell.textLabel!.text = "Title"
cell.detailTextLabel!.text = "Detail text"
cell.delegate = self //optional
//configure left buttons
cell.leftButtons = [MGSwipeButton(title: "", icon: UIImage(named:"check.png"), backgroundColor: UIColor.greenColor())
,MGSwipeButton(title: "", icon: UIImage(named:"fav.png"), backgroundColor: UIColor.blueColor())]
cell.leftSwipeSettings.transition = MGSwipeTransition.Rotate3D
//configure right buttons
cell.rightButtons = [MGSwipeButton(title: "Delete", backgroundColor: UIColor.redColor())
,MGSwipeButton(title: "More",backgroundColor: UIColor.lightGrayColor())]
cell.rightSwipeSettings.transition = MGSwipeTransition.Rotate3D
return cell
}
Thats the only function you'll have to implement and update your pod file
Solution 5 - Swift
Swift 3 complete solution:
import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
@IBOutlet weak var tableView: UITableView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
tableView.tableFooterView = UIView(frame: CGRect.zero) //Hiding blank cells.
tableView.separatorInset = UIEdgeInsets.zero
tableView.dataSource = self
tableView.delegate = self
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 4
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "tableCell", for: indexPath)
return cell
}
//Enable cell editing methods.
func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {
return true
}
func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
}
func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? {
let more = UITableViewRowAction(style: .normal, title: "More") { action, index in
//self.isEditing = false
print("more button tapped")
}
more.backgroundColor = UIColor.lightGray
let favorite = UITableViewRowAction(style: .normal, title: "Favorite") { action, index in
//self.isEditing = false
print("favorite button tapped")
}
favorite.backgroundColor = UIColor.orange
let share = UITableViewRowAction(style: .normal, title: "Share") { action, index in
//self.isEditing = false
print("share button tapped")
}
share.backgroundColor = UIColor.blue
return [share, favorite, more]
}
}
Solution 6 - Swift
AFAIK there is no in-built ready to go solution, and even if there was in iOS9, you probably cannot use it since you can't only support iOS9 in your app for foreseeable future.
Instead, I recommend you look into this library:
https://github.com/CEWendel/SWTableViewCell
It is very easily configurable, quite polished, and worked well in any swift project that I worked on.
Hope it helps!
Solution 7 - Swift
It is easier than you think. Here is an example of a Swift class with an implemented UITableView and the ability to swipe UITableViewCell.
import UIKit
class ViewController: UIViewController {
// MARK: Properties
let strings = ["firstString", "secondString", "thirdString"]
// MARK: Outlets
@IBOutlet weak var tableView: UITableView!
// MARK: Lifecycle
override func viewDidLoad() {
super.viewDidLoad()
tableView.delegate = self
tableView.dataSource = self
}
}
extension ViewController: UITableViewDataSource, UITableViewDelegate {
// MARK: UITableViewDataSource
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return objects.count
}
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cellIdentifier", for: indexPath)
let currentString = strings[indexPath.row]
cell.textLabel?.text = currentString
return cell
}
// MARK: UITableViewDelegate
func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
tableView.deselectRow(at: indexPath, animated: true)
}
func tableView(_ tableView: UITableView, leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let leftAction = UIContextualAction(style: .normal, title: "Red", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("leftAction tapped")
success(true)
})
leftAction.image = UIImage(named: "")
leftAction.backgroundColor = UIColor.red
return UISwipeActionsConfiguration(actions: [leftAction])
}
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let rightAction = UIContextualAction(style: .normal, title: "Green", handler: { (ac:UIContextualAction, view:UIView, success:(Bool) -> Void) in
print("rightAction tapped")
success(true)
})
rightAction.image = UIImage(named: "")
rightAction.backgroundColor = UIColor.green
return UISwipeActionsConfiguration(actions: [rightAction])
}
}