段之間添加隔板的TabBar

Question

我有下圖像中的TabBar部分之間添加分隔符：

我嘗試使用此圖片設置背景圖像的TabBar： 但我有問題時，我旋轉設備。

，我使用的代碼：

+ (UITabBarController *)loadTabbar 
{ 
    UITabBarController *tabBarController = [UITabBarController new]; 

    MenuVC  *viewController0 = [MenuVC new]; 
    FavVC  *viewController1 = [FavVC new]; 
    UploadVC *viewController2 = [UploadVC new]; 
    RestoreVC *viewController3 = [RestoreVC new]; 
    SettingsVC *viewController4 = [SettingsVC new]; 

    tabBarController.viewControllers = @[viewController0, viewController1, iewController2, viewController3, viewController4]; 
    [tabBarController.tabBar setBackgroundImage:[UIImage mageNamed:@"tabbar_color"]]; 

    [self setRootController:tabBarController]; 

    return tabBarController; 
} 

另外，我試圖使圖像的右側，我用於abbar項但沒有結果添加的隔板。 你能幫我解答一下嗎？

謝謝！

Answer 1

您可以在圖像右側爲每個TabBarItem添加分隔符。圖像大小：@1x - 64*50（設備寬度 - 320，項目 - 5;因此TabBarItem寬度= 320/5 = 64）和@2x - 128*100（如果您的TabBar中有五個TabBarItems）。

旋轉設備時，TabBarItems的寬度會發生變化。

因此，您可以將分隔符添加到您的image中，並使效果與您想要的相同。

希望，這就是你要找的。任何擔心都會回到我身上。

Answer 2

可以使編程背景的UITabBar：

#define SEPARATOR_WIDTH 0.4f 
#define SEPARATOR_COLOR [UIColor whiteColor] 

- (void) setupTabBarSeparators { 
    CGFloat itemWidth = floor(self.tabBar.frame.size.width/self.tabBar.items.count); 

    UIView *bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.tabBar.frame.size.width, self.tabBar.frame.size.height)]; 
    for (int i=0; i<self.tabBar.items.count - 1; i++) { 
     UIView *separator = [[UIView alloc] initWithFrame:CGRectMake(itemWidth * (i +1) - SEPARATOR_WIDTH/2, 0, SEPARATOR_WIDTH, self.tabBar.frame.size.height)]; 
     [separator setBackgroundColor:SEPARATOR_COLOR]; 
     [bgView addSubview:separator]; 
    } 

    UIGraphicsBeginImageContext(bgView.bounds.size); 
    [bgView.layer renderInContext:UIGraphicsGetCurrentContext()]; 
    UIImage *tabBarBackground = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 

    [[UITabBar appearance] setBackgroundImage:tabBarBackground]; 
} 

您應該只延長的UITabBarController和使自定義UITabBarViewController。你應該在viewDidLoad和willRotateToInterfaceOrientation中調用這個方法。

Answer 3

我剛剛將@bojanb89's answer轉換爲Swift 3.這不會渲染背景圖像，而只是在每個標籤欄項目之間添加一個視圖。

func setupTabBarSeparators() { 
    let itemWidth = floor(self.tabBar.frame.size.width/CGFloat(self.tabBar.items!.count)) 

    // this is the separator width. 0.5px matches the line at the top of the tab bar 
    let separatorWidth: CGFloat = 0.5 

    // iterate through the items in the Tab Bar, except the last one 
    for i in 0...(self.tabBar.items!.count - 1) { 
     // make a new separator at the end of each tab bar item 
     let separator = UIView(frame: CGRect(x: itemWidth * CGFloat(i + 1) - CGFloat(separatorWidth/2), y: 0, width: CGFloat(separatorWidth), height: self.tabBar.frame.size.height)) 

     // set the color to light gray (default line color for tab bar) 
     separator.backgroundColor = UIColor.lightGray 

     self.tabBar.addSubview(separator) 
    } 
}