Search code examples
iosuitabbartabbarcontroller

Custom and animated button in iOS Tab Bar

I'm trying to get a custom tab bar for iPhone (iOS 6) and I've got to manage a central button that raises over the bar (based on code, https://github.com/tciuro/CustomTabBar) but now I have to face another feature: buttons must blink when clicked and glossy effect has to be removed. Any suggestion about the best way to get that? I'm still relatively new programming with iOS and its animations.

Thank you very much

What I already have so far:

enter image description here

enter image description here

enter image description here

In MBCenteredButtonVC (main entry in storyboard)

#import <UIKit/UIKit.h>

@interface MBCenteredButtonViewController : UITabBarController <UITabBarDelegate>

@property(nonatomic, weak) IBOutlet UIButton *centerButton;


@end

And its implementation:

 - (void)viewDidLoad
   {
       [super viewDidLoad];

       [self.tabBar setSelectedImageTintColor:[UIColor colorWithRed:171/225.0 green:233/255.0 blue:8/255.0 alpha:1]]; 
       [self.tabBar setBackgroundImage:[UIImage imageNamed:@"bar-back.png"]];

    // Do any additional setup after loading the view.
      [self addCenterButtonWithImage:[UIImage imageNamed:@"button-rocketBg.png"] highlightImage:[UIImage imageNamed:@"button-rocketBg-active.png"] target:self action:@selector(buttonPressed:)];
   }

Images for each item is defined within views properties using XCode. So, this way, I get a central button raised over the rest and I have changed the color for selected items but I need that they blink while content is being loading (it supposed that could take some time).

I feel that I have to implement this functionality when buttons are pressed:

- (void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item
{
    NSLog(@"Selected tab bar item: %i", item.tag);


    }
}

but not sure if it the right way and how to do it exactly.

Solution

  • The easiest way to get started with animations on iOS is probably to use the UIView animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations method.

    Documentation here: https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIView_Class/UIView/UIView.html#//apple_ref/doc/uid/TP40006816-CH3-SW111

    Any values that are animatable that you change in that block will be animated.

    Core Animation is extensive, and this barely scratches the surface of what can be done, but it might be enough to get you started.