How to set imageView in circle like imageContacts in Swift correctly?

I want show a picture into imageView like the image contact (in a circle) But when I try show this, the imageView rescale his size and this doesn’t show correctly in a circle..

 image.layer.borderWidth=1.0
 image.layer.masksToBounds = false
 image.layer.borderColor = UIColor.whiteColor().CGColor
 image.layer.cornerRadius = image.frame.size.height/2
 image.clipsToBounds = true

I want show like this:
enter image description here

  • Cocoa: Command /usr/bin/ditto failed with exit code 1
  • NSBundle - (not loaded yet) Error
  • Synchronized Realm - Airplane Mode
  • Bridge Google Drive API to Swift
  • Regular / Regular position sizing constraints for all iPads, including iPad pro?
  • Substring from NSString
  • But I get this:
    enter image description here

    How can do that image resize to UIImageView size to show like circle?

    Thanks!

    12 Solutions Collect From Internet About “How to set imageView in circle like imageContacts in Swift correctly?”

    What frame size are you using for image? I can get a perfect circle if I set the frame to be a square.

    let image = UIImageView(frame: CGRectMake(0, 0, 100, 100))
    

    This is solution which i have used in my app:

    var image: UIImage = UIImage(named: "imageName")
    imageView.layer.borderWidth = 1.0
    imageView.layer.masksToBounds = false
    imageView.layer.borderColor = UIColor.whiteColor().CGColor
    imageView.layer.cornerRadius = image.frame.size.width/2
    imageView.clipsToBounds = true
    

    Fast and Simple solution.

    How to mask UIImage to Circle without cropping with Swift.

    extension UIImageView {
      public func maskCircle(anyImage: UIImage) {
        self.contentMode = UIViewContentMode.ScaleAspectFill
        self.layer.cornerRadius = self.frame.height / 2
        self.layer.masksToBounds = false
        self.clipsToBounds = true
    
       // make square(* must to make circle), 
       // resize(reduce the kilobyte) and 
       // fix rotation.
       self.image = anyImage
      }
    }
    

    How to call:

    let anyAvatarImage:UIImage = UIImage(named: "avatar")!
    avatarImageView.maskCircle(anyAvatarImage)
    

    That is all you need….

            profilepic = UIImageView(frame: CGRectMake(0, 0, self.view.bounds.width * 0.19 , self.view.bounds.height * 0.1))
            profilepic.layer.borderWidth = 1
            profilepic.layer.masksToBounds = false
            profilepic.layer.borderColor = UIColor.blackColor().CGColor
            profilepic.layer.cornerRadius = profilepic.frame.height/2
            profilepic.clipsToBounds = true
            slider.addSubview(profilepic)
    

    I would suggest making your image file a perfect square to begin with. This can be done in almost any photo editing program. After that, this should work within viewDidLoad. Credit to this video

    image.layer.cornerRadius = image.frame.size.width/2
    image.clipsToBounds = true
    

    I fixed it doing modifying the view:

    1. Go to your Main.storyboard
    2. Click on your image
    3. View -> Mode -> Aspect Fill

    It works perfectly

    This work perfectly for me.
    The order of lines is important

    func circularImage(photoImageView: UIImageView?)
    {
        photoImageView!.layer.frame = CGRectInset(photoImageView!.layer.frame, 0, 0)
        photoImageView!.layer.borderColor = UIColor.grayColor().CGColor
        photoImageView!.layer.cornerRadius = photoImageView!.frame.height/2
        photoImageView!.layer.masksToBounds = false
        photoImageView!.clipsToBounds = true
        photoImageView!.layer.borderWidth = 0.5
        photoImageView!.contentMode = UIViewContentMode.ScaleAspectFill
    }
    

    How to use:

        @IBOutlet weak var photoImageView: UIImageView!
        ...
        ...
        circularImage(photoImageView)
    

    what i found out is that your width and height of image view must return an even number when divided by 2 to get a perfect circle e.g

    let image = UIImageView(frame: CGRectMake(0, 0, 120, 120))
    

    it should not be something like
    let image = UIImageView(frame: CGRectMake(0, 0, 130, 130))

    This also works for me. For perfect circle result, use the same size for width and height. like image.frame = CGRect(0,0,200, 200)

    For non perfect circle, width and height should not be equal like this codes below.

     image.frame = CGRect(0,0,200, 160)
     image.layer.borderColor = UIColor.whiteColor().CGColor
     image.layer.cornerRadius = image.frame.size.height/2
     image.layer.masksToBounds = false
     image.layer.clipsToBounds = true
     image.contentMode = .scaleAspectFill
    

    I had a similar result (more of an oval than a circle). It turned out that the constraints I set on the UIImageView forced it into an oval instead of a circle. After fixing that, the above solutions worked.

    Create your custom circle UIImageView and create the circle under the layoutSubviews helps if you use Autolayout.

    /*
          +-------------+
          |             |
          |             |
          |             |
          |             |
          |             |
          |             |
          +-------------+
      The IMAGE MUST BE SQUARE
    */
    class roundImageView: UIImageView {
    
        override init(frame: CGRect) {
            // 1. setup any properties here
            // 2. call super.init(frame:)
            super.init(frame: frame)
            // 3. Setup view from .xib file
        }
    
        required init?(coder aDecoder: NSCoder) {
            // 1. setup any properties here
            // 2. call super.init(coder:)
            super.init(coder: aDecoder)
            // 3. Setup view from .xib file
        }
    
        override func layoutSubviews() {
            super.layoutSubviews()
            self.layer.borderWidth = 1
            self.layer.masksToBounds = false
            self.layer.borderColor = UIColor.white.cgColor
            self.layer.cornerRadius = self.frame.size.width/2
            self.clipsToBounds = true
        }
    }
    
    reviewerImage.layer.cornerRadius = reviewerImage.frame.size.width / 2;
    reviewerImage.clipsToBounds = true