前言

在做的項目里要用到一個掃描識別框，查找資料后發(fā)現(xiàn)可以用貝塞爾曲線畫一個，在此記錄下常用方法，以供后面使用

正文

關(guān)于UIBezierPath的一些簡單知識儲備

UIBezuerPath封裝在UIKit中，是Core Graphics框架關(guān)于path的一個封裝，使用此類可以定義簡單的形狀，比如我們常用到，矩形，圓形，橢圓，弧，或者不規(guī)則的多邊形。

CAShapeLayer屬于QuartzCore框架，繼承自CALayer。CAShapeLayer是在坐標系內(nèi)繪制貝塞爾曲線的，通過繪制貝塞爾曲線，設(shè)置shape(形狀)的path(路徑)，從而繪制各種各樣的圖形以及不規(guī)則圖形。因此，使用CAShapeLayer需要與UIBezierPath一起使用。
UIBezierPath類允許你在自定義的 View 中繪制和渲染由直線和曲線組成的路徑.。你可以在初始化的時候直接為你的UIBezierPath指定一個幾何圖形。
作者：施憶
鏈接：http://www.itdecent.cn/p/139f4fbe7b6b
來源：簡書

在iOS開發(fā)中，處理的一個又一個UIView，實際是在操作CALayer。那么為什么不直接對CALayer進行編程呢？那是因為CALayer繼承自NSObject，主要是用于圖層的處理以及動畫，而UIView繼承自UIResponder，可以處理交互事件。
由此，可以認為UIView就是對CALayer的一個簡單封裝，圖像繪制、動畫都是CALayer做的。有過開發(fā)經(jīng)驗的朋友都知道，蘋果在UIView里面封裝了一套動畫接口，但是利用這些接口，只是可以做一些簡單、不靈活的動畫。如果想在底層做一些改變，想實現(xiàn)一些特別的動畫，這是學會掌控Core Animation以外，別無他選。（摘自網(wǎng)絡(luò)）

• 通俗點就是UIBezierPath用來指定繪制圖形路徑，而CAShapeLayer就是根據(jù)路徑來繪圖的。

• 我們這次要做的一個簡單的掃描識別框就是用此方法來畫的，效果如圖

  
  
  selectArea.png

UIBezierPath的基本使用

• let path = UIBezierPath() 創(chuàng)建 UIBezierPath對象
• path.move(to: CGPoint(x: , y: ))設(shè)置起始點
• path.addLine(to: CGPoint(x: , y: ))向目標點畫線
• let shapeLayer = CAShapeLayer()
• shapeLayer.path = path.cgPath 存入UIBezierPath的路徑準備畫圖
• 配置工作

shapeLayer.lineWidth = 2  //設(shè)置路徑線的寬度
shapeLayer.strokeColor = UIColor.blue.cgColor //路徑顏色
self.view.layer.addSublayer(shapeLayer)

• 完整代碼

 let path = UIBezierPath()
 path.move(to: CGPoint(x: WIDTH/2-100, y:100+20))
 path.addLine(to: CGPoint(x: WIDTH/2-100, y:100))
 path.addLine(to: CGPoint(x: WIDTH/2-40, y:100))
       
 path.move(to: CGPoint(x: WIDTH/2+40, y: 100))
 path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100))
 path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100+20))
        
 path.move(to: CGPoint(x: WIDTH/2+100, y: 100+30))
 path.addLine(to: CGPoint(x: WIDTH/2+100, y: 100+50))
 path.addLine(to: CGPoint(x:  WIDTH/2+40, y: 100+50))
        
 path.move(to: CGPoint(x:  WIDTH/2-40, y: 100+50))
 path.addLine(to: CGPoint(x:  WIDTH/2-100, y: 100+50))
 path.addLine(to: CGPoint(x: WIDTH/2-100, y: 100+30))
        
 path.move(to: CGPoint(x: WIDTH/2,y: 115))
 path.addLine(to: CGPoint(x: WIDTH/2,y: 135))
 path.move(to: CGPoint(x: WIDTH/2-10,y: 125))
 path.addLine(to: CGPoint(x: WIDTH/2+10,y: 125))
        
 let shapeLayer = CAShapeLayer()
 shapeLayer.path = path.cgPath //存入UIBezierPath的路徑
 shapeLayer.fillColor = nil //設(shè)置填充色
 shapeLayer.lineWidth = 2  //設(shè)置路徑線的寬度
 shapeLayer.strokeColor = UIColor.blue.cgColor //路徑顏色
 self.view.layer.addSublayer(shapeLayer)

• 注意

1. 不要忘了將上述代碼加入到viewDidLoad中

override func viewDidLoad() {
        super.viewDidLoad()
        // 加入你的畫圖代碼
 }

2. 和上一篇文章中一樣用以下代碼獲取設(shè)備屏幕尺寸

let WIDTH = UIScreen.main.bounds.size.width
let HEIGHT = UIScreen.main.bounds.size.height

總結(jié)

UIBezierPath還可以用來畫很多圖形，如果不是要定義特定功能的識別框比如掃描二維碼，都可以用此方法來畫圖，可以省事一點，它還可以定義許多簡單的形狀，比如我們常用到，矩形，圓形，橢圓，弧，或者不規(guī)則的多邊形。
感興趣的可以參考這篇教程UIBezierPath教程