添加滤镜时照片被拉伸且不响应aspectFit的技术问题咨询

我之前也碰到过一模一样的糟心事！给图片加完滤镜，不仅被莫名其妙拉伸，连aspectFit都完全不生效，折腾了好一阵才找到问题根源。下面是我总结的几个常见原因和对应的解决办法，你可以逐个排查：

1. 滤镜渲染时没保留原图片的宽高比 #

很多时候我们应用滤镜后，直接用滤镜输出的extent来渲染图像，而有些滤镜会自动修改图像的尺寸比例，导致最终生成的图片比例和原图不一致。比如你可能写了这样的代码：

let outputImage = filter.outputImage!
let cgImage = context.createCGImage(outputImage, from: outputImage.extent)

这里的outputImage.extent是滤镜处理后的默认尺寸，很可能已经改变了原图的比例。

解决办法：

• 先获取原图的宽高比：let originalRatio = originalImage.size.width / originalImage.size.height
• 根据目标容器的尺寸，按这个比例计算出合适的渲染范围，比如如果容器固定宽度为300，那么高度就是300 / originalRatio
• 用计算后的rect来渲染：

let targetSize = CGSize(width: 300, height: 300 / originalRatio)
let outputRect = CGRect(origin: .zero, size: targetSize)
let cgImage = context.createCGImage(outputImage, from: outputRect)

2. 生成UIImage时未正确设置scale属性 #

当从CGImage转换回UIImage时，如果忽略了原图的scale参数，生成的图片会以1x的分辨率存在，在高分辨率屏幕上显示时就会被拉伸，同时UIImageView的aspectFit也会因为尺寸计算错误而失效。

解决办法：
创建UIImage时带上原图的scale和方向：

guard let cgImage = cgImage else { return nil }
let filteredImage = UIImage(
    cgImage: cgImage,
    scale: originalImage.scale,
    orientation: originalImage.imageOrientation
)

这样生成的图片就能和原图保持一致的分辨率，aspectFit自然就能正常工作了。

3. 滤镜参数强制修改了图像比例 #

如果你用了CIAffineTransform、CICrop或者CIResize这类滤镜，参数设置不当会直接改变图像的宽高比。比如给CIAffineTransform设置了不等比例的缩放，或者CICrop用了不符合原图比例的rect。

解决办法：

• 检查所有应用的滤镜参数，确保没有强制修改比例的操作
• 如果需要调整图像尺寸，用CIResize滤镜时保持等比例缩放：

let resizeFilter = CIFilter(name: "CIResize")!
resizeFilter.setValue(inputImage, forKey: kCIInputImageKey)
// 按宽度计算缩放比例，保持原比例
let scaleFactor = targetWidth / inputImage.extent.width
resizeFilter.setValue(NSNumber(value: scaleFactor), forKey: kCIInputScaleKey)

4. 排查UIImageView的布局约束 #

虽然你说添加滤镜前是正常的，但也可以快速检查下：如果UIImageView同时设置了固定的width和height约束，即使aspectFit已开启，系统也会强制把图片拉伸到约束尺寸。

解决办法：

• 确保UIImageView的约束只固定一边（比如宽度），另一边设置为自适应，或者添加aspectRatio约束来匹配图片的比例
• 或者把width/height约束改为greaterThanOrEqualTo，让图片能按比例显示

先从这几个方向排查，应该能解决问题！

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