iOS 8 -- 对导航栏和状态栏应用模糊
iOS 8 -- Apply blur to navigation bar AND status bar
我正在尝试为导航栏和状态栏添加模糊效果。
我的问题是导航栏上的模糊效果很好,但状态栏不会模糊。
我的问题是:如何扩展边界以包含状态栏?
我正在使用以下方法创建模糊效果:
- (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 中,我有基于视图控制器的状态栏外观 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 中没有其他重要的事情完成。
当我构建它时,视图是这样的——它是一个嵌入在 NavigationController 中的 tableViewController,我也在使用优秀的 SWRevealViewController。
看看状态栏怎么不模糊:
任何帮助将不胜感激!
更新:
请参阅下面的答案。这是已实施解决方案的屏幕截图:
我一直在尝试实现类似的效果,在调整 UINavigationBar 的 API 后无法达到预期的效果,我找到了一个解决方法:
创建一个与 NavigationBar + StatusBar 大小相同的 UIView。也就是说,它的框架为 (0, 0, w, 64),其中 w 是屏幕的宽度。 (我通过 Storyboard 做到了这一点,并使用自动布局将宽度约束设置为其父视图的宽度约束)
将 UIView 的 backgroundColor
设置为清除颜色。
使用以下代码使导航栏完全透明:
navBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
navBar.shadowImage = UIImage()
navBar.translucent = true
现在将模糊效果应用到该视图,这会产生模糊效果同时来自导航栏和状态栏的错觉。
查看 this picture 获得的效果(抱歉,由于声誉限制,我还不能 post 图片)。
希望对您有所帮助。
2015-05-28 更新:
这就是我在 StoryBoard 中实现上述方法的方法:
- 在最顶层的层次结构中创建导航栏背景视图作为主视图的直接子视图。请注意,我已将所有其他内容包装到一个内容视图中。内容视图为红色,导航栏背景视图为半透明白色。
- 在 Navigation Bar Background View 上添加以下 4 个约束,例如:0 用于左、右和顶部约束,64 用于高度约束。
我正在尝试为导航栏和状态栏添加模糊效果。 我的问题是导航栏上的模糊效果很好,但状态栏不会模糊。
我的问题是:如何扩展边界以包含状态栏?
我正在使用以下方法创建模糊效果:
- (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 中,我有基于视图控制器的状态栏外观 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 中没有其他重要的事情完成。 当我构建它时,视图是这样的——它是一个嵌入在 NavigationController 中的 tableViewController,我也在使用优秀的 SWRevealViewController。
看看状态栏怎么不模糊:
任何帮助将不胜感激!
更新:
请参阅下面的答案。这是已实施解决方案的屏幕截图:
我一直在尝试实现类似的效果,在调整 UINavigationBar 的 API 后无法达到预期的效果,我找到了一个解决方法:
创建一个与 NavigationBar + StatusBar 大小相同的 UIView。也就是说,它的框架为 (0, 0, w, 64),其中 w 是屏幕的宽度。 (我通过 Storyboard 做到了这一点,并使用自动布局将宽度约束设置为其父视图的宽度约束)
将 UIView 的
backgroundColor
设置为清除颜色。使用以下代码使导航栏完全透明:
navBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default) navBar.shadowImage = UIImage() navBar.translucent = true
现在将模糊效果应用到该视图,这会产生模糊效果同时来自导航栏和状态栏的错觉。
查看 this picture 获得的效果(抱歉,由于声誉限制,我还不能 post 图片)。
希望对您有所帮助。
2015-05-28 更新:
这就是我在 StoryBoard 中实现上述方法的方法:
- 在最顶层的层次结构中创建导航栏背景视图作为主视图的直接子视图。请注意,我已将所有其他内容包装到一个内容视图中。内容视图为红色,导航栏背景视图为半透明白色。
- 在 Navigation Bar Background View 上添加以下 4 个约束,例如:0 用于左、右和顶部约束,64 用于高度约束。