not able to prepare circular imageview using swift 2 in ios app for iPad

Question

I am trying to load a circular imageview in my ios app. I have tried all the combinations that has been listed in stack-overflow, but i still get the same error. I tried every mentioned step over here How to set imageView in circle like imageContacts in Swift correctly?

What I have done is this

I have created an image view in my storyboard - with height=300, width=300, view mode = aspect fit.
I defined constraint to place the image view at the horizontal and vertical center. Also defined trailing from top and right edge

The 4 constraint are as follows

i. ImageView.centerY = centreY
ii.ImageView.centerY = centreY
iii. ImageView.top = TopLayoutGUide.bottom + 103
iv. trailingMargin = ImageView.trailing + 125

In my controller file I have `declared and IBOutlet for imageview as
```
@IBOutlet var imageView: UIImageView! 
```

In my controller file I have used the following piece of code to make it circular

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

I am however, getting an oval shaped image view.

height and width are both set as 300 in storyboard. Does that not make it a square. Do I need to do anything else to make it a square? — BKSingh, Jul 05 '16 at 20:19
I do see that imageview is a retanglular oval and not a sqaure. Any idea how to set it as a square- circular — BKSingh, Jul 05 '16 at 20:21

score 0 · Accepted Answer · answered Jul 05 '16 at 20:28

Try this:

@IBOutlet var imageView: UIImageView! {
    didSet {
        imageView.layer.borderColor = UIColor.grayColor().CGColor
        imageView.layer.cornerRadius = imageView.frame.width/2
        imageView.clipsToBounds = true
        imageView.layer.borderWidth = 0.5
    }
}

And if you want you can just set clipsToBounds in storyboard instead of using it here.

Depending on when you're calling that circularImage function you wrote, the frame on the image might not be right yet.

If this doesn't fix the issue, you probably have some constraint troubles - make sure height and width are high priority and consider deleting the top & right constraints if you're using center horizontal and vertical.

I removed the trailing and top constraints and it worked. – BKSingh Jul 05 '16 at 20:34 — BKSingh, Jul 05 '16 at 20:34

not able to prepare circular imageview using swift 2 in ios app for iPad

1 Answers1