UITabBar Arrow Indicator for iPad

Question

Following this tutorial, i ended up with a nice arrow for my UITabBar in iPhone.

Now i wanted to do the same for iPad, but it seems to not work.

I tried

- (CGFloat) horizontalLocationFor:(NSUInteger)tabIndex
{   
    CGFloat tabItemWidth;
    CGFloat halfTabItemWidth;
    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        tabItemWidth = 320 / tabBarController.tabBar.items.count;
        halfTabItemWidth = (tabItemWidth / 2.0) - (tabBarArrow.frame.size.width / 2.0);
    }
    else 
    {
        tabItemWidth = 768 / tabBarController.tabBar.items.count;
        halfTabItemWidth = (tabItemWidth / 2) - (tabBarArrow.frame.size.width / 2);
    }

    return (tabIndex * tabItemWidth) + halfTabItemWidth;
}

following the example, taking the tabBar dimensions for iPad, but the arrow is still so far from being in the middle of each tab.

Any help?

Answer 1

Try this in place of the current "horizontalLocationFor" method you have:

- (CGFloat) horizontalLocationFor:(NSUInteger)tabIndex
{
    // Get the frame of the selected tab item's view.
    // Add one becuase the first subview is the not a button.
    CGRect tabFrame = [[[[[self tabBarController] tabBar] subviews] objectAtIndex:tabIndex+1] frame];

    // Add tab x to half tab width and substract hald arrow image width to center it.
    return tabFrame.origin.x + (tabFrame.size.width * .5) - (tabBarArrow.frame.size.width * .5);
}

The original solution assumed that the tab bar width was the entire screen, but on ipad 4 items only fills a portion of the tab bar width, hence dividing the width by the number of items doesn't get you the correct positions.