- mask
CALayer的頭文件關于mask的說明,mask實際上layer內容的一個遮罩,如果我們把mask是透明的,實際看到的layer是完全透明的,
也就是說只有mask的內容不透明的部分和layer疊加的部分才會顯示出來
實例一:利用mask 實現(xiàn) 圖片圓角

效果圖.png
- 定義分類 UIView + Circle
import UIKit
extension UIView{
func circleMaskView(arcCenter: CGPoint? = nil, radius: CGFloat? = nil) -> UIView {
// 創(chuàng)建遮罩
let center = (arcCenter != nil) ? arcCenter : self.center
let radiusNum = (radius != nil) ? radius : (self.frame.size.width>self.frame.size.height ? self.frame.size.width/2 : self.frame.size.height/2)
let path = UIBezierPath(arcCenter: center!, radius: radiusNum!, startAngle: 0, endAngle: 2 * CGFloat(M_PI), clockwise: true)
let shapeLayer = CAShapeLayer()
shapeLayer.path = path.CGPath
// 設置 遮罩
self.layer.mask = shapeLayer
return self
}
}
- 使用:
import UIKit
class DemoViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.whiteColor()
// 用戶頭像
let img = UIImageView(image: UIImage(named: "personIcon"))
img.circleMaskView(nil, radius: 40)
// 添加用戶頭像 到視圖 中
self.view.addSubview(img)
img.center = self.view.center
}
}
實例二:放大效果

效果圖.gif
-
資源圖片:maskimg@2x.png
maskimg@2x.png
import UIKit
class ViewController: UIViewController{
//MARK: - lazy
/// 背景圖片
let bg = UIImageView(image: UIImage(named: "bg_splash_storke"))
/// 遮罩
// 這里 我 使用 Image作為 遮罩層內容, 當然,你也可以 使用 CAShapeLayer 結合 CGPath 設置 復雜的 路徑
lazy var bgMaskLayer: CALayer = {
let layer = CALayer()
layer.contents = UIImage(named: "maskimg")!.CGImage
layer.position = self.view.center
layer.bounds = CGRect(x: 0, y: 0, width: 100, height:100)
return layer
}()
/// 關鍵幀 動畫 對象
lazy var anim: CAKeyframeAnimation = {
let anim = CAKeyframeAnimation(keyPath: "bounds")
anim.delegate = self
anim.duration = 1
anim.beginTime = CACurrentMediaTime() + 0.5
// 先縮小后變大
let begin_bounds = NSValue(CGRect: self.bg.layer.mask!.bounds)
let middle_bounds = NSValue(CGRect:CGRect(x: 0, y: 0, width: 50, height: 50))
let final_bounds = NSValue(CGRect:CGRect(x: 0, y: 0, width: self.view.frame.size.width*4, height: self.view.frame.size.width*4))
anim.values = [begin_bounds, middle_bounds, final_bounds]
// 每個value 發(fā)生時的時間結點 執(zhí)行動畫時間
anim.keyTimes = [0, 0.2,1]
// bounds 動畫兩次 begin_bounds -> middle_bounds -> final_bounds,所以設置了兩個時間函數(shù)
anim.timingFunctions = [CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut), CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut)] // // EaseInEaseOut 慢進慢出 , EaseOut 快進慢出 , EaseIn 慢進快出
anim.removedOnCompletion = false // 動畫結束后不移除
anim.fillMode = kCAFillModeForwards // KCAFillModeForwards: 當動畫結束后,layer會一直保持著動畫最后的狀態(tài)。
return anim
}()
//MARK: - view 聲明周期
override func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.greenColor()
self.view.addSubview(bg)
bg.frame = self.view.bounds
self.bg.layer.mask = bgMaskLayer // 給 bg視圖,設置遮罩層
}
override func viewWillAppear(animated: Bool) {
super.viewWillAppear(animated)
//執(zhí)行 關鍵幀 動畫 CAKeyframeAnimation 修改bounds 實現(xiàn) 相應 的 動畫效果
self.bg.layer.mask!.addAnimation(self.anim, forKey: "maskAnima")
}
}
