Really cool way to create custom UITabBar for iPhone app?

Question

I am doing a lot of researching lately about how to get a different looking with nice effects UITabBar on my iPhone app, but unfortunately I am only finding things on how to replace background color etc.

Well, I've checked out this app called Momento which is pretty cool and presents a very slick tabBar:

So there are a couple of elements here I would like to ask you guys if you could help me by giving me the right directions on how to get a similar effect :)

• Arrow above items: as you can see this app has this animated arrow that runs above the selected item with a very smooth animation.

• Selected Stated of the item's image is not that blue-ish default one neither the default state which displays in a different shade of brown and gray version.

• nice Items separators with beveled vertical lines.

• different background image for the tabBar

• different height for the tabBar

At this point after some research I am able to set the height and background image by subclassing UITabBarController but I'm still not sure on how to accomplish the other items specially the first one related to the nice arrow effect.

How do I do this? Please clarify what can or can't be done by subclassing the UITabBarController and specially if can be done in Interface Builder.

Answer 1

There's a project on github called BCTabBarController that aims to mimic the tab bar used in Twitter for iPhone. It's got some of the things you're looking for, and should give a great starting point.

Answer 2

Both of these are good answers, but both libraries have problems: BCTabBarController doesn't know how to create the "blue" highlighted version of a tab bar icon; and iDevRecipies doesn't send events to child viewcontrollers nor resize the navigation bar on rotate.

Be warned: custom nav bars are a lot of trial-and-error debugging (as I have found).

Answer 3

Simply use a UIView with TabBar width and height.Add custom background image and custom buttons on the view.Set the fileowner of the view as AppDelegate.Now you can simply connect the IBActions with the buttons.The Custom view can be placed over the tabbar by addSubView to the TabBar controller's view.You can switch between viewcontrollers by using the setSelectedIndex method of tableviewcontroller in the button action.