上海快风信息科技有限公司

解决iOS导航栏及自定义返回图标问题

2018-01-16  本文已影响18人  koreadragon

iOS的导航栏一直是很多人的头疼问题,因为在自定义的时候会出现各种各样的bug,本文总结了目前遇到的问题,及解决方案,希望能帮到大家。

1.想要每个页面导航栏颜色不一样并且在切换时互不影响。

其实系统的导航控制器很是好用,我们也不要去太多干涉它以免影响基础结构。我参考kenshinCui的文章,使用以下方案:
继承一个导航控制器,把导航栏背景色设置为一张空图片,达到透明效果,这样在使用的时候,可以自定义一张图片放上去充当导航栏背景,很是方便。
基类导航控制器:

.h


#import <UIKit/UIKit.h>

@interface TransNavigationViewController : UINavigationController

@end


.m

#import "TransNavigationViewController.h"

@interface TransNavigationViewController ()<UINavigationControllerDelegate,UIGestureRecognizerDelegate>

@end

@implementation TransNavigationViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
   [self.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
    self.navigationBar.shadowImage = [UIImage new];
    self.interactivePopGestureRecognizer.delegate = self;
    self.delegate = self;

    
}
-(void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated{
    if (animated) {
        self.interactivePopGestureRecognizer.delegate = self;
    }
    [super pushViewController:viewController animated:animated];
}

-(NSArray<UIViewController *> *)popToViewController:(UIViewController *)viewController animated:(BOOL)animated{
    if (animated) {
        self.interactivePopGestureRecognizer.delegate = self;
    }
    return [super popToViewController:viewController animated:animated];
}
-(NSArray<UIViewController *> *)popToRootViewControllerAnimated:(BOOL)animated{
    if (animated) {
        self.interactivePopGestureRecognizer.delegate = self;
    }
    return [super popToRootViewControllerAnimated:animated];
}
-(void)navigationController:(UINavigationController *)navigationController didShowViewController:(UIViewController *)viewController animated:(BOOL)animated{
    [self.interactivePopGestureRecognizer setEnabled:YES];
    
}

-(BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer{
    if (gestureRecognizer == self.interactivePopGestureRecognizer && self.viewControllers.count < 2) {
        return NO;
    }
    return YES;
}

在工程中的导航控制器用这一个就够了。
具体在某个页面时,想要不同的背景色,添加一个自定义view就行了。
像这样:

在viewDidLoad中使用
GLNavigationBar *navigationBackView = [[GLNavigationBar alloc] initWithVisualView:YES];
navigationBackView = [UIColor groupTableViewBackgroundColor];
[self.view addSubview: navigationBackView];

我的背景专用view GLNavigationBar


GLNavigationBar.h
#import <UIKit/UIKit.h>

@interface GLNavigationBar : UIView


/**
 导航栏除去状态栏的部分,可用来添加自定义view
 */
@property(nonatomic,strong)UIView *viewWithoutStatusBar;
/**
 生成导航栏背景并且可以创建毛玻璃效果

 @param visual 是否带毛玻璃效果
 @return self
 */
-(instancetype)initWithVisualView:(BOOL)visual;

/**
 使用自定义的frame生成导航栏背景并且可以创建毛玻璃效果

 @param visual 是否带毛玻璃效果
 @param frame 自定义的frame
 @return self
 */
-(instancetype)initWithVisualView:(BOOL)visual frame:(CGRect)frame;

/**
 专为包含搜索框的导航栏创建背景

 @param visual 是否带毛玻璃
 @return self
 */
-(instancetype)initWithSearchBarVisual:(BOOL)visual;
@end


GLNavigationBar.m


#import "GLNavigationBar.h"
@interface GLNavigationBar ()
@property(nonatomic,assign)CGRect realFrame;
@property(nonatomic,assign)CGRect searchFrame;
@end
@implementation GLNavigationBar
-(CGRect)realFrame{
    //适配iPhoneX
    CGFloat height = 64;
    if ([UIScreen mainScreen].bounds.size.height == 812) {
        height = 88;
    }
    return CGRectMake(0, 0,SCREEN_WIDTH ,height);
}

-(CGRect)searchFrame{
    //适配iPhoneX
    CGFloat height = 64 + 12;
    if ([UIScreen mainScreen].bounds.size.height == 812) {
        height = 88 + 12;
    }
    return CGRectMake(0, 0,SCREEN_WIDTH ,height);
}
/*
 // Only override drawRect: if you perform custom drawing.
 // An empty implementation adversely affects performance during animation.
 - (void)drawRect:(CGRect)rect {
 // Drawing code
 }
 */
-(instancetype)init{
    if (self = [super init]) {
        
    }
    return self;
}
-(instancetype)initWithVisualView:(BOOL)visual{
    
    if (self = [super initWithFrame:self.realFrame]){
        if (visual) {
            
            [self addVisualView:self.realFrame];
        }
    }
    return self;
}
-(void)addVisualView:(CGRect)frame{
    UIBlurEffect *blur;
    blur = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
    UIVisualEffectView *visualView = [[UIVisualEffectView alloc] initWithEffect:blur];
    visualView.frame = frame;
    [self addSubview:visualView];
}

-(instancetype)initWithSearchBarVisual:(BOOL)visual{
    if (self = [super initWithFrame:self.searchFrame]) {
        if (visual) {
            [self addVisualView:self.searchFrame];
        }
    }
    return self;
}
-(instancetype)initWithVisualView:(BOOL)visual frame:(CGRect)frame{
    
    if (self = [super initWithFrame:frame]){
        if (visual) {
            
            [self addVisualView:frame];
        }
    }
    return self;
}

-(instancetype)initWithFrame:(CGRect)frame{
    //如果有frame值就使用,否则默认标准导航栏的尺寸
    if (frame.size.width) {
        self = [super initWithFrame:frame];
    }else{
        CGRect viewWithoutStatusBarFrame;
        //适配iPhoneX
        if ([UIScreen mainScreen].bounds.size.height == 812) {

            viewWithoutStatusBarFrame = CGRectMake(0, 44,SCREEN_WIDTH, 44);
            
        }else{
         
            viewWithoutStatusBarFrame = CGRectMake(0, 20, SCREEN_WIDTH, 44);
        }
        self = [super initWithFrame:self.realFrame];
        _viewWithoutStatusBar = [[UIView alloc] initWithFrame:viewWithoutStatusBarFrame];
        _viewWithoutStatusBar.backgroundColor = [UIColor clearColor];
        [self addSubview:_viewWithoutStatusBar];
    }
    
    return self;
}

@end

比如我这有两个viewController,要求分别有不同的导航栏背景:


navi.gif

可以看到切换非常丝滑,没有那种卡顿的bug。

2.自定义返回图标

如果只是想改变返回图标,系统自带的上一级的控制器名称还要的话,那就这样

UIImage *highlighted_backImage = [[UIImage imageNamed:@"navigationbar_back_highlighted"] imageWithRenderingMode:UIImageRenderingModeAutomatic];

//设置返回图标
self.navigationController.navigationBar.backIndicatorImage = highlighted_backImage;
self.navigationController.navigationBar.backIndicatorTransitionMaskImage = highlighted_backImage;

其实更多的需求是顺便连返回文字都不要了,只想要在左边留一个返回图标,刚开始思路是那就把系统的返回图标设置为我的图片,然后设置一个新的返回按钮,名称为空字符串

UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithTitle:@"" style:UIBarButtonItemStylePlain target:nil action:nil];
self.navigationItem.backBarButtonItem = item;

,这种方法很容易造成一个问题,就是返回图片不居中。
应该通过调整尺寸可以解决,但是我懒得慢慢去试,而且限制图片尺寸这件事本来就很局限,所以我用了下面这个方法:

1.首先把一张空图片设置成返回图标,其实是看不见的。然后用你自己的返回图标创建一个UIBarButtonItem赋给返回按钮,就OK了。

back.png

如果项目风格统一,可以直接用runtime解决,新建一个UIViewController的category,具体代码如下:


#import "UIViewController+BackImage.h"
#import <objc/runtime.h>
@implementation UIViewController (BackImage)
+ (void)load {
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        Class class = [self class];
        
        SEL originalSelector = @selector(viewDidLoad);
        SEL swizzledSelector = @selector(back_viewDidLoad);
        
        Method originalMethod = class_getInstanceMethod(class, originalSelector);
        Method swizzledMethod = class_getInstanceMethod(class, swizzledSelector);
        
        BOOL didAddMethod = class_addMethod(class, originalSelector, method_getImplementation(swizzledMethod), method_getTypeEncoding(swizzledMethod));
        
        if (didAddMethod) {
            class_replaceMethod(class, swizzledSelector, method_getImplementation(originalMethod), method_getTypeEncoding(originalMethod));
        } else {
            method_exchangeImplementations(originalMethod, swizzledMethod);
        }
    });
}

#pragma mark - Method Swizzling

- (void)back_viewDidLoad {
    [self back_viewDidLoad];

    //设置返回图标为空
    self.navigationController.navigationBar.backIndicatorImage = [UIImage new];
    self.navigationController.navigationBar.backIndicatorTransitionMaskImage = [UIImage new];

    //导航栏返回按钮
    UIImage *highlighted_backImage = [[UIImage imageNamed:@"navigationbar_back_highlighted"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

    UIBarButtonItem *backButton = [[UIBarButtonItem alloc]initWithImage:highlighted_backImage style:UIBarButtonItemStylePlain target:self action:@selector(gl_private_popViewController)];

    [self.navigationItem setBackBarButtonItem:backButton];
    
}
-(void)gl_private_popViewController{
    [self.navigationController popViewControllerAnimated:YES];
}

@end

如果你只是希望某几个控制器用这种风格,可以在runtime里判断,或者干脆建个基类解决。

附,kenshinCui大神的博客地址: iOS开发tips-UINavigationBar的切换

以上

上一篇下一篇

猜你喜欢

热点阅读