Customizing Navigation Bar in iOS7

Posted By : Ashish Tyagi | 02-Dec-2013

Recently, Apple release iOS 7 for their mobile application with some new features or Changes.Here, we will familiar with the changes of Navigation Bar and Status Bar for iOS 7. The status bar is now transparent, that means the navigation bar is shows behind it. In some cases, the background image for a navigation bar can extend up behind the status bar.

Changing the Background Color of Navigation Bar

In iOS 7, the tintColor property is no longer used for setting the color of the bar. Instead, use the barTintColor property to change the background color. You can insert the below code in the didFinishLaunchingWithOptions: of AppDelegate.m.

[[UINavigationBar appearance] setBarTintColor:[UIColor grayColor]]; // Used in iOS7
[[UINavigationBar appearance] setTintColor:[UIColor grayColor]]; // Used in lower version (Like iOS6)
        

Changing Color of Bar Button of Navigation Bar

If you want to change default image of button with your custom image , you have to set the backIndicatorImage and backIndicatorTransitionMaskImage to your image.

 [[UINavigationBar appearance] setBackIndicatorImage:[UIImage imageNamed:@"back_button.png"]];
 [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:[UIImage imageNamed:@"back_button.png"]];
        

Handling Overlapping Problem of Navigation Bar in iOS7

Status bar appearance is controlled along one of two mutually-exclusive basis paths: you can either set them programmatically in the traditional manner. The latter option is on by default. Check your app’s plist value for “ViewController-Based Status Bar Appearance” to see which one you’re using.

If you set this value to YES, every top-level view controller in your app (other than a standard UIKit container view controller) needs to override preferredStatusBarStyle, returning either the default or the light style.

you have to edit the plist value to NO as shown in Image below

Now, Open your AppDelegate.m file and add following code in didFinishLaunchingWithOption Method as given bellow

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
   
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
        
        [application setStatusBarStyle:UIStatusBarStyleLightContent];
          self.window.clipsToBounds =YES;
          self.window.frame =  CGRectMake(0,20,self.window.frame.size.width,self.window.frame.size.height-20);
 [[UINavigationBar appearance] setBarTintColor:[UIColor grayColor]];
    }
   else    {
        [[UINavigationBar appearance] setTintColor:[UIColor grayColor]];
    }
        return YES;
}

        

Changing The Status Bar Style Per Controller

Set the value UIViewControllerBasedStatusBarAppearance to YES in your Info.plist and override:

- (UIStatusBarStyle)preferredStatusBarStyle
 {
     return UIStatusBarStyleLightContent;
 }
        

Hope it is useful for you :)

Aashish Tyagi

[email protected]

About Author

Author Image
Ashish Tyagi

Ashish is a iPhone application developer with experience in Objective-C , Titanium and Phonegap frameworks. Ashish loves watching movies in his free time.

Request for Proposal

Name is required

Comment is required

Sending message..