iOS NavgationBar 添加多个item

今天mark一下navgationbar的知识，有时候我们项目需要做像网易云音乐那样的navgationbar，有多个item同在右边或者左边玩耍。

见效果图，这个是我们要实现的。

navgationbar.png

为了帮助大家学习，我先说下曲线救国的两种方法。也是我爬过的坑。共勉。

• 我尝试了三种方法，一种是用toolbar放在navgationBar.rightBarButtonItem上

- (void)initNav{

    /* CREATE BOOKMARKS BUTTON */
    UIButton *bookmarksButton = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, kBookmarksImage.size.width, kBookmarksImage.size.height)];
    bookmarksButton.backgroundColor = [UIColor greenColor];
    [bookmarksButton setImage:kBookmarksImage forState:UIControlStateNormal];
    [bookmarksButton addTarget:self action:@selector(toolbarButtonTapped:) forControlEvents:UIControlEventTouchDown];
    bookmarksButton.tag = 1;
    
    UIBarButtonItem *bookmarksButtonItem = [[UIBarButtonItem alloc] initWithCustomView:bookmarksButton];
    
    UIBarButtonItem *spacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
    spacer.width = SPACE_BETWEEN_BUTTONS;
    
    UIButton *bookmarksButton2 = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, kBookmarksImage.size.width, kBookmarksImage.size.height)];
    bookmarksButton2.backgroundColor = [UIColor orangeColor];
    [bookmarksButton2 setImage:kBookmarksImage forState:UIControlStateNormal];
    [bookmarksButton2 addTarget:self action:@selector(toolbarButtonTapped:) forControlEvents:UIControlEventTouchDown];
    bookmarksButton2.tag = 2;
    
    UIBarButtonItem *bookmarksButtonItem2 = [[UIBarButtonItem alloc] initWithCustomView:bookmarksButton2];
    
    NSMutableArray<UIBarButtonItem*>*buttons = [NSMutableArray array];
    [buttons addObjectsFromArray:@[bookmarksButtonItem,spacer,bookmarksButtonItem2]];
    
    
    /* ADD ALL THESE BUTTONS TO CUSTOM TOOLBAR AND TOOLBAR TO NAVIGATION BAR */
    UIToolbar *customToolbar = [[UIToolbar alloc]
                                initWithFrame:CGRectMake(0.0f, 0.0f, 50, 44.01f)]; // 44.01 shifts it up 1px for some reason
    customToolbar.backgroundColor = [UIColor redColor];
    customToolbar.clearsContextBeforeDrawing = NO;
    customToolbar.clipsToBounds = NO;
    customToolbar.tintColor = [UIColor colorWithWhite:0.305f alpha:0.0f]; // closest I could get by eye to black, translucent style.
    customToolbar.barStyle = -1; // clear background
    [customToolbar setItems: buttons animated:NO];
    
    UIBarButtonItem *customUIBarButtonitem = [[UIBarButtonItem alloc] initWithCustomView:customToolbar];
    self.navigationItem.rightBarButtonItem = customUIBarButtonitem;
}

效果是这样的

error.png

紫色区和黄色区是我们无法改变的，我当时以为这是最接近神的操作了，然而失败了。

• 还有一种是用自定义view实现，效果虽然如出一辙，贼繁琐，需要重写btn还需要将view加载到navgationbar上面，因为原始的navgationbar的背景色是渐变色，那么此时问题来了，我右滑返回上级viewcontroller，自定义view并未消失而，你需要让它消失你要做很多脏活。不痛快

重头戏来了，原谅我说了那么多废话

上代码

- (void)initNavBar{
    // 需要注意为什么两个btn point都是（0，0）因为设置frame只能控制按钮的大小
    UIButton *searchBtn = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 22, 22)];
    [searchBtn setImage:[UIImage imageNamed:@"spotsupervision_playback_searchbtn"] forState:UIControlStateNormal];
    [searchBtn addTarget:self action:@selector(toolbarButtonTapped:) forControlEvents:UIControlEventTouchDown];
    searchBtn.tag = 1;
    
    UIButton *uploadBtn = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 22, 22)];
    [uploadBtn setImage:[UIImage imageNamed:@"spotsupervision_playback_uploadbtn"] forState:UIControlStateNormal];
    [uploadBtn addTarget:self action:@selector(toolbarButtonTapped:) forControlEvents:UIControlEventTouchDown];
    uploadBtn.tag = 2;
    
    UIBarButtonItem *btn_search = [[UIBarButtonItem alloc] initWithCustomView:searchBtn];
    UIBarButtonItem *btn_upload = [[UIBarButtonItem alloc] initWithCustomView:uploadBtn];
    
    UIBarButtonItem *negativeRightSpacer = [[UIBarButtonItem alloc]
                                       
                                       initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                       
                                       target:nil action:nil];
    
    /**
     *  width为负数时，相当于btn向右移动width数值个像素，由于按钮本身和边界间距为5pix，所以width设为-5时，间距正好调整
     *  为0；width为正数时，正好相反，相当于往左移动width数值个像素
     */
    negativeRightSpacer.width = -5;
    
    UIBarButtonItem *negativeMidSpacer = [[UIBarButtonItem alloc]
                                        
                                        initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                        
                                        target:nil action:nil];
    
    negativeMidSpacer.width = 10;
    
    self.navigationItem.rightBarButtonItems = [NSArray arrayWithObjects:negativeRightSpacer, btn_upload, negativeMidSpacer, btn_search, nil];
    
    
}

不解释一切尽在代码中。