ios设置导航栏背景图片、返回按钮背景、标题颜色等等

最新推荐文章于 2021-08-20 17:34:29 发布

new_dev

最新推荐文章于 2021-08-20 17:34:29 发布

阅读量3.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： iOS_dev

本文链接：https://blog.youkuaiyun.com/u012094456/article/details/11595217

iOS_dev 专栏收录该内容

32 篇文章

订阅专栏

本文介绍了如何在iOS应用中自定义UINavigationController的UI，包括设置导航栏背景图片、返回按钮样式、标题颜色等。通过使用appearance API，可以简洁地实现全局的导航栏主题设置，减少代码冗余。

在ios程序的编写过程中，很多时候我们都要自定义自己的UI，而不是使用cocoatouch中原有的。说起对UI的更改，很多时候我们只是修改一下原有UI的背景啊，颜色之类的，以达到新的要求。
在此之前呢，设置UINavigationController的背景颜色，我会使用如下的代码：
首先看.h文件

#import <UIKit/UIKit.h>
@interface UINavigationBar (CustomBar)
- (void)customNavigationBar;
@end

.m文件

#import "UINavigationBar+CustomBar.h"
#import <QuartzCore/QuartzCore.h>
@implementation UINavigationBar (CustomBar)
- (void)customNavigationBar
{
    if ([self respondsToSelector:@selector(setBackgroundImage:forBarMetrics:)])
    {
        CGSize titleSize = self.bounds.size;  //获取Navigation Bar的位置和大小
        UIImage *image = [UIImage imageNamed:@"img_nav_backimg"];
        
        UIGraphicsBeginImageContext(titleSize);
        [image drawInRect:CGRectMake(0, 0, titleSize.width, titleSize.height)];
        UIImage* scaledImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        [self setBackgroundImage:scaledImage forBarMetrics:UIBarMetricsDefault];
    }
    else
    {
        [self drawRect:self.bounds];
    }
    
//    [self drawRoundCornerAndShadow];
}

- (void)drawRect:(CGRect)rect {
    [[UIImage imageNamed:@"img_nav_backimg.png"] drawInRect:rect];
}

- (void)drawRoundCornerAndShadow {
    CGRect bounds = self.bounds;
    bounds.size.height +=10;
    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:bounds
                                                   byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight)
                                                         cornerRadii:CGSizeMake(10.0, 10.0)];
    
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.frame = bounds;
    maskLayer.path = maskPath.CGPath;
    
    [self.layer addSublayer:maskLayer];
    self.layer.mask = maskLayer;
    self.layer.shadowOffset = CGSizeMake(3, 3);
    self.layer.shadowOpacity = 0.7;
    self.layer.shadowPath = [UIBezierPath bezierPathWithRect:self.bounds].CGPath;
}
@end

调用时如下：

//设置导航栏底图
+ (void)setNavigationCtrollerBackImg:(UINavigationController *)naviCtl
{
    [naviCtl.navigationBar customNavigationBar];
}

这样的写法是一个不错的选择。如果说要修改 self.title的颜色呢，相信很多人都会想到自定义UILabel，然后self.navigationControl.titleView = Label，这针对几个页面也许是一个比较不错的选择，可是如果很多页面，甚至所有的页面都需要呢，你或许会说设置一个基础类，然
后从这个基础类继承过来，这也可以，但是不是最简便的方式。
好了，说了这么多，我们来看看我最近看到的一个比较方便的方法吧：

#pragma mark 初始化导航栏主题
- (void)setNavTheme
{
    // 1.设置导航栏背景
    UINavigationBar *bar = [UINavigationBar appearance];
    [bar setBackgroundImage:[UIImage resizeImage:@"NavigationBar_Background.png"] forBarMetrics:UIBarMetricsDefault];
    // 状态栏
    [UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleBlackOpaque;
    
    // 2.设置导航栏文字属性
    NSMutableDictionary *barAttrs = [NSMutableDictionary dictionary];
    [barAttrs setObject:[UIColor darkGrayColor] forKey:UITextAttributeTextColor];
    [barAttrs setObject:[NSValue valueWithUIOffset:UIOffsetMake(0, 0)] forKey:UITextAttributeTextShadowOffset];
    [bar setTitleTextAttributes:barAttrs];
    
    // 3.按钮
    UIBarButtonItem *item = [UIBarButtonItem appearance];
    [item setBackgroundImage:[UIImage resizeImage:@"BarButtonItem_Normal.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    [item setBackgroundImage:[UIImage resizeImage:@"BarButtonItem_Pressed.png"] forState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];
    
    NSMutableDictionary *itemAttrs = [NSMutableDictionary dictionaryWithDictionary:barAttrs];
    [itemAttrs setObject:[UIFont boldSystemFontOfSize:13] forKey:UITextAttributeFont];
    [item setTitleTextAttributes:itemAttrs forState:UIControlStateNormal];
    [item setTitleTextAttributes:itemAttrs forState:UIControlStateHighlighted];
    [item setTitleTextAttributes:itemAttrs forState:UIControlStateDisabled];
    
    // 4.返回按钮
    [item setBackButtonBackgroundImage:[UIImage resizeImage:@"BarButtonItem_Back_Normal.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    [item setBackButtonBackgroundImage:[UIImage resizeImage:@"BarButtonItem_Back_Pressed.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    
    //返回按钮的标题
    UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] init];
    barButtonItem.title = @"buttonName";
    self.navigationItem.backBarButtonItem = barButtonItem; 
    [barButtonItem release]
}

这个方法极大的减轻了自定义带来的代码开销，用在换肤方面可能会更好的体现。是不是很不错啊！