How add custom image to uitableview cell swipe to delete

Question

Could you tell me, how to add custom image to delete button when swipe cell on UITableview?

In order to prevent your post from being downvoted, you may want to add some additional information such as, what you've tried so far, what your current code looks like etc.. — James Hay, Mar 30 '15 at 02:31
I wrote a tutorial with downloadable project on how to do this. You can add any object underneath the cell. http://xcodenoobies.blogspot.my/2016/11/how-to-create-swipeable-tableview-cell.html — GeneCode, Nov 21 '16 at 09:34

score 7 · Answer 1 · answered Mar 29 '15 at 21:41

7

search you need function "editActionsForRowAtIndexPath", where you create scope of actions. You need to set UIImage to backgroundColor of UITableViewRowAction.

let someAction = UITableViewRowAction(style: .Default, title: "") { value in 
    println("button did tapped!")
}
someAction.backgroundColor = UIColor(patternImage: UIImage(named: "myImage")!)

answered Mar 29 '15 at 21:41

dimpiax

12,093
5
62
45

Pay attention that UITableViewRowAction is only available for iOS >= 8.0 – Duyen-Hoa Mar 29 '15 at 22:19
Hi dimpiax! No, I don't want scope of actions, I just want to add custom image to delete button. – user3742622 Mar 30 '15 at 10:50
so, you just need to add one action with the image. This code will help. – dimpiax Mar 30 '15 at 13:10
1

this code doesn't work for me. It doesn't trigger any error but the instead of having the icon or the title, I have a little red rectangle. I have multiple actions set if that change anything. – SKYnine Jul 08 '15 at 21:24
@SKYnine did you set empty string of width your icon? – dimpiax Jul 09 '15 at 22:08
5

When I use this, what I get is my icon repeated side-by-side on the background. Is there anyway to make it appear only once, truly as an icon? – AugustoQ Sep 25 '15 at 14:04
1

@dimpiax it was exactly as shown above. The only difference was that I had two actions. They both had their icons displaced to the top (so I can actually see it start to repeat on the bottom), and the first that was passed had the icon repeating also horizontally (so it was laid over the second's icon) – AugustoQ Sep 26 '15 at 02:05

score 7 · Answer 2 · answered Dec 19 '19 at 09:10

There's this UITableView delegate function you can make use of:

@available(iOS 11.0, *)
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
    let deleteAction = UIContextualAction(style: .normal, title: "", handler: {a,b,c in
        // example of your delete function
        self.YourArray.remove(at: indexPath.row)
        tableView.deleteRows(at: [indexPath], with: .automatic)
    })

    deleteAction.image = UIImage(named: "trash.png")
    deleteAction.backgroundColor = .red
    return UISwipeActionsConfiguration(actions: [deleteAction])
}

PS: Personally, I think icon size 32 is the best

Maulik Patel · Answer 3 · 2020-10-30T05:20:43.687

100 % working Swipable cell with custom image and size of image with background color ios swift #ios #swift #ios13 #ios14

func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {

        let action =  UIContextualAction(style: .normal, title: "", handler: { (action,view,completionHandler ) in
            self.selectedIndex  = indexPath.row
            self.deleteNotification()
            completionHandler(true)

        })
        
        if #available(iOS 13.0, *) {
            action.image = UIGraphicsImageRenderer(size: CGSize(width: 30, height: 30)).image { _ in
                UIImage(named: "delete-1")?.draw(in: CGRect(x: 0, y: 0, width: 30, height: 30))
            }
            action.backgroundColor = UIColor.init(red: 0/255.0, green: 0/255.0, blue: 0/255.0, alpha: 0.0)
            let confrigation = UISwipeActionsConfiguration(actions: [action])
            return confrigation
        } else {
            // Fallback on earlier versions
            let cgImageX =  UIImage(named: "delete-1")?.cgImage
            action.image = OriginalImageRender(cgImage: cgImageX!)
            action.backgroundColor = UIColor.init(hex: "F7F7F7")
            let confrigation = UISwipeActionsConfiguration(actions: [action])

            return confrigation
        }
}

How add custom image to uitableview cell swipe to delete

3 Answers3

Linked