Introduction

Setting a corner radius on a UIImageView is mostly a CALayer task. The radius itself is easy to set, but the visual effect only appears correctly when clipping is enabled and the radius is applied at the right point in the view's layout lifecycle. That is why this simple-looking change often behaves inconsistently at first.

The Basic UIImageView Corner Radius Setup

Every UIView, including UIImageView, is backed by a layer. To round the corners, set cornerRadius on that layer and enable clipping.

1import UIKit
2
3final class ViewController: UIViewController {
4    let imageView = UIImageView(image: UIImage(systemName: "person.fill"))
5
6    override func viewDidLoad() {
7        super.viewDidLoad()
8        view.backgroundColor = .systemBackground
9
10        imageView.frame = CGRect(x: 40, y: 100, width: 120, height: 120)
11        imageView.contentMode = .scaleAspectFill
12        imageView.layer.cornerRadius = 16
13        imageView.clipsToBounds = true
14
15        view.addSubview(imageView)
16    }
17}

Without clipsToBounds = true, the image content still draws outside the rounded corners, so the radius may appear not to work.

Circular Images Need Layout-Aware Radius

If you want a perfect circle, the corner radius should be half the view's width or height. That means the final size must already be known.

1override func viewDidLayoutSubviews() {
2    super.viewDidLayoutSubviews()
3    imageView.layer.cornerRadius = imageView.bounds.width / 2
4}

This is more reliable than setting the radius too early in viewDidLoad when Auto Layout may not have sized the image view yet.

Storyboard and Interface Builder Option

If the image view is created in Interface Builder, you can still set the radius in code after outlets are connected.

1@IBOutlet weak var avatarImageView: UIImageView!
2
3override func viewDidLayoutSubviews() {
4    super.viewDidLayoutSubviews()
5    avatarImageView.layer.cornerRadius = 12
6    avatarImageView.clipsToBounds = true
7}

This keeps the view structure in the storyboard while ensuring the rounded effect uses the final layout size.

Add Borders and Shadows Carefully

Rounded corners often come together with borders or shadows. Borders are easy because they belong to the same layer.

1imageView.layer.cornerRadius = 16
2imageView.layer.borderWidth = 2
3imageView.layer.borderColor = UIColor.systemBlue.cgColor
4imageView.clipsToBounds = true

Shadows are different. If you enable clipsToBounds, the shadow gets clipped too. A common solution is to place the image view inside a container view: the container draws the shadow, and the image view clips the image.

That separation avoids fighting layer behavior.

Performance and Reuse Considerations

Rounded corners are cheap in normal UI work, but repeated layer styling across many list cells should still be centralized. A helper method or custom image view subclass keeps the style consistent.

1extension UIImageView {
2    func applyRoundedStyle(radius: CGFloat) {
3        layer.cornerRadius = radius
4        clipsToBounds = true
5        contentMode = .scaleAspectFill
6    }
7}

Then use avatarImageView.applyRoundedStyle(radius: 12) instead of repeating the same setup throughout the codebase.

Layout Timing Matters

If Auto Layout controls the image view size, apply circle-style radii after the final bounds are known. Setting bounds.width / 2 too early usually works only by accident in static layouts. Putting the radius update in viewDidLayoutSubviews or a custom view layout pass makes the result predictable.

Common Pitfalls

• Setting cornerRadius but forgetting clipsToBounds or layer.masksToBounds.
• Calculating a circular radius before Auto Layout has given the image view its final size.
• Expecting shadows to remain visible on the same view that clips its contents.
• Applying corner radius to the wrong view in a nested hierarchy.
• Repeating the same layer styling logic everywhere instead of centralizing it.

Summary

• Set layer.cornerRadius on the image view's layer.
• Enable clipping so the image content respects the rounded corners.
• For circles, compute the radius after layout using half the final width.
• Use a container view if you also need visible shadows.
• Centralize repeated image styling to keep UI code cleaner and more consistent.