I'm making a camera-based app and would like to make a frosted overlay on the camera preview, with a rounded rectangle cut out from the frosted view.
I've been trying to achieve this with the maskLayer of UIView, introduced with iOS 8 and have been wildly unsuccessful.
Here's what my code currently looks like:
// Blur the preview
UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIView *blurView = [[UIVisualEffectView alloc] initWithEffect:effect];
blurView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view insertSubview:blurView aboveSubview:imagePicker.view];
// Make blur view fill screen
{
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[blurView]-0-|"
options:0
metrics:nil
views:NSDictionaryOfVariableBindings(blurView)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[blurView]-0-|"
options:0
metrics:nil
views:NSDictionaryOfVariableBindings(blurView)]];
}
// Add a rounded of transparency to the blurView **not working**
UIView *mask = [[UIView alloc] initWithFrame:CGRectMake(50.f, 50.f, 50.f, 50.f)];
mask.alpha = 1.0f;
mask.backgroundColor = [UIColor redColor];
[blurView setMaskView:mask]; // Remove this line, and everything is frosted. Keeping this line and nothing is frosted.
As my comments indicate, adding the mask removes the frosted view completely (changing the opacity of the mask does nothing). I know that this won't create the effect I'm looking for (it should only be frosted in that rectangle), but I can't get the maskView to work in any capacity.