How to add mask on UIImageView in Cell - Swift

Question

I've a tableView and I'm trying to add black mask on each image in the cell not on the whole cell just on the image. But I have two issues;

-It is masking the half cell from the left to the middle and each I scroll it is becoming darker. So please where would be my issue?

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("cell") as! PlacesTableViewCell

        cell.backgroundImage.sd_setImageWithURL(NSURL(string: place.Image), placeholderImage: nil, options: .HighPriority)
}

class PlacesTableViewCell: UITableViewCell {
    override func layoutSubviews() {
    super.layoutSubviews()
    maskArrangement()
}

func maskArrangement(){
    var maskLayer = CALayer()
    maskLayer.frame = CGRectMake(0, 0, backgroundImage.frame.size.width, backgroundImage.frame.size.height)
    maskLayer.backgroundColor = UIColor(white: 0.0, alpha: 0.5).CGColor
    //backgroundImage.layer.mask = maskLayer
    backgroundImage.layer.addSublayer(maskLayer)
    }
}

How are you defining your PlacesTableViewCell? It is a custom cell type I gather? Do you have a custom class definition for it? — Duncan C, Sep 03 '15 at 21:48

Candost · Accepted Answer · 2015-09-04T09:08:24.637

0

Every time cell is dequeued you are adding new sublayer to your backgroundImage. In this way it is getting darker when you scroll (when you dequeued your cells). I think you can add to your PlacesTableViewCell class at awakeFromNib method if it has a .xib file.

Meanwhile your image's frame should be half of the cell. Use autolayout to fix it's frame (for instance, set width and height constraints) in your PLacesTableViewCell class.

In @Shripada 's way:

class PlacesTableViewCell: UITableViewCell {
    var maskLayer : CALayer
    override func layoutSubviews() {
    super.layoutSubviews()
    maskArrangement()
}

    func maskArrangement(){
        if maskLayer == nil {
            maskLayer.frame = CGRectMake(0, 0, backgroundImage.frame.size.width, backgroundImage.frame.size.height)
            maskLayer.backgroundColor = UIColor(white: 0.0, alpha: 0.5).CGColor
            //backgroundImage.layer.mask = maskLayer
            backgroundImage.layer.addSublayer(maskLayer)
        }
    }
}

I haven't tried this code. But your solution can be like that.

edited Sep 04 '15 at 09:08

answered Sep 03 '15 at 21:21

Candost

1,029
1
12
28

No it doesn't has a .XIB File. Could you please tell me the second way for that? – Luai Kalkatawi Sep 03 '15 at 21:30
You can add a layer where you created your image in PlacesTableViewCell or you can add this layer in initWithCoder method in your PlacesTableViewCell – Candost Sep 03 '15 at 21:38
Or, have a member inside your cell, for the maskLayer. If the maskLayer exists already don't create one (when cell gets reused), if not, create if and set it as you are doing now. – Shripada Sep 04 '15 at 05:58
It is working fine after I've added the layer in the 'PlacesTableViewCell' but still not in the correct place @CandostDagdeviren I have edited the code. – Luai Kalkatawi Sep 04 '15 at 08:34

How to add mask on UIImageView in Cell - Swift

1 Answers1