How can I make a central raised time sheet element?

Question

First, I want to say that I am new to iPhone application development. I want to make tabbaritem when I select an item in a tab, then it should look like this:

Thanks a lot in the promotion.

Answer 1

To do this, you need to create your own tab bar for the Sub class UITabBarController .

TabBarController.h file:

 @interface TabBarController : UITabBarController<UITabBarControllerDelegate> { UITabBarController *tabController; UIImageView *img1; UIImageView *img2; UIImageView *img3; UIImageView *img4; } 

.m file

 - (void)viewDidLoad { [self loadTabView]; //[self viewWillAppear:YES]; [super viewDidLoad]; } - (void) loadTabView { tabController = [[UITabBarController alloc] init]; tabController.delegate = self; tabController.tabBar.backgroundColor = [UIColor clearColor]; //set offset for tabbar items images. int topOffset = 6; int bottomOffset = 6; UIEdgeInsets imageInset = UIEdgeInsetsMake(topOffset, 0, -bottomOffset, 0); [self.view addSubview:tabController.view]; } // reset the background image in custom tabbar. - (void) setTabBarBackground { UIImageView *img = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"btnbg.png"]]; img.frame = CGRectOffset(img.frame, 0, 1); img.frame = CGRectMake(img.frame.origin.x, img.frame.origin.y-1, img.frame.size.width, img.frame.size.height); [tabController.tabBar insertSubview:img atIndex:0]; [img release]; } // reset the background image in custom tabbar. - (void) resetTabBar : (NSString *) tabid { [img1 removeFromSuperview]; NSLog(@"tab id - %@",tabid); switch ([tabid intValue]) { case 0: img1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tab-1.jpg"]]; break; case 1: img1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tab-2.jpg"]]; break; case 2: img1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tab-3.jpg"]]; break; case 3: img1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tab-4.jpg"]]; break; case 4: img1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tab-5.jpg"]]; break; default: break; } img1.frame = CGRectOffset(img1.frame, 0, 1); [tabController.tabBar insertSubview:img1 atIndex:0]; [tabController.tabBar bringSubviewToFront:img1]; [img1 release]; } // here push View controllers - (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController { } 

Hope this gives you an idea.

Answer 2

Know that you have already answered, but wanted to offer an alternative approach.

Subclassing UITabBarController is a bad idea, according to the docs. I also had no problems when I actually tried to use the UIImagePickerController as one of the view controllers behind the subclass tab.

I used a much simpler approach by simply overlaying a uibutton on a tab element. An example project can be found here:

https://github.com/group6/RaisedCenterButton

This is just an example. You still have to do this work to include it in the application.

Answer 3

Use the information in this article.

Answer 4

This has been covered in several textbooks. As most of these applications achieve an effect, they place a custom UIButton that follows a similar style in the tab bar on top of the tab bar in the center.

iDev Recipes has a great tutorial with sample code

Answer 5

I would advise against this. IOS users use the familiar functionality of the tab bar. Highlighting is enough to tell them which tab they are on.

Your design idea is very attractive, but it is expensive. The area above the bar next to the sheared wall is lost, or the size of the other icons should be reduced. This will make it harder to use, not simpler.

Here's a good tip: take 2 hours from your busy life and read the Apple Human Interface Guides for iOS from cover to cover. Its a fascinating read and will give you a good guide for design issues like this.