ios - 在 Swift 中从相机裁剪图像而无需移动到另一个 ViewController

Question

我在 CameraViewController 中有一个图像叠加层:

我想从这个红色方 block 内获取图像。我不想移动到另一个 View Controller 来设置 CropViewController，裁剪应该在这个 Controller 内完成。

后面的代码几乎可以工作，问题是从相机生成的图像是 1080x1920 而 self.cropView.bounds 是 (0,0,185,120)，当然它不代表用于拍摄图像的相同比例

extension UIImage {
    func crop(rect: CGRect) -> UIImage {
        var rect = rect
        rect.origin.x*=self.scale
        rect.origin.y*=self.scale
        rect.size.width*=self.scale
        rect.size.height*=self.scale

        let imageRef = self.cgImage!.cropping(to: rect)
        let image = UIImage(cgImage: imageRef!, scale: self.scale, orientation: self.imageOrientation)
        return image
    }
}

Answer 1

您始终可以使用调用 CIPerspectiveCorrection 的 Core Image 过滤器在视觉上裁剪四边形(四边形 - 不必是矩形)中的任何图像。

假设您有一个 414 宽 x 716 高的 imageView 框架，其中一张图像的尺寸为 1600 宽 x 900 高。 (您正在使用 .aspectFit 的内容模式，对吗？)假设您想要裁剪一个 4 边形的角 - 在 imageView 的 (X,Y) 坐标中 - 是 (50,50), (75,75) ，(100,300)和(25,200)。请注意，我按照左上角 (TL)、右上角 (TR)、右下角 (BR)、左下角 (BL) 的顺序列出了这些点。另请注意，这不是一个简单的矩形。

你需要做的是:

1. 将 UIImage 转换为 CIImage，其中“extent”是 UIImage 的大小，
2. 将这些 UIImageView 坐标转换为 CIImage 坐标，
3. 将它们和 CIImage 传递到 CIPerspectiveCorrection 过滤器进行裁剪，并且
4. 将 CIImage 输出渲染到 UIImageView 中。

下面的代码有些粗糙，但希望您能理解:

class ViewController: UIViewController {

    let uiTL = CGPoint(x: 50, y: 50)
    let uiTR = CGPoint(x: 75, y: 75)
    let uiBL = CGPoint(x: 100, y: 300)
    let uiBR = CGPoint(x: 25, y: 200)

    var ciImage:CIImage!
    var ctx:CIContext!

    @IBOutlet weak var imageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()
        ctx = CIContext(options: nil)
        ciImage = CIImage(image: imageView.image!)
    }

    override func viewWillLayoutSubviews() {
        let ciTL = createVector(createScaledPoint(uiTL))
        let ciTR = createVector(createScaledPoint(uiTR))
        let ciBR = createVector(createScaledPoint(uiBR))
        let ciBL = createVector(createScaledPoint(uiBL))
        imageView.image = doPerspectiveCorrection(CIImage(image: imageView.image!)!,
                                                  context: ctx,
                                                  topLeft: ciTL,
                                                  topRight: ciTR,
                                                  bottomRight: ciBR,
                                                  bottomLeft: ciBL)
    }
    func doPerspectiveCorrection(
        _ image:CIImage,
        context:CIContext,
        topLeft:AnyObject,
        topRight:AnyObject,
        bottomRight:AnyObject,
        bottomLeft:AnyObject)
        -> UIImage {
            let filter = CIFilter(name: "CIPerspectiveCorrection")
            filter?.setValue(topLeft, forKey: "inputTopLeft")
            filter?.setValue(topRight, forKey: "inputTopRight")
            filter?.setValue(bottomRight, forKey: "inputBottomRight")
            filter?.setValue(bottomLeft, forKey: "inputBottomLeft")
            filter!.setValue(image, forKey: kCIInputImageKey)
            let cgImage = context.createCGImage((filter?.outputImage)!, from: (filter?.outputImage!.extent)!)
            return UIImage(cgImage: cgImage!)
    }

    func createScaledPoint(_ pt:CGPoint) -> CGPoint {
        let x = (pt.x / imageView.frame.width) * ciImage.extent.width
        let y = (pt.y / imageView.frame.height) * ciImage.extent.height
        return CGPoint(x: x, y: y)
    }
    func createVector(_ point:CGPoint) -> CIVector {
        return CIVector(x: point.x, y: ciImage.extent.height - point.y)
    }
    func createPoint(_ vector:CGPoint) -> CGPoint {
        return CGPoint(x: vector.x, y: ciImage.extent.height - vector.y)
    }

}

编辑:我把它放在这里是为了解释一些事情。我们两个交换了项目，提问者的代码出现了问题，出现了 nil 返回。首先，这是更正后的代码，它应该在 cropImage() 函数中:

let ciTL = createVector(createScaledPoint(topLeft, overlay: cameraView, image: image), image: image)
let ciTR = createVector(createScaledPoint(topRight, overlay: cameraView, image: image), image: image)
let ciBR = createVector(createScaledPoint(bottomRight, overlay: cameraView, image: image), image: image)
let ciBL = createVector(createScaledPoint(bottomLeft, overlay: cameraView, image: image), image: image)

问题在于最后两行，它们通过将 bottomLeft 传递到本应位于 bottomRight 的位置进行了调换，反之亦然。 (很容易犯的错误，我也犯过!)

一些解释可以帮助那些使用 CIPerspectiveCorrection(以及其他使用 CIVectors 的过滤器)的人。

1. 一个 CIVector 可以有从 - 我认为 2 到几乎无限数量的组件。这取决于过滤器。在这种情况下，有两个分量 (X, Y)。很简单，但不同之处在于 4 个 CIVectors 描述了 CIImage 范围内的 4 个点，原点位于左下角，而不是左上角。

2. 请注意，我没有说 4 边形。你实际上可以有一个像“8 字形”的形状，其中“右下”点位于“左下”点的左侧!这将导致两条边相互交叉的形状。

3. 重要的是所有 4 个点都位于 CIImage 范围内。如果他们不这样做，过滤器将为其输出图像返回 nil。

对于那些之前没有使用过 CIImage 过滤器的人的最后一点注意 - 在您请求 outputImage 之前，过滤器不会执行。您可以实例化一个，填写参数，将它们链接起来，等等。您甚至可以在过滤器名称(或它们的任何键)中输入错误。在您的代码请求 filter.outputImage 之前，什么都不会发生。