Home / Questions / 11854
Accepted
Víctor Gonzal
Asked: 2020-06-04 16:35:39 +0800 CST 2020-06-04 16:35:39 +0800 CST

circular UIImageView in UITableViewCell

  • 772

I'm trying to put a Circular UIImageview into a UITableViewCell and I'm not having much success :(.

In my TableViewCell class

class ComentariosTVCell: UITableViewCell {


@IBOutlet weak var photoUser: UIImageView!

//weak var photoUser: UIImageView!

override func layoutSubviews() {


   
    photoUser.round()
    
    /*
     photoUser.layer.borderWidth = 1
     photoUser.layer.masksToBounds = true
     photoUser.layer.borderColor = UIColor.blackColor().CGColor
    
     photoUser.layer.cornerRadius = 40.0 //photoUser.bounds.height/2
    print("frame: ", photoUser.frame)
     photoUser.clipsToBounds = true*/
}


override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code
}

override func setSelected(selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}}


public extension UIView {
public func round() {
    let width = bounds.width < bounds.height ? bounds.width : bounds.height
    let mask = CAShapeLayer()
    mask.path = UIBezierPath(ovalInRect: CGRectMake(bounds.midX - width / 2, bounds.midY - width / 2, width, width)).CGPath
    self.layer.mask = mask
}}

and when loading the table the view does not load correctly if not until one of the cells is selected or scrool is done.

enter image description here

enter image description here

where am I failing?

swift

1 Answers

  1. Best Answer

    Perhaps you are complicating yourself. The simplest and fastest thing you can do is the following:

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    //......

    photoUser.layer.cornerRadius = CGRectGetWidth(photoUser.bounds) / 2.0
    photoUser.layer.masksToBounds = true

    //......

}

    Basically what you're doing here is rounding the , UIImageViewand making sure maskToBoundsthe image doesn't go outside the UIImageView. This is probably the best way and the one that will give you the best performance.

    UPDATE 1

    You can also do the implementation in the subclass directly

    class ComentariosTVCell: UITableViewCell {


    @IBOutlet weak var photoUser: UIImageView! {
        didSet {
            photoUser.layer.cornerRadius = CGRectGetWidth(photoUser.bounds) / 2.0
            photoUser.layer.masksToBounds = true
        }
    }

    //........

}
    • 2