在iOS swift中旋转和混合图像

Question

如何获得与下方图像混合并围绕其中心旋转的图像？

我试图显示与该图像下面的任何视图混合的图像。在我的应用程序中，用户可以移动，展开和旋转正在混合的图像。

要做到这一点，我有一个主imageView，并在顶部一个较小的imageview用于混合。混合imageview图像属性会在每次位置更改时更新。

只要图像不旋转，图像的混合就可以正常工作，一旦旋转改变，我的功能返回的图像就不在正确的位置。

我尝试过2个不同版本的相同功能。

版本1：updateBlendingView

创建具有混合imageview大小的上下文
在偏移处绘制主imageview，以便上下文位于混合imageview的位置。
将上下文移动到其中心
将上下文旋转到混合图像视图的旋转
使用blendMode绘制混合imageview
从上下文获取图像并更新imageview

版本2：updateBlendingView2

创建具有混合imageview大小的上下文
将背景移到其中心
反向旋转上下文
在距离中心偏移处绘制主图像视图
撤消旋转
绘制混合视图，使其偏离上下文的原点
从上下文中获取图像并更新混合图像视图

目前的结果：

预期结果：

注意：请记住草图中混合的强度可能与应用程序不同，但问题不在于，是关于图像定位:)

func updateBlendingView() {

    guard let mainViewImage = getImageFromView(view: mainImageView) else {return}

    // Reset image to original state before blending
    blendingImageView.image = UIImage(named: "square")!
    guard let blendingImage = getImageFromView(view: blendingImageView) else {return}

    UIGraphicsBeginImageContextWithOptions(blendingImageView.bounds.size, true, UIScreen.main.scale)
    guard let context = UIGraphicsGetCurrentContext() else { UIGraphicsEndImageContext();return}

    let blendingOriginTransform = CGAffineTransform(translationX: (blendingImageView.bounds.width * 0.5), y: (blendingImageView.bounds.height * 0.5))

    let radians:Float = atan2f(Float(blendingImageView.transform.b), Float(blendingImageView.transform.a))
    let rotateTransform: CGAffineTransform = CGAffineTransform(rotationAngle: CGFloat(radians))

    let mainViewOrigin = CGPoint(x: -blendingImageView.frame.origin.x , y: -blendingImageView.frame.origin.y )
    mainViewImage.draw(at: mainViewOrigin)

    context.concatenate(blendingOriginTransform)
    context.concatenate(rotateTransform)


    let blendingDrawingOrigin = CGPoint(x: -blendingImageView.bounds.width * 0.5, y: -blendingImageView.bounds.height * 0.5)
    blendingImage.draw(at: blendingDrawingOrigin, blendMode: .multiply , alpha: 0.5)

    guard let blendedImage = UIGraphicsGetImageFromCurrentImageContext() else {
        UIGraphicsEndImageContext()
        return
    }

    UIGraphicsEndImageContext()

    blendingImageView.image = blendedImage
}

func updateBlendingView2() {

    guard let mainViewImage = getImageFromView(view: mainImageView) else {return}

    // Reset image to original state before blending
    blendingImageView.image = UIImage(named: "square")!
    guard let blendingImage = getImageFromView(view: blendingImageView) else {return}

    UIGraphicsBeginImageContextWithOptions(blendingImageView.bounds.size, true, UIScreen.main.scale)
    guard let context = UIGraphicsGetCurrentContext() else { UIGraphicsEndImageContext();return}

    let blendingOriginTransform = CGAffineTransform(translationX: (blendingImageView.bounds.width * 0.5), y: (blendingImageView.bounds.height * 0.5))

    let radians:Float = atan2f(Float(blendingImageView.transform.b), Float(blendingImageView.transform.a))
    let rotateTransform: CGAffineTransform = CGAffineTransform(rotationAngle: CGFloat(radians))

    context.concatenate(blendingOriginTransform)
    context.concatenate(rotateTransform.inverted())

    let mainViewOrigin = CGPoint(x: -blendingImageView.frame.origin.x - (blendingImageView.bounds.width * 0.5) , y: -blendingImageView.frame.origin.y - (blendingImageView.bounds.height * 0.5))
    mainViewImage.draw(at: mainViewOrigin)

    // undo the rotate
    context.concatenate(rotateTransform)

    let blendingDrawingOrigin = CGPoint(x: -blendingImageView.bounds.width * 0.5, y: -blendingImageView.bounds.height * 0.5)
    blendingImage.draw(at: blendingDrawingOrigin, blendMode: .multiply , alpha: 0.5)

    guard let blendedImage = UIGraphicsGetImageFromCurrentImageContext() else {
        UIGraphicsEndImageContext()
        return
    }

    UIGraphicsEndImageContext()
    blendingImageView.image = blendedImage
}

func getImageFromView(view: UIView) -> UIImage? {
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, true, UIScreen.main.scale)
    guard let context = UIGraphicsGetCurrentContext() else { UIGraphicsEndImageContext();return nil}
    view.layer.render(in: context)
    let snapshotImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return snapshotImage
}

任何帮助将不胜感激，非常感谢。你可以在这个链接https://github.com/Gregortega/BlendDemo找到一个小的演示项目来说明这个问题

我还研究了不同的核心图形教程来理解这个问题。 Swift: Translating and Rotating a CGContext, A Visual Explanation (iOS/Xcode)