In iOS 8 there’s a new class called UIVisualEffect with which you can apply blur effects to entire views. Reading the Class Reference however you’d never figure out how.

In a nutshell, we need to create a UIVisualEffect (either a UIBlurEffect or a UIVibrancyEffect) which is applied to a UIVisualEffectView. The latter needs the same size as the view we want to blur and is then added as a subview to the view we’d like to apply an effect to.

This sounds way more complicated than it really is. Imagine this: you have a UIView, any view will do. To it you add a subview (the UIVisualEffectView). The effect view is created with an effect.

So as soon as you apply the effect view, all other existing views below it are blurred. Anything above the effect view is not blurred. Remove the effect view and the blur goes away again.

In this example we have a UIImageView which is referenced in the storyboard. To it we apply the desired effect.

The UIBlurEffect can be created with three options and no other parameters:

UIBlurEffectStyleLight

UIBlurEffectStyleExtraLight

UIBlurEffectStyleDark

UIVibrancyEffect

There’s an additional (disappointing) UIVibrancyEffect which cannot be used on its own, only in conjunction with a blur effect. To use the vibrancy effect, we need to first create a blur, then a new vibrancy effect with that blur. From both effects we need to then create two separate effect views and add both of those to the view we’d like to blur.

Share this:

In iOS we can press the HOME and the POWER button together at any time and a screenshot of what’s currently being displayed will be saved to the Camera Roll as if by magic. If we wanted to do the same thing programmatically it’s not that easy. It appears there’s no iOS system method that does this for us.

We have several options, let me describe two of those. I’ll add others if there are more convenient methods.

OPTION 1: using UIWindow

To make sure we screengrab everything in our display we can transfer the content of our top most UIWindow into a graphics context with the size of our screen. This will work no matter which class you use it in:

Objective-C

1

2

3

4

5

6

7

8

9

10

11

12

13

14

// create graphics context with screen size

CGRectscreenRect=[[UIScreenmainScreen] bounds];

UIGraphicsBeginImageContext(screenRect.size);

CGContextRefctx=UIGraphicsGetCurrentContext();

[[UIColorblackColor] set];

CGContextFillRect(ctx,screenRect);

// grab reference to our window

UIWindow*window=[UIApplicationsharedApplication].keyWindow;

// transfer content into our context

[window.layer renderInContext:ctx];

UIImage*screengrab=UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

The advantage with this method is that even popovers and alert views are added to the resulting UIImage.

OPTION 2: using UIView

If we only need to turn a UIView into a UIImage then the next method will work fine. The disadvantage is that certain types of views (such as OpenGL and popovers) will not be captured. In addition, you need a reference to the UIView you’d like to capture. In this example I’m using my Master/Detail App’s split view controller: