Inserting a space/view/image between UITabbar Items

Question

Porting an app to the ipad and in Landscape the tabbar looks a bit sparse so had the idea of separating the tabs (6 of them) and inserting an image between them.

I currently use TabBarKit and it does everything and more the UITabbar does, but this is something I am kind of stuck on. Having trouble finding any way to insert empty space, either an image or UIView (the background is already an image)?

What I've done so far is to add several extra tabbar items programmatically and set the image to nil and removing user interaction. (I found this solution on another stackoverflow thread, but it's not a perfect solution).

I know UIToolbar has a flexible space item but when I tried to use this as a tab bar item it caused some issues.

So if anyone has any ideas on how to insert a view, empty space etc into the tab bar it would be greatly appreciated.

UPDATE

Started a bounty because I'm curious to see if this can be done or not. The ipad landscape view has loads of room and I've been asked to put an image in the middle splitting the buttons.

If the app gets rejected then more the fool me. Any examples, samples, suggestions, advice greatly appreciated

Image example:

Answer 1

I'd agree with the answer above that this is probably not a great idea, technically though, it is possible.

The trick to a custom tabbar is to hide the default tabbar and place your own custom view in that space. Then you can fill that view with buttons, images, really whatever you want. Here is how I handled this.

I set up my UITabbarController like this in the AppDelegate:

UITabBarController tabBarController = [[UITabBarController alloc] init];
tabBarController.viewControllers = [NSArray arrayWithObjects:viewController1, 
                                             viewController2, 
                                             viewController3,
                                             nil];
//add the custom tabbarcontroller
CustomTabBar customTabBar = [[CustomTabBar alloc] initWithFrame:CGRectMake(0, self.window.frame.size.height - 60, self.window.frame.size.width, 62)];
    [self.tabBarController.view addSubview:_customTabBar];

tabBarController.tabBar.hidden = YES;
self.window.rootViewController = self.tabBarController;

The CustomTabBar is a subclass of UIView where I put my own custom buttons. When a button in this class is clicked, I make a call that looks like this:

-(void)firstBtnClicked:(id)sender {
    ((UIButton*)sender).enabled = NO;
    AppDelegate *delegate = (AppDelegate*)[UIApplication sharedApplication].delegate;
    delegate.tabBarController.selectedIndex = 0;
}

Answer 2

I would discourage you from messing with Apple's well thought out spacing for the tab bar. Don't do this - you're hacking a native control in a bad way and this will have consequences down the road. Also, you'll have to deal with different spacing and logic in landscape vs portrait mode. Don't complicate things unnecessarily, use it as designed or rethink whether a tab bar is the appropriate control.

Quoting from Apple's guidelines:

On iPad, display the same tabs in each orientation to increase the visual stability of your app. In portrait, the recommended seven tabs fit well across the width of the screen. In landscape orientation, you should center the same tabs along the width of the screen. This guidance also applies to the usage of a tab bar within a split view pane or a popover. For example, if you use a tab bar in a popover in portrait, it works well to display the same tabs in the left pane of a split view in landscape.