How to make a transparent section on a UIVisualEffectView?

Question

In my application, I looked at UIView by subclassing simple UIView. However, if I try to do the same with the UIVisualEffectView , I cannot do this.

Here is what I can do using a regular UIView :

When I use a UIVisualEffectView instead of a green UIView , I don't see the view through the UIView, although the view through the UIView added to the UIVisualEffectView as a subview .

Code:

 - (void)drawRect:(CGRect)rect { //this is same for the UIVIew and for the UIVisualEffectView [super drawRect:rect]; CGContextRef context = UIGraphicsGetCurrentContext(); // Clear any existing drawing on this view // Remove this if the hole never changes on redraws of the UIView CGContextClearRect(context, self.bounds); // Create a path around the entire view UIBezierPath *clipPath = [UIBezierPath bezierPathWithRect:self.bounds]; // Your transparent window. This is for reference, but set this either as a property of the class or some other way CGRect transparentFrame; // Add the transparent window UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:transparentFrame cornerRadius:5.0f]; [clipPath appendPath:path]; // NOTE: If you want to add more holes, simply create another UIBezierPath and call [clipPath appendPath:anotherPath]; // This sets the algorithm used to determine what gets filled and what doesn't clipPath.usesEvenOddFillRule = YES; // Add the clipping to the graphics context [clipPath addClip]; // set your color UIColor *tintColor = [UIColor greenColor]; // (optional) set transparency alpha CGContextSetAlpha(context, 0.7f); // tell the color to be a fill color [tintColor setFill]; // fill the path [clipPath fill]; } 

Question : Why did this not work with the UIVisualEffectView ?

Answer 1

Add the following variables to the ViewController.h file -

 CAShapeLayer *fillLayer; UIVisualEffectView *overlayView; 

Add the following methods to the ViewController.m file:

 -(void)addOverlay:(CGRect)rect{ float x = rect.origin.x; float y = rect.origin.y; UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height) cornerRadius:0]; UIBezierPath *circlePath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(x, y, rect.size.width, rect.size.height) cornerRadius:5]; [path appendPath:circlePath]; [path setUsesEvenOddFillRule:YES]; [self removeOverlay]; overlayView = [[UIVisualEffectView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height+64)]; overlayView.backgroundColor = [UIColor clearColor]; [self.view addSubview:overlayView]; fillLayer = [CAShapeLayer layer]; fillLayer.path = path.CGPath; fillLayer.fillRule = kCAFillRuleEvenOdd; fillLayer.fillColor = [UIColor colorWithRed:78/255.0 green:103/255.0 blue:135/255.0 alpha:1.0].CGColor; fillLayer.opacity = 0.85; [[UIApplication sharedApplication].keyWindow.layer addSublayer:fillLayer]; } -(void)removeOverlay{ [overlayView removeFromSuperview]; [fillLayer removeFromSuperlayer]; } 

and name it like

 [self addOverlay:rect];