Swift - 截图功能的实现2（使用SwViewCapture库实现滚动视图的截屏）

作者：hangge | 2018-07-11 08:10

虽然上文中我们通过扩展实现了将任意 UIView 转为 UIImage，但对于一些滚动视图的支持还不够好。比如下面这种情况，我们对包含有 20 条数据的 tableView 进行截图：

可以发现我们截取出来的只是 tableView 当前的可视区域，无法将整个滚动视图（所有内容）都截下来。下面我介绍一个第三方截图库：SwViewCapture，可以完美地解决这个问题。

一、SwViewCapture 的说明与配置

1，什么是 SwViewCapture

SwViewCapture 是一个十分好用的 iOS 截图库，它除了支持截取普通视图外，还支持截取网页以及 ScrollView 的所有内容。

2，功能特点

适用于所有 ScrollView 组成的视图：UIScrollView, UITableView, UIWebView 等
对 WKWebView 支持也比较完美：提供了两种截图方法，且非滚动的截图方式已经解决了 position: fixed 的问题
截图过程中不会出现视图闪烁：截图过程中，使用一张伪装截图遮盖屏幕，底层截图活动不透明化。

3，安装配置

（1）从 GitHub 上下载最新的代码：https://github.com/startry/SwViewCapture

（2）将下载下来的源码包中 SwViewCapture.xcodeproj 拖拽至你的工程中。

（3）工程 -> General -> Embedded Binaries 项，把 framework 添加进来：SwViewCapture.framework

（4）最后，在需要使用 SwViewCapture 的地方 import 进来就可以了。

import SwViewCapture

二、使用样例

1，普通截屏

（1）这个功能和我前文是一样的，对整个屏幕进行截屏（截取出来的图片尺寸也是屏幕大小）。

（2）样例代码

import UIKit
import SwViewCapture

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    //表格
    @IBOutlet weak var tableView: UITableView!
    
    //用于显示截屏后的图片
    @IBOutlet weak var imageView: UIImageView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    
    //tableview数据行数
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int)
        -> Int {
        return 20
    }

    //tableview单元格内容
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath)
        -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell")
        cell?.textLabel?.text = "条目 \((indexPath as NSIndexPath).row)"
        return cell!
    }
    
    //对整个屏幕进行截图
    @IBAction func buttonTapped1(_ sender: Any) {
        //普通截屏
        UIApplication.shared.keyWindow!.swCapture { (capturedImage) -> Void in
            self.imageView.image = capturedImage
        }
    }
}

2，内容截屏

（1）这里对表格内容进行截屏，它将截取出表格的所有内容（截取出来的图片尺寸则为表格全部内容的大小）。

（2）样例代码

import UIKit
import SwViewCapture

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    //表格
    @IBOutlet weak var tableView: UITableView!
    
    //用于显示截屏后的图片
    @IBOutlet weak var imageView: UIImageView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    
    //tableview数据行数
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int)
        -> Int {
        return 20
    }

    //tableview单元格内容
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath)
        -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell")
        cell?.textLabel?.text = "条目 \((indexPath as NSIndexPath).row)"
        return cell!
    }
    
    //对tableview内容进行截图
    @IBAction func buttonTapped1(_ sender: Any) {
        //内容截屏
        self.tableView.swContentCapture { (capturedImage) -> Void in
            self.imageView.image = capturedImage
        }
    }
}

3，滚动截屏

要截取滚动视图的内容，除了使用上面的内容截屏方法外（swContentCapture），还可以使用滚动截屏方法（swContentScrollCapture），它两内部实现机制不同，但最终效果是一样的。

//对tableview内容进行截图
@IBAction func buttonTapped1(_ sender: Any) {
    //滚动截屏（同样可以截出所有内容）
    self.tableView.swContentScrollCapture { (capturedImage) -> Void in
        self.imageView.image = capturedImage
    }
}

附：截屏并保存到系统相册中

（1）如果想把截图保存到相机胶卷中，直接使用 UIImageWriteToSavedPhotosAlbum() 方法即可：

//对tableview内容进行截图
@IBAction func buttonTapped1(_ sender: Any) {
    //滚动截屏（同样可以截出所有内容）
    self.tableView.swContentScrollCapture { (capturedImage) -> Void in
        //将截图保存到相机胶卷中
        UIImageWriteToSavedPhotosAlbum(capturedImage!, nil, nil, nil)
    }
}

（2）当然也可以使用 PhotoKit 来保存，具体可以参考我之前写的这篇文章：

Swift - 保存图片到系统相册（相机胶卷），并获取存放路径、缩略图