Vision 是 Apple 在 WWDC 2017 推出的图像识别框架，它基于 Core ML。在这里，我们利用其中的面部识别功能来检测一张照片中的人物面部，如果没有检测到面部那么弹出 Alert 提示用户检测失败。关于 Vision 框架的概述和基本使用步骤见Vision 概览。
在开始前，我们先使用 Xcode 9 创建一个新的工程，名字随意～
我们先简单的规划一下所需要的功能：
- 在 UIImagePickerController 中获取相册图片
- 获取图片之后立即检测面部信息
- 如果没有检测成功，弹出 Alert 提示检测失败
- 如果检测成功，利用提供的数据在图形上下文（CGContext）中绘制矩形框
- 所有业务都在默认的 ViewController 中完成
哟西，让我们来一步一步地实现吧！
1.首先，我们需要几个全局属性
// 存放 request 的数组
var request = [VNRequest]()
// 图片选择器
let imagePicker = UIImagePickerController()
// 将最终合成的图片放在这个 ImageView 中显示
var detectImageView = UIImageView()
// 准备处理的图片
var detectImage: UIImage?
// 获得屏幕尺寸的计算属性
var screenSize: CGSize {
return UIScreen.main.bounds.size
}
另外，我们需要让 ViewController 遵循这两个协议：
- UIImagePickerControllerDelegate
- UINavigationControllerDelegate
并且在 AppDelegate 中设置导航控制器（UINavigationController）为根控制器，ViewController 为导航控制器的根视图：
let rootVC = ViewController()
let navigationVC = UINavigationController(rootViewController: rootVC)
window?.rootViewController = navigationVC
2.初始化各种控制器、视图和 Request
我们在 viewDidLoad 中做一些初始化工作：
detectImageView.frame = CGRect(x: 0, y: 0, width: screenSize.width, height: screenSize.height)
detectImageView.contentMode = .scaleAspectFit
// CGContext 渲染出来的图片会倒置，在这里直接把 view 再反转一次就好了
detectImageView.layer.transform = CATransform3DMakeRotation(CGFloat.pi, 1, 0, 0)
self.view.addSubview(detectImageView)
// 设置 imagePicker 的类型和代理
imagePicker.sourceType = .photoLibrary
imagePicker.delegate = self
// 给导航栏添加一个按钮，pickImage(sender:) 方法一会儿会讲到
self.navigationItem.setRightBarButton(UIBarButtonItem(title: "Photo",
style: .done,
target: self,
action: #selector(ViewController.pickImage(sender:))),
animated: false)
// 重要！
// 创建 VNDetectFaceLandmarksRequest，在这里把 Handler 单独抽成一个方法了，比起闭包更易读，下面就会讲到这个方法
let faceLandmarks = VNDetectFaceLandmarksRequest(completionHandler: self.faceLandmarksHandler)
request = [faceLandmarks]
3.实现 imagePicker 的代理方法并处理返回的图片
// 这个方法就是导航栏按钮对应的 target action
@objc func pickImage(sender: UIButton) {
self.present(imagePicker, animated: true, completion: nil)
}
func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
// Did cancel pick image
self.dismiss(animated: true, completion: nil)
}
func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
// 如何使用 info 这个字典这里就不说了，不熟悉的可以查查资料，这里的重点在下面～
guard let image = info[UIImagePickerControllerOriginalImage] as? UIImage else { return }
self.dismiss(animated: true, completion: nil)
self.detectImage = image
// 我们在最开始创建了 request，那么这里就创建 requestHandler
// 在 handler 创建之后，就调用 perform(_:) 方法执行 request
let faceLandmarksHandler = VNImageRequestHandler(cgImage: (self.detectImage?.cgImage)!, options: [:])
do {
try faceLandmarksHandler.perform(self.request)
} catch {
print(error)
}
}
4.现在我们有了入口，有了图片，剩下的就是完成数据的分析和使用
首先是刚才被抽出来的闭包，写成方法就应该是这样：
func faceLandmarksHandler(request: VNRequest, error: Error?) {
DispatchQueue.main.async {
self.observation(request.results as! [VNFaceObservation])
}
}
为了提高性能我们就在主线程里异步完成了 observation 的调用，observation 作为整个流程的核心步骤，将完成剩下所有的任务：
func observation(_ observation: [VNFaceObservation]) {
// 这里就完成了面部识别成功与否的检查，原因：
// landmarks 属性有两种情况为 nil，一是我们使用 VNDetectFaceRectanglesRequest 时，二是没有检测到面部时
guard let img = detectImage, let _ = observation.first?.landmarks else {
DispatchQueue.main.async {
let alert = UIAlertController(title: "Detect failed", message: "Invalid face bounding", preferredStyle: .alert)
let action = UIAlertAction(title: "OK", style: .cancel, handler: nil)
alert.addAction(action)
self.present(alert, animated: true, completion: nil)
}
return
}
// 由于图片在 imageView 中以适应（fit）方式填充，所以会有比例缩放
// 这里就需要计算这个比例是多少，为什么需要这个比例请看下方
let imageScale: CGFloat = screenSize.width/img.size.width
var s = img.size
s.width *= imageScale
s.height *= imageScale
// 开启一个位图上下文
// 如果说没有刚才的比例值，在这里直接引用图片的 size，那么位图上下文就会过大或过小，最终导致我们绘制的矩形框产生位置偏移
UIGraphicsBeginImageContextWithOptions(CGSize(width: screenSize.width, height: img.size.height*imageScale), false, 1)
// 开启图形上下文
let context = UIGraphicsGetCurrentContext()
// 绘制矩形框的方法，实现请往后看
detectImageView.image = faceBoundingBox(img: img,
imageScale: imageScale,
observation: observation,
graphicsContext: context)
// 关闭位图上下文
UIGraphicsEndImageContext()
}
利用图形上下文绘制矩形框，然后在位图上下文中渲染成可供显示的 image：
private func faceBoundingBox(img: UIImage, imageScale: CGFloat, observation: [VNFaceObservation], graphicsContext: CGContext?) -> UIImage? {
// 这里同样需要一个比例，来让图片渲染正确
var s = img.size
s.width *= imageScale
s.height *= imageScale
graphicsContext?.draw(img.cgImage!, in: CGRect(x: 0, y: 0, width: screenSize.width, height: img.size.height*imageScale))
// 这里的 scaled 是一个 CGRect 的扩展（extension），具体实现可以从完整代码中找到，完整代码下载见本篇最后
graphicsContext?.addRect((observation.first?.boundingBox)!.scaled(to: s))
graphicsContext?.setLineWidth(0.8)
graphicsContext?.setStrokeColor(UIColor.green.cgColor)
graphicsContext?.strokePath()
// 从现有的上下文堆栈中生成一张 UIImage 图片
let image = UIGraphicsGetImageFromCurrentImageContext()
return image
}
OK，至此你应该会有一个能够检测照片人脸的小 Demo 了～
Demo 中有很多没有详细解释的东西，比如 UIImagePickerController 的具体用法，CGContext 的具体用法等，因为不在本篇主要内容的范围内，所以不做太多提及，如果这方面有疑问可以查查百度，或者来问我也行，大家一起共同交流 (//∇//)\
Demo 完整代码和效果图在 GitHub 上可以看到。
