iOS 7 dynamic blur effect like in Control Center

Question

I\'m trying to make a controller that will be similar to Control Center in iOS7. From WWDC session #226 I\'ve learnt how to get blurred image with different effects

Answer 1

Using navigation bar to provide blurring will not work on older devices running iOS 7. As they are running lighter version of iOS 7 with almost no t

Answer 2

In iOS8 we can implement blur effect on views using UIVisualEffect class.

Answer 3

Here are ready solutions that I've found:

1. The most unexpected: Use UIToolBar

- (id) initWithFrame:(CGRect)frame
{
    if ((self = [super initWithFrame:frame]))
    {
        [self setup];
    }
    return self;
}

- (id) initWithCoder:(NSCoder *)coder
{
    if ((self = [super initWithCoder:coder]))
    {
        [self setup];
    }
    return self;
}

- (void) setup
{
    if (iOS7OrLater)
    {
        self.opaque = NO;
        self.backgroundColor = [UIColor clearColor];

        UIToolbar *toolbar = [[UIToolbar alloc] initWithFrame:self.bounds];
        toolbar.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
        toolbar.barTintColor = self.tintColor;
        [self insertSubview:toolbar atIndex:0];
    }
}

UIToolbar can be used for this needs, bacuse it has his only build-in blur mechanism, and this mechanism is dynamic, what is good. But the bad thing is that in some reason it ignores colors and makes background looks irredeemably...

Update:

To avoid color breaking, do not use barTintColor. You also may change style of toolbar if you want dark styled blur (use UIBarStyleBlack).

2. FXBlurView.

Unlike toolbar it more positive, but it's dynamic mechanism is rare yet and in fact it can be used only for static background. (dynamic = NO).

Answer 4

You can use UIVisualEffect from storyboard.

Drag the Visual Effect With Blur on the storyboard. The desired effect can be achieved by setting alpha of the BACKGROUND COLOR. The subviews should be added to View of Visual Effect View and they are not affected by the background blur.

The Vibrancy effect must be selected in View options above.

See image:

Answer 5

You can use below code to apply blur effect on view.

UIVisualEffect *blurEffect;
blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];

UIVisualEffectView *visualEffectView;
visualEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];

visualEffectView.frame = MYview.bounds;
[MYview addSubview:visualEffectView];

Answer 6

I've found LiveFrost to be a great, and easy to integrate project for live blurring.

https://github.com/radi/LiveFrost/