IOS SDK detailed blur (frosted glass) effect

Original blog, reproduced please indicate the source
Http://blog.csdn.net/hello_hwc?viewmode=list

Objective:
Before iOS 8, to achieve blur, you would typically use a few GitHub libraries, and of course you can customize it by using the core image to do some digital image processing (because of electronic origin, which is done in this lesson, with matrices). However, by the end of iOS 8, this has become quite simple, as Apple exposes several of its previous private APIs.

Demo effect

Three kinds of Blur

Vibrancy (that is, add some of the parts you want to emphasize on blur)

Demo Download link

http://download.csdn.net/detail/hello_hwc/8678439

Add Blur

The principle is simple.

• Uiblureffect Initializes a blureffect
• Make a visualeffectview, this view defines the area of the Blur
• Add this view as a subview to the view you want to blur

Uiblureffect *blureffect = [Uiblureffect effectwithstyle:uiblureffectstylelight];Uivisualeffectview *bluredeffectview = [[Uivisualeffectview alloc] initwitheffect:blureffect];[Bluredeffectview Setframe:cgrectinset (self. ImageView. Bounds, -, -);];Bluredeffectview. Layer. Cornerradius= the;Bluredeffectview. Layer. Maskstobounds= YES;[Self. ImageViewAddsubview:bluredeffectview];

There are three types of blur, corresponding to the three of the above demo chart:

• Dark
• Light
• Extralihgt

The points to note are

1. Do not set Alpha < 1 on Visualview
2. You can set mask to Visualview to customize the blurred area

Add vibrancy

The principle of adding vibrancy is to add a visualview on the blur basis and add the desired control on this visualview Contentview

Uiblureffect *blureffect = [Uiblureffect effectwithstyle:uiblureffectstylelight];Uivisualeffectview *bluredeffectview = [[Uivisualeffectview alloc] initwitheffect:blureffect];[Bluredeffectview Setframe:cgrectmake ( -, self. ImageView. Bounds. Size. Height- -, self. ImageView. Bounds. Size. Width- -, +)];Bluredeffectview. Layer. Cornerradius= the;Bluredeffectview. Layer. Maskstobounds= YES;[Self. ImageViewAddsubview:bluredeffectview];Uivibrancyeffect *vibrancyeffect = [Uivibrancyeffect Effectforblureffect:blureffect];Uivisualeffectview *vibrancyeffectview = [[Uivisualeffectview alloc] initwitheffect:vibrancyeffect];[Vibrancyeffectview setframe:self. ImageView. Bounds];[Bluredeffectview. ContentviewAddsubview:vibrancyeffectview];UILabel * label = [[UILabel alloc] Initwithframe:cgrectmake (0,0, self. ImageView. Bounds. Size. Width- -, +)];Label. Text= @"Highlight";Label. TextAlignment= Nstextalignmentcenter;Label. TextColor= [Uicolor Blackcolor];[Label Settextcolor:[uicolor Blackcolor]];[Vibrancyeffectview. ContentviewAddsubview:label];

Effect

A brief introduction to some of the design principles of the demo I wrote

Save model from two arrays

-(NSArray *)blurEffectArray{    return @[[UIBlurEffect effectWithStyle:UIBlurEffectStyleDark],             [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight],             [UIBlurEffect effectWithStyle:UIBlurEffectStyleExtraLight],             ];}-(NSArray *)titleArray{    return @[@"Dark",@"Light",@"ExtraLight"];}

Currentindex to get/set the current selection effect, the model and view synchronization in the Currentindex set function

-(void) SetCurrentIndex: (Nsinteger) currentindex{if( Self. Visualview!=Nil) {        [ Self. VisualviewRemovefromsuperview]; } Self. Visualview= [[Uivisualeffectview alloc] initwitheffect:[[ SelfBlureffectarray] Objectatindex:currentindex]; Self. Visualview. Frame= Cgrectinset ( Self. ImageView. Bounds, -, -); Self. Visualview. Layer. Cornerradius= the; Self. Visualview. Layer. Maskstobounds=YES; Self. Navigationitem. Title= [[ SelfTitlearray] Objectatindex:currentindex]; [ Self. ImageViewAddsubview: Self. Visualview]; _currentindex = Currentindex;}

Gesture touch, only need to change currentindex can

- (IBAction)swipt:(UISwipeGestureRecognizer *)sender {    self.currentIndex = (self.currentIndex1)%[self blurEffectArray].count;}

When initializing, specify the initial index

- (void)viewDidLoad {    [super viewDidLoad];    self.imageview.userInteractionEnabledYES;    self.currentIndex0;    // Do any additional setup after loading the view, typically from a nib.}

IOS SDK detailed blur (frosted glass) effect