- (void)viewDidLoad {[super viewDidLoad];// 设置导航栏属性self.navigationBar.translucent = NO;[self.navigationBar setTitleTextAttributes:@{NSForegroundColorAttributeName : [UIColor whiteColor], NSFontAttributeName:[UIFont boldSystemFontOfSize:28]}];// 修复iOS 15后导航栏变白色的bug并设置渐变背景[self ios15nvbug];
}
- (UIImage *)gradientImageWithBounds:(CGRect)bounds {CGSize size = bounds.size;if (size.width == 0 || size.height == 0) {size = CGSizeMake([UIScreen mainScreen].bounds.size.width, 88); // 默认宽度和导航栏高度}UIGraphicsBeginImageContext(size);CGContextRef context = UIGraphicsGetCurrentContext();// 创建渐变CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();CGFloat locations[] = {0.0, 1.0};NSArray *colors = @[(__bridge id)[UIColor colorWithRed:244/255.0 green:102/255.0 blue:36/255.0 alpha:1].CGColor,(__bridge id)[UIColor colorWithRed:205/255.0 green:75/255.0 blue:0 alpha:1].CGColor];CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)colors, locations);// 横向渐变(从左到右)CGPoint startPoint = CGPointMake(0, 0);CGPoint endPoint = CGPointMake(size.width, 0);CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);// 获取渐变图像UIImage *gradientImage = UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();CGGradientRelease(gradient);CGColorSpaceRelease(colorSpace);return gradientImage;
}
- (void)ios15nvbug {if (@available(iOS 13.0, *)) {UINavigationBarAppearance *appearance = [UINavigationBarAppearance new];[appearance configureWithOpaqueBackground];// 设置渐变背景图片UIImage *gradientImage = [self gradientImageWithBounds:self.navigationBar.bounds];appearance.backgroundImage = gradientImage;appearance.shadowImage = [[UIImage alloc] init];appearance.shadowColor = nil;// 设置导航栏标题的文本属性[appearance setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor whiteColor], NSFontAttributeName: [UIFont boldSystemFontOfSize:22]}];self.navigationBar.standardAppearance = appearance;self.navigationBar.scrollEdgeAppearance = appearance;} else {// iOS 13 以下使用旧的方法设置背景图片UIImage *gradientImage = [self gradientImageWithBounds:self.navigationBar.bounds];[self.navigationBar setBackgroundImage:gradientImage forBarMetrics:UIBarMetricsDefault];[self.navigationBar setShadowImage:[UIImage new]]; // 去除默认的阴影线[self.navigationBar setTitleTextAttributes:@{NSForegroundColorAttributeName : [UIColor whiteColor], NSFontAttributeName: [UIFont boldSystemFontOfSize:22]}];}
}// 其余方法保持不变...@end
关键点解释
-
生成渐变背景图片 (
gradientImageWithBounds:
方法):- 使用
UIGraphicsBeginImageContext
和CGGradientRef
生成一张横向渐变的图片。 - 渐变颜色从左到右的效果通过设置
startPoint
和endPoint
来实现。 - 通过
UIGraphicsGetImageFromCurrentImageContext
获取生成的渐变图片。
- 使用
-
设置导航栏的背景图片:
- 使用
setBackgroundImage:forBarMetrics:
方法将生成的渐变图片设置为导航栏的背景,这样可以确保其他 UI 元素(如标题和按钮)不会被遮挡。
- 使用
-
修复导航栏在 iOS 15 中的显示问题:
- 在
ios15nvbug
方法中设置UINavigationBarAppearance
,确保导航栏背景透明,以便使用渐变背景图片。
- 在