ios making Masked BlurView with Stroke

Question

I have a little advanced question I want to make a custom shape blur on a png image that is half transparent and the png has transparent areas , and then drawing a stroke around the image (avoiding the transparent area in png image). I tried using GPUImage for making blue over image but I get blocked at drawing a stroke around the non-transparent part of the image . I tried using this method (https://stackoverflow.com/a/15010886/4641980) But the stroke is half transparent (following the fact that the image non-transparent part is half transparent ).

I need your help to make this done . This example is nearly what i mean

https://i.stack.imgur.com/YdITu.png

I have spent alot of time searching and trying but so far in vain , I will be so thankful for your help . Thank you.

Answer 1

You can use "CAShapeLayer" to clip (or mask) the blur image. For this you need a CGPath of the masking (or clipping) shape.

CAShapeLayer *pathLayer = [CAShapeLayer layer];
pathLayer.frame=CGRectMake(-imageView.frame.origin.x, -imageView.frame.origin.y, imageView.frame.size.width, imageView.frame.size.height);
pathLayer.path = yourClippingPath.CGPath;
pathLayer.strokeColor = [[UIColor blackColor] CGColor];
pathLayer.fillColor = [[UIColor clearColor] CGColor];
pathLayer.lineWidth = 6.0;
pathLayer.lineJoin = kCALineJoinBevel;
[imageView.layer addSublayer:pathLayer];