Skip to content

Instantly share code, notes, and snippets.

@hsjunnesson
Created September 16, 2014 17:03
Show Gist options
  • Save hsjunnesson/9e07291b7ccd35cea269 to your computer and use it in GitHub Desktop.
Save hsjunnesson/9e07291b7ccd35cea269 to your computer and use it in GitHub Desktop.
CirclePhotoView.playground
// Playground - noun: a place where people can play
import UIKit
import QuartzCore
@IBDesignable
public class CirclePhotoView: UIView {
@IBInspectable public var image: UIImage?
lazy var circleLayer: CAShapeLayer = CAShapeLayer()
lazy var imageLayer: CALayer = CALayer()
override public func layoutSubviews() {
super.layoutSubviews()
// Add to super layer if not present
if circleLayer.superlayer == nil {
layer.addSublayer(circleLayer)
}
if imageLayer.superlayer == nil {
layer.insertSublayer(imageLayer, above: circleLayer)
}
// Update circle
circleLayer.path = CGPathCreateWithEllipseInRect(bounds, nil)
circleLayer.fillColor = UIColor.lightGrayColor().CGColor
// Update image
let inset = CGRectInset(bounds, 5, 5)
imageLayer.frame = inset
if let image = self.image {
let maskedImage = maskImage(image, size: bounds.size)
imageLayer.contents = maskedImage.CGImage
imageLayer.backgroundColor = UIColor.clearColor().CGColor
} else {
imageLayer.contents = nil
imageLayer.backgroundColor = UIColor.whiteColor().CGColor
}
}
// Mask an image in a circle
func maskImage(image: UIImage, size: CGSize) -> UIImage {
UIGraphicsBeginImageContext(size)
let context = UIGraphicsGetCurrentContext()
let rect = CGRectMake(0, 0, size.width, size.height)
let path = CGPathCreateWithEllipseInRect(rect, nil)
CGContextAddPath(context, path)
CGContextClip(context)
image.drawInRect(rect)
let maskedImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return maskedImage
}
}
let view = CirclePhotoView(frame: CGRectMake(0, 0, 100, 100))
view.image = UIImage(named: "avatar.jpg")
view.setNeedsLayout()
view
@hsjunnesson
Copy link
Author

In order to get that avatar.jpg in there, it needs to be in the Resources folder of the playground (right-click select "Show Package Contents")

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment