UIImageの角を丸くするExtension [swift2.2] [UIImage] [CGContextClipToMask]
UIImageの角を丸くしたいと思います。
ネットでザクッと検索をかけると、UIImageViewのCALayer -> cornerRadiusをイジイジすることで実現する方法が多かったのですが、UIImage自体で角を丸くする方法はあんまり出てこなかったので。
とは言いながらやはりネットの記事を参考にしました。(Objective-Cでしたが)
今回はこのページを参考に、swift用いて実現したUIImageのExtentionを備忘録として残しておこうと思います。
実現方法
- まずUIBezierPath.init(roundedRect rect: CGRect, cornerRadius: CGFloat)を使用して角が丸いRectを作成します。
- 手順1で作成した角丸Rectを青で塗りつぶします。ここで青で塗りつぶされていない部分がマスクになります。
- CGContextClipToMask(c: CGContext?, _ rect: CGRect, _ mask: CGImage?)で手順2で作成したマスクを適応します。
- drawInRectやdrawAtPointなどで元イメージのDrawを実行します。
ソースは以下に貼っておきます
import UIKit extension UIImage { func imageWithCornerRadius(cornerRadius: CGFloat) -> UIImage{ var imageBounds: CGRect let scaleForDisplay = UIScreen.mainScreen().scale //1ポイント当たり何ピクセルか let cornerRadius = cornerRadius * scaleForDisplay //ポイントからピクセルへの変換 imageBounds = CGRectMake(0, 0, self.size.height, self.size.height) //角丸のマスクを作成する let path = UIBezierPath.init(roundedRect: imageBounds, cornerRadius: cornerRadius) UIGraphicsBeginImageContextWithOptions(path.bounds.size, false, 0.0) let fillColor = UIColor.blueColor() fillColor.setFill() path.fill() let maskImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() //元イメージにマスクをかける UIGraphicsBeginImageContextWithOptions(path.bounds.size, false, 0.0) let context = UIGraphicsGetCurrentContext() CGContextClipToMask(context, imageBounds, maskImage.CGImage) self.drawAtPoint(CGPointZero) let resultImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return resultImage } }