iOS 8--在导航栏和状态栏中应用模糊效果

Question

iOS 8--在导航栏和状态栏中应用模糊效果

6

我正在尝试为导航栏和状态栏添加模糊效果。我的问题是，模糊效果可以很好地应用于导航栏，但状态栏无法获得模糊效果。

我的问题是：如何扩展边界以包含状态栏？

我使用以下方法创建模糊效果：

- (void) addBlurEffect {

CGRect bounds = self.navigationController.navigationBar.bounds;
UIVisualEffectView *visualEffectView = [[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]];
visualEffectView.frame = bounds;
visualEffectView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
[self.navigationController.navigationBar addSubview:visualEffectView];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];
[self.navigationController.navigationBar sendSubviewToBack:visualEffectView];

在我的plist文件中，我有一个名为"View controller-based status bar appearance"的选项，其值为YES

在viewDidLoad方法中，我调用了一个方法：

- (void)configureView {

    // style controls

    self.addAirportButton.tintColor = [UIColor whiteColor];

    // style background image

    UIImageView *sidebarBackground = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sidebarBackground"]];
    self.tableView.backgroundView = sidebarBackground;

    // style navigation bar

    self.navigationController.navigationBar.barStyle = UIStatusBarStyleLightContent;

    // this makes navigation bar transparent

    [self.navigationController.navigationBar setBackgroundImage:[UIImage new]
                                                  forBarMetrics:UIBarMetricsDefault];
    self.navigationController.navigationBar.shadowImage = [UIImage new];
    self.navigationController.navigationBar.translucent = YES;

    // style toolbar

    self.navigationController.toolbar.translucent = YES;
    self.dismissAdsButton.tintColor = [UIColor whiteColor];

在viewDidLoad中没有做其他重要的事情。

当我构建这个应用时，界面看起来是这样的——一个嵌入了导航控制器的tableViewController，我还使用了优秀的SWRevealViewController。

请注意状态栏没有模糊效果：

仅导航栏部分有模糊效果，状态栏没有模糊效果

非常感谢任何帮助！

更新：

请参阅下面的答案。这是实现解决方案的屏幕截图：

应用解决方案的屏幕截图

- Chris Holloway

你尝试过在视图将要首次出现时从viewWillAppear中调用所有这些内容，而不是从viewDidLoad中调用吗？ - Rory McKinnel

我尝试了，但是没有变化，不幸的是。 - Chris Holloway

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- saulgoodman · Accepted Answer

我一直在尝试实现类似的效果，通过调整UINavigationBar的API后仍未能达到预期效果，我找到了一个解决方法：

创建一个与NavigationBar和StatusBar大小相同的UIView。这意味着它的frame应该是（0,0,w,64），其中w为屏幕的宽度。（我通过Storyboard完成此操作，并使用自动布局将宽度约束设置为其父视图的宽度）
将UIView的 backgroundColor 设置为透明色。
使用以下代码使navigation bar完全透明： navBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default) navBar.shadowImage = UIImage() navBar.translucent = true
现在将模糊效果应用于该View，这会产生这样一种错觉：模糊效果来自NavigationBar和StatusBar。

请参见此图片以查看所获得的效果（很抱歉由于声望限制，我无法发布图片）。

希望对大家有所帮助。

更新于2015-05-28：

这是我在StoryBoard中实现上述方法的过程：

将导航栏背景视图创建为主视图的直接子级。请注意，我将其余所有内容都包装在一个单独的Content View中。Content View为红色，导航栏背景视图为半透明白色。

像这样在导航栏背景视图上添加以下4个约束：左、右和顶部约束为0，高度约束为64。