模糊边界外的 UIImage（Photoshop 样式）

Posted 2023-02-23

【中文标题】模糊边界外的 UIImage（Photoshop 样式）

【英文标题】：Blur UIImage outside of bounds (Photoshop-style)

【发布时间】：2013-10-14 17:37:54

【问题描述】：

我正在尝试在复制我的 Photoshop 模型的 UIImage 上进行高斯模糊。

期望的行为： 在 Photoshop 中，当我运行高斯模糊滤镜时，图像层会由于边缘模糊而变大。

观察到的行为：使用 GPUImage，我可以成功地模糊我的 UIImage。但是，新图像在原始边界处被裁剪，一直留下硬边。

设置UIImageView.layer.masksToBounds = NO; 没有帮助，因为图像被裁剪而不是视图。

我还尝试在模糊之前将 UIImage 置于较大的清晰图像的中心，然后调整大小。这也没有帮助。

有没有办法实现这种“Photoshop 风格”的模糊？

更新工作解决方案感谢 Brad Larson：

UIImage sourceImage = ...
GPUImagePicture *imageSource = [[GPUImagePicture alloc] initWithImage:sourceImage];
GPUImageTransformFilter *transformFilter = [GPUImageTransformFilter new];
GPUImageFastBlurFilter *blurFilter = [GPUImageFastBlurFilter new];

//Force processing at scale factor 1.4 and affine scale with scale factor 1 / 1.4 = 0.7
[transformFilter forceProcessingAtSize:CGSizeMake(SOURCE_WIDTH * 1.4, SOURCE_WIDTH * 1.4)];
[transformFilter setAffineTransform:CGAffineTransformMakeScale(0.7, 0.7)];

//Setup desired blur filter        
[blurFilter setBlurSize:3.0f];
[blurFilter setBlurPasses:20];

//Chain Image->Transform->Blur->Output        
[imageSource addTarget:transformFilter];
[transformFilter addTarget:blurFilter];
[imageSource processImage];

UIImage *blurredImage = [blurFilter imageFromCurrentlyProcessedOutputWithOrientation:UIImageOrientationUp];

【问题讨论】：

当您“尝试在模糊之前将 UIImage 居中放置在较大的清晰图像上”时，您的意思是您将原始图像合并为较大的 UIImage，因此它是一个图像？如果是这样，请尝试使用白色图像而不是清晰图像，并确保白色图像具有 Alpha 通道。我怀疑清晰的图像没有 alpha，因此结果看起来被剪裁了。

【参考方案1】：

GPUImage 只会产生处理到图像限制的结果。为了超越您的图像，您需要扩展它所操作的画布。

为此，您需要将图像输入 GPUImageTransformFilter，然后使用 -forceProcessingAtSize: 或 -forceProcessingAtSizeRespectingAspectRatio: 来扩大工作区域。但是，默认情况下，这也会放大图像，因此为了解决这个问题，请使用 GPUImageTransformFilter 的比例变换来减小图像相对于较大区域的大小。这将使其保持相同的像素尺寸，同时将其放置在更大的整体图像中。

然后您需要做的就是将此输出输入到您的模糊过滤器中，现在模糊将延伸到原始图像的边缘之外。您强制图像的大小将取决于模糊需要超出原始图像边缘的距离。

【讨论】：

谢谢布拉德！这正是我所需要的！我将使用工作代码更新我的答案以供人们参考。

【参考方案2】：

尝试调整 UIImageView 的边界以适应模糊。视图将剪切超出其边界的内容。请注意，在您的示例中，photoshop 中模糊的框看起来比原始图像大 20%。

UIImageView *image;
image.layer.bounds = CGRectMake(0, 
                                0, 
                                image.layer.bounds.size.width + 5, 
                                image.layer.bounds.size.height + 5);