Swift：使用UIBezierPath裁剪图片失败及路径定位问题

看起来你在使用UIBezierPath裁剪图片时遇到了两个核心问题：裁剪效果不生效，以及不知道如何正确定位路径。我来帮你拆解问题并给出完整的解决方案。

首先，先看你现有代码里的几个关键问题，这些很可能是导致裁剪失效的原因：

• 用了UIGraphicsBeginImageContext而不是支持Retina的UIGraphicsBeginImageContextWithOptions，这会导致渲染异常，尤其是在高分辨率屏幕上；
• 传入的pathFrame参数完全没被使用，路径的坐标系和图片坐标系不匹配，裁剪区域可能根本不在图片范围内；
• 没有处理Core Graphics和UIKit的坐标系差异（前者原点在左下角，后者在左上角），路径可能被翻转到了图片可视区域外；
• 上下文状态的恢复时机不对，应该在获取裁剪后的图片之后再操作。

下面是修正后的完整代码，同时解决了路径定位的问题：

extension UIImage {
    func imageByApplyingMaskingBezierPath(_ path: UIBezierPath, pathFrame: CGRect) -> UIImage? {
        // 初始化支持Retina屏幕的绘图上下文
        UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
        guard let context = UIGraphicsGetCurrentContext() else {
            UIGraphicsEndImageContext()
            return nil
        }
        
        // 翻转上下文坐标系，对齐UIKit的图片坐标系
        context.translateBy(x: 0, y: self.size.height)
        context.scaleBy(x: 1.0, y: -1.0)
        
        // 将路径从原容器的坐标系（pathFrame）转换到图片坐标系
        let scaleX = self.size.width / pathFrame.width
        let scaleY = self.size.height / pathFrame.height
        let transform = CGAffineTransform(scaleX: scaleX, y: scaleY)
            .translatedBy(x: -pathFrame.origin.x, y: -pathFrame.origin.y) // 如果pathFrame原点不是(0,0)，需要平移修正
        let adjustedPath = path.copy() as! UIBezierPath
        adjustedPath.apply(transform)
        
        // 确保路径是封闭的（裁剪需要封闭路径）
        if !adjustedPath.isClosed {
            adjustedPath.close()
        }
        
        // 添加裁剪路径到上下文
        adjustedPath.addClip()
        
        // 绘制原始图片到裁剪区域内
        self.draw(in: CGRect(origin: .zero, size: self.size))
        
        // 获取裁剪后的图片
        let maskedImage = UIGraphicsGetImageFromCurrentImageContext()
        
        // 清理绘图上下文
        UIGraphicsEndImageContext()
        
        return maskedImage
    }
}

关键知识点解释 #

1. 为什么裁剪会失效？

• Retina上下文支持：UIGraphicsBeginImageContextWithOptions的第三个参数传入图片的scale，保证绘图时使用正确的像素密度，避免模糊或渲染错误；
• 坐标系对齐：Core Graphics上下文默认原点在左下角，而UIKit的图片/控件原点在左上角，通过translateBy和scaleBy翻转上下文，让路径和图片的位置完全对应；
• 封闭路径：addClip要求路径必须是封闭的，否则裁剪区域会不符合预期，代码里加入了isClosed判断并手动封闭路径。

2. 如何正确定位路径？

你的pathFrame应该是路径原本所在的容器（比如某个UIView的frame），我们需要把路径从容器坐标系转换到图片坐标系：

• 计算缩放比例：用图片的宽高除以容器的宽高，得到x/y方向的缩放因子；
• 平移修正：如果容器的原点不是(0,0)，需要用translatedBy把路径平移到正确的起始位置；
• 举个例子：如果你的路径是在一个CGRect(x:20, y:20, width:200, height:200)的视图里绘制的，而图片尺寸是400x400，那么缩放因子是2，平移量是(-20, -20)，这样路径就能准确对应到图片的对应区域。

额外排查技巧 #

如果你还是看不到裁剪效果，可以先临时在addClip之前加入这段代码，可视化路径的位置：

context.setStrokeColor(UIColor.red.cgColor)
context.setLineWidth(2)
adjustedPath.stroke()

这样你就能看到路径是否在图片范围内，方便调整坐标系转换的参数。

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