CODEWITHSUNDEEP
iosswiftuitableviewuiswipeactionsconfiguration
Will Taylor
Will Taylor

Reputation: 551

Image in TableViewCell swipe action

I have a swipe action to 'complete' a task in my to-do list app. This is the image I have set:

enter image description here

However when the cell is swiped, the image looks like this:

Swiped image

Is there a way to make the background transparent/white and the image to have the green circle like the image above?

If there is not, is there a way to make the green background 'wrap' to the purple of the cell so there is no whitespace? Thanks!

Upvotes: 2

Views: 1901

Answers (3)

Arnold Tang
Arnold Tang

Reputation: 321

In iOS 13 with SF Symbol, simply use UIImageRenderingModeAlwaysOriginal to change the symbol color.

replyAction.image = [[UIImage systemImageNamed: @"arrowshape.turn.up.left.circle.fill"] imageWithTintColor: self.view.tintColor renderingMode: UIImageRenderingModeAlwaysOriginal];

Upvotes: 0

Jordan
Jordan

Reputation: 341

In came up with this extension for UIImage:

    extension UIImage {
        func colored(in color: UIColor) -> UIImage {
            let renderer = UIGraphicsImageRenderer(size: size)
            return renderer.image { context in
                color.set()
                self.withRenderingMode(.alwaysTemplate).draw(in: CGRect(origin: .zero, size: size))
            }
        }
    }

It returns a new icon in the new color when used like this:

        swipAction.image = UIImage(named: "myImage")?.colored(in: .white)

Maybe this helps someone.

Upvotes: 9

matt
matt

Reputation: 535138

In the second image, the green is the UIContextualAction's backgroundColor and the white is the tintColor.

The image is treated as a template image — that is, its colors are ignored, and instead it is drawn transparent where your image is transparent, and drawn opaque with the tintColor where your image is opaque.

So, basically you would need to reverse your settings: set the background color to white and change the tint color to the darker green shown in your image. Setting the tint color is not easy, but you could do it, for example, in your app delegate didFinishLaunching using the appearance proxy, as suggested here (though this may have other unwanted side effects):

UIImageView.appearance(
    whenContainedInInstancesOf: [UITableView.self])
        .tintColor = // whatever that green is

Upvotes: 5

Related Questions