iOS开发：UIImage裁剪未取cropView区域却取左上角的问题

问题现象 #

尝试裁剪cropView框架内的可见图像区域，裁剪后图像尺寸符合预期，但结果始终是原图像的左上角部分，更换不同比例的图像后问题依旧。

问题根源 #

1. 坐标体系不匹配：直接使用cropView相对于父视图的frame坐标，未转换到editImageView的坐标系中
2. 忽略ScrollView的偏移与缩放：未考虑UIScrollView的contentOffset和zoomScale对图像显示位置的影响
3. 缩放比例计算不完整：仅计算了图像与ImageView的缩放比，未结合ScrollView的实际缩放倍数

修复代码 #

1. 修正裁剪区域坐标计算 #

更新cropConfirmButtonTapped方法，正确转换坐标并适配ScrollView的缩放偏移：

@objc func cropConfirmButtonTapped(){
    guard let imageToCrop = editImageView.image else {
        return
    }
    
    // 将cropView的frame转换到editImageView的坐标系中
    let cropRectInImageView = editImageView.convert(cropView.frame, from: view)
    
    // 结合scrollView的缩放与偏移，计算实际裁剪区域
    let zoomScale = editImageScrollView.zoomScale
    let adjustedCropRect = CGRect(x: (cropRectInImageView.origin.x - editImageScrollView.contentOffset.x) / zoomScale,
                                  y: (cropRectInImageView.origin.y - editImageScrollView.contentOffset.y) / zoomScale,
                                  width: cropRectInImageView.size.width / zoomScale,
                                  height: cropRectInImageView.size.height / zoomScale)
    
    let croppedImage = cropImage(imageToCrop,
                                 toRect: adjustedCropRect,
                                 imageViewSize: editImageView.bounds.size,
                                 scrollViewZoomScale: zoomScale)
    
    editImageView.image = croppedImage
    editImageScrollView.zoomScale = 1
}

2. 完善裁剪方法的缩放与方向处理 #

更新cropImage方法，结合总缩放比例并处理图像方向问题：

func cropImage(_ inputImage: UIImage, toRect cropRect: CGRect, imageViewSize: CGSize, scrollViewZoomScale: CGFloat) -> UIImage? {
    // 计算图像相对于ImageView的原始缩放比例
    let imageScale = max(inputImage.size.width / imageViewSize.width, inputImage.size.height / imageViewSize.height)
    
    // 总缩放比例：图像原始缩放 × ScrollView缩放
    let totalScale = imageScale * scrollViewZoomScale
    
    // 基础裁剪区域（转换到CGImage坐标系）
    var cropZone = CGRect(x: cropRect.origin.x * totalScale,
                          y: cropRect.origin.y * totalScale,
                          width: cropRect.size.width * totalScale,
                          height: cropRect.size.height * totalScale)
    
    // 处理图像方向对裁剪区域的影响
    switch inputImage.imageOrientation {
    case .right, .rightMirrored:
        let tempX = cropZone.origin.x
        cropZone.origin.x = inputImage.size.height - cropZone.origin.y - cropZone.size.height
        cropZone.origin.y = tempX
        swap(&cropZone.size.width, &cropZone.size.height)
    case .left, .leftMirrored:
        let tempX = inputImage.size.width - cropZone.origin.x - cropZone.size.width
        cropZone.origin.x = cropZone.origin.y
        cropZone.origin.y = tempX
        swap(&cropZone.size.width, &cropZone.size.height)
    case .down, .downMirrored:
        cropZone.origin.x = inputImage.size.width - cropZone.origin.x - cropZone.size.width
        cropZone.origin.y = inputImage.size.height - cropZone.origin.y - cropZone.size.height
    default:
        break
    }
    
    guard let cutImageRef = inputImage.cgImage?.cropping(to: cropZone) else {
        return nil
    }
    
    // 保留原图像的缩放比例与方向
    let croppedImage = UIImage(cgImage: cutImageRef, scale: inputImage.scale, orientation: inputImage.imageOrientation)
    return croppedImage
}

关键说明 #

• 使用convert(_:from:)统一坐标体系，确保cropView的位置对应到ImageView中的实际区域
• 结合ScrollView的contentOffset和zoomScale调整裁剪区域，匹配图像的实际显示位置
• 处理UIImage的imageOrientation，避免因图像旋转导致裁剪区域偏移

内容的提问来源于stack exchange，提问作者Stefan Ovomate