custom uitableview with a tab bar on top ios

Question

http://www.iospirations.com/component/iphoneinspirations/detail/198-burgerquest

screenshot

                                  

I was wondering what I need to know to create a screen like this. I want to design the table with the tabs and also buttons across the bottom which seems to be a tab bar. I was looking around and I was thinking I might need to create a custom container class to re-position the tab bar to the position of the tabs on top of the table. But it also seems like there's a tab bar at the bottom. I'm not sure if that's even possible to create to tab bars in one view. If anyone can point me in the right direction I would appreciate it.

Answer 1

In answer to a small part of your question, multiple tab bars is a definite no no. A standard UITabBarViewController is intended only to be the root view controller for a window. It might work, but it will eventually break in an iOS update. Been there.

Answer 2

Here are the step you need to follow in order to make the following view :-

1: Take a UITabBarController and set it as the rootViewController of your application window.

2: Now add Five Tab to this UITabbarController .

3: Add five seperate UINavigationController to each Tab individually.

4: Now add five different UIViewControllers to the UINavigationController respectively.

5: Create a Custom Tabbar now :

5.1 : One of the way of creating custom Tabbar is to take a UIView of Tabbar height and add UIButtons as Tab to the Tabbar.

6: Add the Custom tabBar on to the MainWindow . On choosing various button on your custom tabbar change the setSelectedIndex of your application UITabbarController.

7: Now how to create the view you showed in screenshot ,

7.1: Take two buttons on the Top of a UITableView (in your case for "Last" & "Top 10") . Now whenever the user clicks on any button change the background image (image indicating selected state) for that button and also simulataneuosly changes the image for other button (image indicating unselected state ).

7.2: Also reload the tableView everytime time any of the buttons clicked with the different data for both the button

8: You can create custom UITableViewCell in order to create Rows in the TableView. Here is link explaining how to create custom UITableViewCell:- http://mobile.tutsplus.com/tutorials/iphone/customizing-uitableview-cell/

Answer 3

If I was doing this from scratch, I'd use a UITabBar at the bottom and a UISegmentedControl at the top. These can both be customised to whatever style you're looking for (as long as you're using iOS5+).