导航栏渐变色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,确保导航栏背景透明,以便使用渐变背景图片。
相关推荐
Everbrilliant898 小时前
Xcode上编译调试ffmpeg
macos·ffmpeg·xcode·ffmpeg源码编译工具·xcode调试ffmpeg源码·ffmpeg工具环境变量配置
感谢地心引力8 小时前
iOS26 打开开发者模式
windows·macos·ios·iphone·ios26
追光天使20 小时前
Mac 安装Neo4j教程
macos·neo4j
一勺菠萝丶1 天前
macOS 终端配置全攻略:zsh、bash_profile、zprofile、zshrc 到 nvm 配置的完整科普
macos·bash·策略模式
pixelpilot1 天前
Nimble:让SwiftObjective-C测试变得更优雅的匹配库
开发语言·其他·objective-c·swift
2501_915909062 天前
iOS 应用上架全流程解析,苹果应用发布步骤、ipa 上传工具、TestFlight 测试与 App Store 审核经验
android·macos·ios·小程序·uni-app·cocoa·iphone
Jouzzy2 天前
【iOS安全】iPhone X iOS 16.7.11 (20H360) Palera1n MacOS版 越狱教程
macos·ios·iphone
@@神农2 天前
maven的概述以及在mac安装配置
java·macos·maven
不老刘2 天前
macOS/Linux ClaudeCode 安装指南及 Claude Sonnet 4.5 介绍
linux·macos·ai编程·claude·vibecoding
醉、倾城3 天前
面向开发人员的macOS入门教程
macos·策略模式