裁剪UIImage并保持原宽高比：iOS图片编辑保存异常求助

兄弟，我太懂这个痛点了！用UIImageView的scaleAspectFill显示图片，编辑完保存要么位置跑偏，要么尺寸缩水，简直是iOS图片编辑的经典坑。我来给你拆解下问题根源和具体解决方案：

首先得搞懂scaleAspectFill的特性：它会保持图片的宽高比，然后放大/缩小图片直到完全填充UIImageView的边界——这意味着图片的某一部分会被UIImageView裁剪掉。你在UIImageView上编辑的坐标是相对于视图本身的，但原始图片的尺寸和显示区域不匹配，直接裁剪肯定会出现位置偏差。而保存后尺寸过小，大概率是你不小心用了UIImageView的尺寸来生成图片，而非原始图片的实际尺寸。

核心思路是：把UIImageView上的编辑坐标，转换为原始图片上的对应坐标，再进行裁剪。具体步骤如下：

1. 计算图片的实际缩放比例：scaleAspectFill会取宽、高缩放比例中的较大值，确保图片填满视图：

   let imageSize = originalImage.size
   let viewSize = imageView.bounds.size
   let scaleX = viewSize.width / imageSize.width
   let scaleY = viewSize.height / imageSize.height
   let scale = max(scaleX, scaleY)
   

2. 计算图片在视图中的偏移量：因为图片填满视图后会有部分超出，我们需要算出超出的部分，用来修正坐标：

   let scaledImageWidth = imageSize.width * scale
   let scaledImageHeight = imageSize.height * scale
   let xOffset = (scaledImageWidth - viewSize.width) / 2 // 水平方向超出的一半
   let yOffset = (scaledImageHeight - viewSize.height) / 2 // 垂直方向超出的一半
   

3. 转换编辑区域到原始图片坐标：这里要注意UIKit和CoreGraphics的坐标差异（UIKit原点在左上角，CoreGraphics在左下角），所以需要调整Y轴坐标：

   // 假设你编辑的区域是editFrame（相对于UIImageView的frame）
   let originalX = (editFrame.origin.x + xOffset) / scale
   let originalY = imageSize.height - (editFrame.origin.y + yOffset + editFrame.size.height) / scale
   let originalWidth = editFrame.size.width / scale
   let originalHeight = editFrame.size.height / scale
   

4. 执行裁剪：用转换后的原始坐标裁剪CGImage，再转回UIImage：

   guard let cgImage = originalImage.cgImage else { return nil }
   let cropRect = CGRect(x: originalX, y: originalY, width: originalWidth, height: originalHeight)
   guard let croppedCGImage = cgImage.cropping(to: cropRect) else { return nil }
   let croppedImage = UIImage(cgImage: croppedCGImage, scale: originalImage.scale, orientation: originalImage.imageOrientation)
   

这部分通常是以下几个原因导致的，对应解决方案：

• 错误使用UIImageView尺寸：绝对不要基于UIImageView的bounds来生成图片，一定要用原始图片或你期望的目标尺寸。比如上面的裁剪代码，就是基于原始图片的坐标，裁剪出的尺寸和编辑区域在原始图中的实际大小一致。
• 过度压缩图片：保存时如果用UIImageJPEGRepresentation，不要把compressionQuality设得太低（比如低于0.5），建议设为0.8~0.9；如果需要无损保存，直接用UIImagePNGRepresentation。
• 编辑时意外缩放图片：检查你的编辑逻辑，是否在绘制编辑内容时，把图片缩放到了UIImageView的尺寸，导致最终输出的图片和视图一样大。确保所有绘制操作都是基于原始图片的尺寸进行的。

这里给你一个可以直接用的工具函数，既能解决位置偏差，又能保证尺寸正确：

import UIKit

extension UIImage {
    func croppedToVisibleArea(in imageView: UIImageView) -> UIImage? {
        guard let cgImage = self.cgImage else { return nil }
        
        let imageSize = self.size
        let viewBounds = imageView.bounds
        
        // 计算scaleAspectFill的缩放比例
        let scaleX = viewBounds.width / imageSize.width
        let scaleY = viewBounds.height / imageSize.height
        let scale = max(scaleX, scaleY)
        
        // 计算图片在视图中的显示尺寸和偏移
        let scaledImageWidth = imageSize.width * scale
        let scaledImageHeight = imageSize.height * scale
        let xOffset = (scaledImageWidth - viewBounds.width) / 2
        let yOffset = (scaledImageHeight - viewBounds.height) / 2
        
        // 转换为CGImage的裁剪区域（适配CoreGraphics坐标）
        let cropX = xOffset / scale
        let cropY = imageSize.height - (viewBounds.height + yOffset) / scale
        let cropWidth = viewBounds.width / scale
        let cropHeight = viewBounds.height / scale
        
        guard let croppedCGImage = cgImage.cropping(to: CGRect(x: cropX, y: cropY, width: cropWidth, height: cropHeight)) else { return nil }
        
        return UIImage(cgImage: croppedCGImage, scale: self.scale, orientation: self.imageOrientation)
    }
    
    // 保存图片的工具方法
    func saveToDocuments(named fileName: String) -> Bool {
        guard let data = self.pngData() else { return false }
        let documentsDir = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first!
        let fileURL = documentsDir.appendingPathComponent(fileName)
        do {
            try data.write(to: fileURL)
            return true
        } catch {
            print("保存失败: \(error.localizedDescription)")
            return false
        }
    }
}

// 使用示例
// if let croppedImage = originalImage.croppedToVisibleArea(in: yourImageView) {
//     let success = croppedImage.saveToDocuments(named: "edited_image.png")
//     print(success ? "保存成功" : "保存失败")
// }

如果你的编辑是局部区域（不是整个UIImageView的可见区域），只需要把上面的viewBounds换成你的编辑区域frame即可，逻辑是一样的。

内容的提问来源于stack exchange，提问作者Christin Brown