UIBarAppearance是iOS13苹果新出来的一个对相应的空间统一设置外观样式的API，可以统一配置NavigationBar 、TabBar、 Toolbar等的外观样式。
- UIBarAppearance的子类
UINavigationBarAppearance 设置导航栏外观样式
UITabBarAppearance 设置Tabbar外观样式
UIToolbarAppearance 设置Toolbar外观样式
- 这里用导航条的
UINavigationBarAppearance作为示例，TabBar和Toolbar的设置外观样式使用的方式与其相同
iOS 13中 UINavigationBar新增了
scrollEdgeAppearance属性，但在iOS 15以前的版本中此属性只应用在大标题导航栏上。而在iOS 15中此属性适用于所有导航栏。
大家都知道导航栏在默认情况下背景是透明的，在滑动时如果系统检测到导航栏下方有其他UI的话，导航栏会变成毛玻璃效果，但有时需求要求导航栏不透明，无毛玻璃效果，那咋办呢？这时我们需要人为的去设置导航栏的样式了。
iOS15之前的设置方式：
// 导航栏背景设置为白色
navigationBar.barTintColor = .white
// 导航栏设置为不透明
navigationBar.isTranslucent = false
// 导航栏文字 颜色
navigationBar.tintColor = .white
// 导航栏文字样式
navigationBar.titleTextAttributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 18), NSAttributedString.Key.foregroundColor: UIColor.white ]
但是我们使用Xcode13编译工程后，导航栏就出现了问题，问题原因是UINavigationBar部分属性的设置在iOS15上是无效的，而且navigationBar.isTranslucent=NO也没有生效，导航条依然是透明的。因此在iOS5设置NavigationBar的样式的相关属性需要通过UINavigationBarAppearance类来实现。
iOS15适配的新方式：
if #available(iOS 15.0, *) {
let _appearance = UINavigationBarAppearance()
// 重置背景和阴影颜色
_appearance.configureWithOpaqueBackground()
// 去掉半透明效果
_appearance.backgroundEffect = nil
//设置背景颜色
_appearance.backgroundColor = .white
//普通样式
self.navigationBar.standardAppearance = _appearance;
//滚动样式
self.navigationBar.scrollEdgeAppearance = _appearance;
}
- 相关属性说明
-
scrollEdgeAppearance:
当可滚动内容的边缘与导航栏的边缘对齐时，导航栏的外观设置。如果这个属性的值为nil, UIKit使用导航栏的standardAppearance外观属性的值，修改为有一个透明的背景。 -
standardAppearance:
设置导航栏标准高度的样式设置，默认样式。此属性的默认值是一个包含系统默认外观设置的外观对象。 -
compactAppearance:
紧凑高度导航栏的外观设置。 -
compactScrollEdgeAppearance:
当可滚动内容的边缘与导航栏的边缘对齐时，紧凑高度导航栏的外观设置。
- UINavigationBarAppearance相关属性说明
-
backgroundEffect:
基于backgroundColor或backgroundImage的磨砂效果 -
backgroundColor:
背景色 -
backgroundImage:
背景图片 -
backgroundImageContentMode:
渲染backgroundImage时使用的内容模式。 默认为UIViewContentModeScaleToFill。 -
shadowColor:
阴影颜色（底部分割线），当shadowImage为nil时，直接使用此颜色为阴影色。如果此属性为nil或clearColor（需要显式设置），则不显示阴影 -
shadowImage:
阴影图片。template图像: [img imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate]
- 示例代码：
- 不透明导纯色航栏
//navigation标题文字颜色
NSDictionary *dic = @{NSForegroundColorAttributeName : [UIColor blackColor],
NSFontAttributeName : [UIFont systemFontOfSize:18 weight:UIFontWeightMedium]};
if (@available(iOS 15.0, *)) {
UINavigationBarAppearance *barApp = [UINavigationBarAppearance new];
barApp.backgroundColor = [UIColor whiteColor];
barApp.shadowColor = [UIColor whiteColor];
barApp.titleTextAttributes = dic;
self.navigationController.navigationBar.scrollEdgeAppearance = barApp;
self.navigationController.navigationBar.standardAppearance = barApp;
}else{
//背景色
self.navigationController.navigationBar.barTintColor = [UIColor whiteColor];
self.navigationController.navigationBar.titleTextAttributes = dic;
[self.navigationBar setShadowImage:[UIImage new]];
[self.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
}
//不透明
self.navigationController.navigationBar.translucent = NO;
//navigation控件颜色
self.navigationController.navigationBar.tintColor = [UIColor blackColor];
2、透明导航栏:
//navigation标题文字颜色
NSDictionary *dic = @{NSForegroundColorAttributeName : [UIColor whiteColor],
NSFontAttributeName : [UIFont systemFontOfSize:18]};
if (@available(iOS 15.0, *)) {
UINavigationBarAppearance *barApp = [UINavigationBarAppearance new];
barApp.backgroundColor = [UIColor clearColor];
barApp.titleTextAttributes = dic;
self.navigationController.navigationBar.scrollEdgeAppearance = nil;
self.navigationController.navigationBar.standardAppearance = barApp;
}else{
self.navigationController.navigationBar.titleTextAttributes = dic;
[self.navigationBar setShadowImage:[UIImage new]];
[self.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
}
//透明
self.navigationController.navigationBar.translucent = YES;
//navigation控件颜色
self.navigationController.navigationBar.tintColor = [UIColor whiteColor];
- 参考文章
iOS 15 透明导航栏设置
网友评论