导航栏渐变色iOS

复制代码
- (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

关键点解释

  1. 生成渐变背景图片 (gradientImageWithBounds: 方法):

    • 使用 UIGraphicsBeginImageContextCGGradientRef 生成一张横向渐变的图片。
    • 渐变颜色从左到右的效果通过设置 startPointendPoint 来实现。
    • 通过 UIGraphicsGetImageFromCurrentImageContext 获取生成的渐变图片。
  2. 设置导航栏的背景图片:

    • 使用 setBackgroundImage:forBarMetrics: 方法将生成的渐变图片设置为导航栏的背景,这样可以确保其他 UI 元素(如标题和按钮)不会被遮挡。
  3. 修复导航栏在 iOS 15 中的显示问题:

    • ios15nvbug 方法中设置 UINavigationBarAppearance,确保导航栏背景透明,以便使用渐变背景图片。
相关推荐
共享家952712 小时前
linux-数据链路层
linux·网络·macos
CZIDC21 小时前
MacOS字体看起来比在 Windows 上更好?
macos
Cosmoshhhyyy1 天前
linux远程部署dify和mac本地部署dify
linux·运维·macos
行星0081 天前
mac 通过homebrew 安装和使用nvm
macos·npm·node.js
麦兜*1 天前
【swift】SwiftUI动画卡顿全解:GeometryReader滥用检测与Canvas绘制替代方案
服务器·ios·swiftui·android studio·objective-c·ai编程·swift
2501_928094652 天前
Mac电脑录屏工具 Omi录屏专家(Mac中文)
macos·mac·录屏工具·omi
森之鸟2 天前
Mac chrome浏览器下载DevEco Studio 6.0.0 Beta2失败
前端·chrome·macos
归辞...2 天前
「iOS」————UITableView性能优化
ios·性能优化·cocoa
FairGuard手游加固2 天前
版本更新!FairGuard-Mac加固工具已上线!
macos