当用户触摸屏幕时消除模糊对图像的影响

我想删除模糊的具体位置用户在屏幕上触摸。 当用户在屏幕上移动他的手指只有当前触摸部分将具有清晰的图像。 rest所有屏幕将有模糊图像。 当用户从屏幕上移开他的手指时,完整的图像会再次模糊。

到目前为止,我所做的是:添加了一个GPUImage框架来使图像模糊。 在图片的顶部,我有一个原始图像。 最初是隐藏的。 我想要的是,当用户点击屏幕上,然后显示该选定部分的原始图像只有特定的圆。

谢谢

界面生成器

  1. 首先将2个UIImageView放在彼此之上。 将他们的模式设置为Aspect Fit 。 在你想模糊的UIImageView ,同时检查User Interaction Enabled

  1. 确保将你想要模糊的UIImageView最近邻居约束的间距设置为-10,并且将你不想模糊的最近邻居约束的间距设置为0。

    在这里输入图像说明在这里输入图像说明

    我们这样做是因为后来我们应用了10的GaussianBlurFilter 。通过应用这个滤镜,我们在我们要模糊的图像的每个方向上添加10个额外的像素,使得图像在高度和宽度上增大20个像素。 另外请确保在超级视图中检查Clip Subviews视图,以防止模糊的图像超出超级视图的范围。


.h文件

  1. 在你的.h声明你想模糊的UIImageView按CTRL +单击将其拖动到.h文件。 你的.h文件应该是这样的:

     #import <UIKit/UIKit.h> @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet UIImageView *uivBlurred; @end 

.m文件

  1. 在您的.m文件@synthesize uivBlurred中声明以下2个方法:

     - (void)blurImageInImageView: (UIImageView*)imageView { CIFilter *gaussianBlurFilter = [CIFilter filterWithName:@"CIGaussianBlur"]; [gaussianBlurFilter setDefaults]; [gaussianBlurFilter setValue:[CIImage imageWithCGImage:[imageView.image CGImage]] forKey:kCIInputImageKey]; [gaussianBlurFilter setValue:@10 forKey:kCIInputRadiusKey]; CIImage *outputImage = [gaussianBlurFilter outputImage]; CIContext *context = [CIContext contextWithOptions:nil]; CGRect rect = [outputImage extent]; CGImageRef cgimg = [context createCGImage:outputImage fromRect:rect]; UIImage *blurredImage = [UIImage imageWithCGImage:cgimg]; [imageView setImage:blurredImage]; CGImageRelease(cgimg); } 

     -(void)cutHoleInImageView:(UIImageView*)imageView atPoint:(CGPoint)point withRadius: (float)radius { CGRect imageViewFrame = imageView.bounds; CGRect circleFrame = CGRectMake(point.x-radius/2,point.y-radius/2,radius,radius); CAShapeLayer* shapeLayer = [CAShapeLayer layer]; CGMutablePathRef path = CGPathCreateMutable(); CGPathAddEllipseInRect(path, nil, circleFrame); CGPathAddRect(path, nil, imageViewFrame); shapeLayer.path = path; CGPathRelease(path); shapeLayer.fillRule = kCAFillRuleEvenOdd; imageView.layer.mask = shapeLayer; } 

  1. 在.m文件中还要实现以下3个方法:

     -(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:180]; } } -(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:180]; } } -(void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:0]; } } 

  1. 将以下行添加到您的viewDidLoad

    [self blurImageInImageView:uivBlurred];


  1. 如果一切顺利,你的.m文件应该看起来像这样
 #import "ViewController.h" @interface ViewController () @end @implementation ViewController @synthesize uivBlurred; - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. [self blurImageInImageView:uivBlurred]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } - (void)blurImageInImageView: (UIImageView*)imageView { CIFilter *gaussianBlurFilter = [CIFilter filterWithName:@"CIGaussianBlur"]; [gaussianBlurFilter setDefaults]; [gaussianBlurFilter setValue:[CIImage imageWithCGImage:[imageView.image CGImage]] forKey:kCIInputImageKey]; [gaussianBlurFilter setValue:@10 forKey:kCIInputRadiusKey]; CIImage *outputImage = [gaussianBlurFilter outputImage]; CIContext *context = [CIContext contextWithOptions:nil]; CGRect rect = [outputImage extent]; CGImageRef cgimg = [context createCGImage:outputImage fromRect:rect]; UIImage *blurredImage = [UIImage imageWithCGImage:cgimg]; [imageView setImage:blurredImage]; CGImageRelease(cgimg); } -(void)cutHoleInImageView:(UIImageView*)imageView atPoint:(CGPoint)point withRadius: (float)radius { CGRect imageViewFrame = imageView.bounds; CGRect circleFrame = CGRectMake(point.x-radius/2,point.y-radius/2,radius,radius); CAShapeLayer* shapeLayer = [CAShapeLayer layer]; CGMutablePathRef path = CGPathCreateMutable(); CGPathAddEllipseInRect(path, nil, circleFrame); CGPathAddRect(path, nil, imageViewFrame); shapeLayer.path = path; CGPathRelease(path); shapeLayer.fillRule = kCAFillRuleEvenOdd; imageView.layer.mask = shapeLayer; } -(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:180]; } } -(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:180]; } } -(void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { UITouch *touch = [[event allTouches] anyObject]; if(touch.view == uivBlurred) { [self cutHoleInImageView:uivBlurred atPoint:[touch locationInView:uivBlurred] withRadius:0]; } } @end 

现在添加您的图像,并运行应用程序。 你应该有这样的东西:

在这里输入图像说明

而当你点击图片时:

在这里输入图像说明

您也可以在这里下载一个带有上面代码的示例项目