ios開發 自定義帶弧度的UITabBar，保留系統原有push和pop過渡效果

一直想找個時間把自己所遇到的問題和解決思路寫成博客，但都感覺“沒時間”，最近幾天閒着沒事幹，就琢磨着自定義一個帶弧度的UITabBar,剛開始去網上搜了很多類似效果的文章，但感覺都不能滿足自己想要的，但最終結合了各個前輩的思路，最終得以將遇到的一個個小問題解決。第一次寫博客請大家多多指教。好了廢話不多說，直接開幹。

主要實現：1.自定義中間帶弧度的UITabBar(參照代碼思路可改成其它形狀)。

2.TabBar保留系統原有push和pop過渡效果。

3.由於自定義了UITabBar所以就連同TabBarController也一同定義了（用法和系統的很類似）。

最重要的一點，無代碼就別BB:代碼。

然後上效果圖(上傳代碼後纔看到Item4的角標顯示不全，這個就自己去弄了)：

接下來分享下遇到的問題和解決的思路(當然有些是參考了他人的解決思路)：

1.如果簡單的在中間放一個突出的圓形Button，那麼圓弧效果就基本上有了，但與TabBar銜接看起來不那麼流暢。所以就自定義了一個UITabBar,繼承於UIView,但要保留原有的push和pop效果就只能添加到系統當前的UITabBar上(如果是添加到self.view上，那麼當push到下一個頁面要隱藏TabBar時，就很難做到系統原有的動畫效果)，代碼如下：

//顯示TabBarItem的高度給50，剩下的10是預留給中間頂部的圓弧高度。
    _yTabBar = [[YSKJTabBar alloc]initWithFrame:CGRectMake(0, -10, CGRectGetWidth(self.view.bounds), 60)];
    _yTabBar.delegate = self;
//    _yTabBar.yBarTintColor = [UIColor orangeColor];
    [self.tabBar addSubview:_yTabBar];

2.不過將自定義的TabBar添加到系統的TabBar上又會出現一個問題：如果添加子Controller的時候，設置了Controller的title,則又會自動顯示系統自帶的TabBarItem,代碼如下：

- (UIViewController *)addChildViewController:(UIViewController *)childController
                                       title:(NSString *)title
                                   imageName:(NSString *)imageName
                             selectImageName:(NSString *)selectImageName
                                 badgeString:(NSString *)badgeString{
    
    childController.title = title;
    childController.yTabbarItem.yTitle = title;
    childController.yTabbarItem.yBadgeString = badgeString;
    childController.yTabbarItem.ySelectTitleColor = [UIColor orangeColor];
    childController.yTabbarItem.yImage = [UIImage imageNamed:imageName];
    childController.yTabbarItem.ySelectImage = [UIImage imageNamed:selectImageName];
    
    UINavigationController *navigationController = [[UINavigationController alloc]initWithRootViewController:childController];
    return navigationController;
}

效果如下圖：

可以看到效果圖，系統的TabBarItem已經顯示出來了（當然你也可以在添加子Controller的時候不設置title）。解決思路就是在自定義的UITabBarController中添加如下代碼：

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    for (UIView *child in self.tabBar.subviews) {
        if ([child isKindOfClass:[UIControl class]]) {
            [child removeFromSuperview];
        }
    }
}

解決後的效果如下：

 3.此時將自定義TabBar的背景顏色改爲橙色，效果如下：

YSKJTabBar

Controller

可以看到紅色箭頭所指處有一條白線，這就是系統TabBar自帶的，去除代碼如下：

//    self.tabBar.barStyle = UIBarStyleBlack; //白線
//    self.tabBar.barStyle = UIBarStyleDefault; //黑線
    
    //去掉UITabbar頂部線條。
    CGRect rect = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
    UIGraphicsBeginImageContext(rect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);
    CGContextFillRect(context, rect);
    UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    [self.tabBar setBackgroundImage:img];
    [self.tabBar setShadowImage:img];

效果如下(Item的字體顏色也是橙色，忘改了)：

可以看到白色線條已經不見了。

好了，基本遇到的問題都寫了，第一次寫博客，有不好的地方請多多指教，在下會繼續努力。