iOS 7半透明模态视图控制器 [英] iOS 7 Translucent Modal View Controller

问题描述

iOS 7上的App Store应用程序使用磨砂玻璃效果，可以看到背后的视图。这是使用iOS 7内置的API还是自定义代码。我希望它会成为前者，但我在文档中看不到任何明显的引用。明显的事情（比如在模态视图上设置alpha属性）似乎没有任何效果。

要查看示例，请打开App Store应用程序并按右上角的按钮。

解决方案

随着iOS 8.0的发布，不再需要获取图像并使其模糊。正如）

  UIImage * imageOfUnderlyingView = [self.view convertViewToImage]; 
 imageOfUnderlyingView = [imageOfUnderlyingView applyBlurWithRadius：20 
 tintColor：[UIColor colorWithWhite：1.0 alpha：0.2] 
 saturationDeltaFactor：1.3 
 maskImage：nil]; 
  

3。将其设置为叠加层的背景。

   - （void）viewDidLoad 
 {
 self.view.backgroundColor = [UIColor clearColor]; 
 UIImageView * backView = [[UIImageView alloc] initWithFrame：self.view.frame]; 
 backView.image = imageOfUnderlyingView; 
 backView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent：0.6]; 
 [self.view addSubview：backView]; 
} 
  

The App Store app on iOS 7 uses a frosted glass-type effect where it is possible to see the view behind. Is this using an API built into iOS 7 or is it custom code. I was hoping it would be the former but I can't see any obvious references in the documentation. Obvious things like (like setting the alpha property on the modal view) don't seem to have any effect.

To see an example, open the App Store app and press the button at the top-right.

解决方案

With the release of iOS 8.0, there is no need for getting an image and blurring it anymore. As Andrew Plummer pointed out, you can use UIVisualEffectView with UIBlurEffect.

UIViewController * contributeViewController = [[UIViewController alloc] init];
UIBlurEffect * blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView *beView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
beView.frame = self.view.bounds;

contributeViewController.view.frame = self.view.bounds;
contributeViewController.view.backgroundColor = [UIColor clearColor];
[contributeViewController.view insertSubview:beView atIndex:0];
contributeViewController.modalPresentationStyle = UIModalPresentationOverCurrentContext;

[self presentViewController:contributeViewController animated:YES completion:nil];

---

Solution that works before iOS 8

I would like to extend on rckoenes' answer:

As emphasised, you can create this effect by:

1. Convert the underlying UIView to an UIImage
2. Blur the UIImage
3. Set the UIImage as background of your view.

---

Sounds like a lot of work, but is actually done pretty straight-forward:

1. Create a category of UIView and add the following method:

-(UIImage *)convertViewToImage
{
    UIGraphicsBeginImageContext(self.bounds.size);
    [self drawViewHierarchyInRect:self.bounds afterScreenUpdates:YES];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

2. Make an image of the current view and blur it by using Apple's Image Effect category (download)

UIImage* imageOfUnderlyingView = [self.view convertViewToImage];
imageOfUnderlyingView = [imageOfUnderlyingView applyBlurWithRadius:20
                             tintColor:[UIColor colorWithWhite:1.0 alpha:0.2]
                 saturationDeltaFactor:1.3
                             maskImage:nil];

3. Set it as background of your overlay.

-(void)viewDidLoad
{
   self.view.backgroundColor = [UIColor clearColor];
   UIImageView* backView = [[UIImageView alloc] initWithFrame:self.view.frame];
   backView.image = imageOfUnderlyingView;
   backView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.6];
   [self.view addSubview:backView];
}

这篇关于iOS 7半透明模态视图控制器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！