Add Extra Buttons to UITableView Napkins

I am currently using NSFetchedResultsController to handle table views. I am wondering if there is a way to add additional buttons like delete button in swipe mode?

I'm thinking of a subclass. But do not find anything useful in the reference documents for my problems.

Thanks in advance.

+13
ios tableview customization swipe
Jan 09 '15 at 6:40
source share
2 answers

Your title is misleading. NSFetchedResultsController has nothing to do with your ultimate goal. Subclassing will just do more work than necessary, that you want to learn about UITableViewRowAction . It is very easy and similar to the new UIAlertController , so you should feel very comfortable with this if you have already tried UIAlertController

Overview (straight from the docs ) of the UITableViewRowAction :

Represents a delegate for actions displayed in response to napkins on the specified line. (required) Use this method if you want to provide custom actions for one of the rows in a table. When the user clicks horizontally in a row, the table view moves the contents of the row to the side to reveal your actions. When one of the action buttons is pressed, the handler block saved by the action object is executed. If you do not implement this method, the table view displays the standard accessory buttons when the user views the row.

A few notes before you start:

  • Apple implemented this in iOS8: think carefully about your deployment goal. If you're strictly coding i0S8, this is a quick and easy alternative to third-party libraries or creating a custom editing style for UITableView. If you want to keep compatibility for iOS7, your options are limited to this format. NOTE SIDE , this does not lead to a fatal error in your code, iOS7 applications will not be broken, however, user actions simply do not appear.
  • There are not many settings outside the title bar.
  • The advantages of this is that everything is processed using blocks.

Regardless of how to implement a custom UITableViewRowAction , you must first ensure that your table is editable by calling the following methods:

 - (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath { //Obviously, if this returns no, the edit option won't even populate return YES; } - (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath { //Nothing gets called here if you invoke `tableView:editActionsForRowAtIndexPath:` according to Apple docs so just leave this method blank } 

At a minimum, these are two methods that must be declared before moving.

To actually customize the action buttons in a line, follow the general guidelines as follows:

STEP 1 implements the tableView:editActionsForRowAtIndexPath:

 -(NSArray *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath { } 

As you can see, this is an instance method of type NSArray, so you need to return an array.

STEP 2 Add action objects to transfer in the array. Example:

 { UITableViewRowAction *delete = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@"Delete" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) { // Delete something here }]; UITableViewRowAction *more = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@" More " handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) { //Do whatever here : just as an example : [self presentUIAlertControllerActionSheet]; }]; } 

You can change several properties for these actions in a line, but see the docs for full customization:

To customize the background colors of a lineโ€™s action, just prepare it, like most other actions inside buttons:

 delete.backgroundColor = [UIColor redColor]; more.backgroundColor = [UIColor colorWithRed:0.188 green:0.514 blue:0.984 alpha:1]; //arbitrary color 

STEP 3 As mentioned earlier, you need to return the array to the instance method so that your full code looks like this:

 -(NSArray *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath { UITableViewRowAction *delete = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@"Delete" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) { // Delete something here }]; delete.backgroundColor = [UIColor redColor]; UITableViewRowAction *more = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@" More " handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) { //Just as an example : [self presentUIAlertControllerActionSheet]; }]; more.backgroundColor = [UIColor colorWithRed:0.188 green:0.514 blue:0.984 alpha:1]; return @[delete, more]; //array with all the buttons you want. 1,2,3, etc... } 



Further link: DOCUMENT LINK




FOR SWIFT SYNTAX CONNECTION

 override func tableView(tableView: UITableView, editActionsForRowAtIndexPath indexPath: NSIndexPath) -> [AnyObject]? { var delete = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "Delete" , handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in //Do something }) delete.backgroundColor = UIColor.redColor() var more = UITableViewRowAction(style: UITableViewRowActionStyle.Default, title: "More" , handler: { (action:UITableViewRowAction!, indexPath:NSIndexPath!) -> Void in //Do something }) more.backgroundColor = UIColor.blueColor() return [delete, more] } 
+46
Jan 09 '15 at 8:04
source share

All wishes @soulshined accepted answer.

Here is the Swift 3 version:

 func tableView(_ tableView: UITableView, editActionsForRowAt indexPath: IndexPath) -> [UITableViewRowAction]? { let delete = UITableViewRowAction(style: .default, title: "Delete") { (action:UITableViewRowAction, indexPath:IndexPath) in print("delete at:\(indexPath)") } delete.backgroundColor = .red let more = UITableViewRowAction(style: .default, title: "More") { (action:UITableViewRowAction, indexPath:IndexPath) in print("more at:\(indexPath)") } more.backgroundColor = .orange return [delete, more] } 
+10
Mar 21 '17 at 17:40
source share



All Articles