美文网首页
Swift 绘制圆形头像

Swift 绘制圆形头像

作者: chenyu1520 | 来源:发表于2016-10-29 16:33 被阅读456次

    使用 Swift 绘制圆形头像,代码如下:

    //
    //  ViewController.swift
    //  CircleFavicon
    //
    //  Created by chenyu on 2016/10/29.
    //  Copyright © 2016年 ChenYu. All rights reserved.
    //
    
    /*
        图片原本是矩形,回执成圆形头像
    */
    
    import UIKit
    
    
    class ViewController: UIViewController {
    
        override func viewDidLoad() {
            super.viewDidLoad()
            // Do any additional setup after loading the view, typically from a nib.
            
            //第一种
            let circleFavicon1 = UIImageView.init(frame: CGRect.init(x: 100, y: 100, width: 50, height: 50))
            circleFavicon1.image = self.circleFaviconWithFromQuqrtz2D(name: "qiqi.JPG", borderWidth: 2.0, borderColor: .purple)
            
            self.view.addSubview(circleFavicon1)
            self.view.backgroundColor = UIColor.darkGray
            
            //第二种
            let circleFavicon2 = UIImageView.init(frame: CGRect.init(x: 100, y: 200, width: 50, height: 50))
            circleFavicon2.image = UIImage.init(named: "qiqi.JPG")
            self.circleFaviconFromCALayer(imageView: circleFavicon2)
            self.view.addSubview(circleFavicon2)
            
        }
    
        override func didReceiveMemoryWarning() {
            super.didReceiveMemoryWarning()
            // Dispose of any resources that can be recreated.
        }
    
        /// Swift2.3以前
        /// 使用 quartz2D 绘制圆形头像
        ///
        /// - parameter name:        图片名字
        /// - parameter borderWidth: 绘制后的图片边框
        /// - parameter borderColor: 边框颜色
        ///
        /// - returns: 绘制后的图片
        func circleFaviconWithFromQuqrtz2D(name: String, borderWidth: CGFloat, borderColor: UIColor) -> UIImage {
            
            //加载原图
            let original = UIImage.init(named: name)
            
            //开启上下文
            let imageW: CGFloat = (original?.size.width)! + 22 * borderWidth
            let imageH: CGFloat = (original?.size.height)! + 22 * borderWidth
            let imageSize = CGSize.init(width: imageW, height: imageH)
            UIGraphicsBeginImageContextWithOptions(imageSize, false, 0.0)
            
            //取得当前的上下文,这里得到的就是上面刚创建的图片上下文
            let context = UIGraphicsGetCurrentContext()
            
            //画边框(大圆)
            borderColor.set()
            let bigRadius: CGFloat = imageW * 0.5 //大圆半径
            let centerX = bigRadius //圆心
            let centerY = bigRadius //圆心
            let center = CGPoint.init(x: centerX, y: centerY)
            let endAngle = CGFloat(M_PI*2)
            
            context?.addArc(center: center, radius: bigRadius, startAngle: 0, endAngle: endAngle, clockwise: false)
            context?.fillPath()
            
            //小圆
            let smallRadius = bigRadius - borderWidth
            context?.addArc(center: center, radius: smallRadius, startAngle: 0, endAngle: endAngle, clockwise: false)
            context?.clip()
            
            //画圆
            original?.draw(in: CGRect.init(x: borderWidth, y: borderWidth, width: (original?.size.width)!, height: (original?.size.height)!))
            
            //取图
            let circleFavicon = UIGraphicsGetImageFromCurrentImageContext()
            
            //结束上下文
            UIGraphicsEndImageContext()
            
            return circleFavicon!
        }
        
        
        /// 使用 CALayer 绘制圆形头像
        ///
        /// - parameter imageView: 要被绘制的 imageView
        func circleFaviconFromCALayer(imageView: UIImageView) -> Void {
            let imageView = imageView
            imageView.layer.masksToBounds = true
            
            imageView.layer.cornerRadius = imageView.bounds.size.width * 0.5
            
            imageView.layer.borderWidth = 5.0
            
            imageView.layer.borderColor = UIColor.white.cgColor
            
        }
    
    }
    

    Swift2.3 版本的写法(写在 UIImage 的扩展中)

    /**
    
         * param: radius            圆角半径
    
         * 注意:只有当imageView.image不为nil时,调用此方法才有效果
    
         */
       func cornerRadius(bounds: CGRect ,radius:CGFloat) -> UIImage{
            
            //开始图形上下文
            UIGraphicsBeginImageContextWithOptions(CGSizeMake(bounds.size.width, bounds.size.height), false, UIScreen.mainScreen().scale)
    
            //获取图形上下文
            let ctx = UIGraphicsGetCurrentContext()
            //根据一个rect创建一个椭圆
            CGContextAddEllipseInRect(ctx!, bounds)
            //裁剪
            CGContextClip(ctx!)
            //将原照片画到图形上下文
            self.drawInRect(bounds)
            //从上下文上获取剪裁后的照片
            let newImage = UIGraphicsGetImageFromCurrentImageContext()
            //关闭上下文
            UIGraphicsEndImageContext()
            
            return newImage!
        }
    

    Swift3.0 版本,(写在 UIImageView 的扩展中)

    /**
    
         * param: radius            圆角半径
    
         * 注意:只有当imageView.image不为nil时,调用此方法才有效果
    
         */
        func cornerRadius(radius:CGFloat){
    
            //开始图形上下文
            UIGraphicsBeginImageContextWithOptions(self.bounds.size, false, UIScreen.main.scale)
            //获取图形上下文
            let ctx = UIGraphicsGetCurrentContext()
            //根据一个rect创建一个椭圆
            ctx!.addEllipse(in: self.bounds)
            //裁剪
            ctx!.clip()
            //将原照片画到图形上下文
             self.image!.draw(in: self.bounds)
            //从上下文上获取剪裁后的照片
            let newImage = UIGraphicsGetImageFromCurrentImageContext()
            //关闭上下文
            UIGraphicsEndImageContext()
    
            self.image = newImage
        }
    }
    

    Swift 一版一点变化,有小变化也有大变化,真的要哭了。。。。

    相关文章

      网友评论

          本文标题:Swift 绘制圆形头像

          本文链接:https://www.haomeiwen.com/subject/exjyuttx.html