How to customize UITABBAR IOS 5.0? - ios5

I have to customize the images in tabbar items for insert an image in my icon, how can I do?
I heard from my friend that I should create a new xib and work it to do a new tabbar item customized .
Is it true?
thanks a lot!

just put the below method in
appdelegate.m
File
- (void)customizeAppearance
{
// Costomise UITabBar
// Note you can also specify “finished” and “unfinished” images if you wish to modify the manner in which the selected & unselected images appear.
UIImage *tabBackground = [[UIImage imageNamed:#"tab_bg"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UITabBar appearance] setBackgroundImage:tabBackground];
[[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:#"tab_select_indicator"]];
}
this may help you
Please find much more on this site

Related

iOS 7 UINavigationBar Background image hides Title view

I made iOS app, in which i want my app to compatible with iOS 7
Problem which i am facing is, when i run my app on iOS 7, Background image of my UINavigationBar hides my titleview and back button
:
-(void)viewDidLoad
{
[super viewDidLoad];
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:#"top.png"] forBarMetrics:UIBarMetricsDefault];
self.title=#"Artist";
self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:#"Back" style:UIBarButtonItemStylePlain target:nil action:nil];
}
also when, i set Background image of UINavigationBar to nil it shows titleview and back button
When i run my apps prior to iOS 7 it works properly.
Please help.
Thanks in advance.
Behavior of tintColor for bars has changed on iOS 7.0, please check the image below:
You can see that
tintColor: is the color for the interactive elements within a navigation bar including button images and titles.
barTintColor is the background color of the UINavigationBar.
For your issue: you can do the below:
navigationBar.tintColor = [UIColor whiteColor];
navigationBar.barTintColor = [UIColor colorWithRed:6.0/255.0 green:12.0/255.0 blue:19.0/255.0 alpha:1.0];
The default font color is black so you are probably drawing a black font on a black background. Try the following:
[[UINavigationBar appearance] setTitleTextAttributes:
[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor whiteColor], NSForegroundColorAttributeName,nil]];
check the property extend edges on the property inspector of your view this will extend the edges from the bottom of your navigation bar to the top of your screen so your background image will be at the right place
check the transition guide for ios7 if you want more info about new things in ios7
https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/TransitionGuide/index.html
following code worked for me
In viewDidLoad
self.navigationController.navigationBar.tintColor=[UIColor whiteColor];

Most idiomatic iOS5 way of customizing the UINavigationBar?

I'm working on customizing the appearance of navigation controllers in my app to look like the following:
As I've discovered after a few hours of SO research, there are a ton of different ways of doing it, some really hackish, some much less so. I'm interested in finding out the Apple-blessed / most elegant way of achieving this that will lead to the least amount of pain down the road as the app grows. Some approaches I've looked into so far:
1) I changed the background / height of the navigation bar by applying an image through [UINavigationBar appearance], seems to have worked fine.
UIImage *navBarImage = [UIImage imageNamed:#"navigation-bar.png"];
[[UINavigationBar appearance] setBackgroundImage:navBarImage
forBarMetrics:UIBarMetricsDefault];
Seems like the most "modern" way of achieving background/height change, although it most likely doesn't survive an orientation change. Any improvements that could be made here?
2) I replaced the default back button with the following in the viewDidLoad of the pushed view
// Set the custom back button
UIImage *buttonImage = [UIImage imageNamed:#"back.png"];
//create the button and assign the image
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:buttonImage forState:UIControlStateNormal];
//set the frame of the button to the size of the image (see note below)
button.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[button addTarget:self action:#selector(back) forControlEvents:UIControlEventTouchUpInside];
// offset the back button
button.contentEdgeInsets = UIEdgeInsetsMake(10, 5, -10, -5);
//create a UIBarButtonItem with the button as a custom view
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.leftBarButtonItem = customBarItem;
I'm not very pleased with this solution because it leaves customization of the bar to the controller on top of the navigation stack. From the Apple docs it would seem like they'd prefer you to subclass the UINavigationBar altogether and replace it once and for all in the navigation controller:
You can also specify a custom UINavigationBar subclass by using the initWithNavigationBarClass:toolbarClass: method to initialize the navigation controller.
Would that be the advised route? I was NOT able to replace the default Back button of the UINavigationBar through [UIBarButtonItem appearance] as it still attempts to display text in the button, and when you remove the text, the button isn't displayed at all. Suggestions?
3) The page title should be replaceable with another view through navigationItem.titleView. Anything better out there?
Thanks!
1) You should set two images, for two UIBarMetrics (UIBarMetricsDefault and a separate image for UIBarMetricsLandscapePhone). Thus
UIImage *navBarImage = [UIImage imageNamed:#"navigation-bar.png"];
UIImage *navBarImage_Landscape = [UIImage imageNamed:#"navigation-bar-landscape.png"];
[[UINavigationBar appearance] setBackgroundImage:navBarImage
forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:navBarImage_Landscape
forBarMetrics:UIBarMetricsLandscapePhone];
2) You could either subclass UINavigationBar (as you've also mentioned and that would be the default Apple way). Or if it's just the button, maybe you could hack its behaviour by passing in " " (empty text)
3) Not sure what you meant. You could setTitle of the navigation bar and it would show whatever title you want. Or you should be able to plug in another view for titleView
Note that setBackgroundImage is iOS 5.0 and later.

UINavigationBar Custom Title View

I am using iOS 5 UINavigationBar's UIAppearance protocol in order to customise all my navigation bars.
Here is my customisation function:
- (void)customizeApperance
{
[[UINavigationBar appearance] setTintColor:[UIColor clearColor]];
[[UINavigationBar appearance] setAlpha:0.7];
UIImageView *titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"title.png"]];
[[UINavigationBar appearance] setTitleView:titleView];
}
I have two problems:
The first is that the colour not appearing as clearColor but black. Any suggestions?
The title view is not appearing at all. Ray Wenderlich shows how to do that by adding a: [[rootViewController navigationItem] setTitleView: [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"miniLogo.png"]]] in applicationDidFinishLaunching. But the problem with this is that the title view would only be added in the root view controller. I am using a UINavigationController and when I tired to replace the rootViewController with navigationController (the name of my navigation controller in AppDelegate), I cannot see the title view at all. How can I fix that? Why isn't it working in customizeApperance()? Isn't the whole point of using appearance is to just create a title view once (as I did above the function) and have it global in all navigation bars? How can I achieve that?
[UIColor clearColor] is a fully transparent color (alpha = 0). Setting that as tint color makes the (black) background shine through. Perhaps you want [UIColor whiteColor] ?
titleView is a property of UINavigationItem, and each view controller has it's own navigationItem. Therefore you cannot set a title view globally. But you can set the background image of UINavigationBar with the appearance protocol, perhaps that helps:
[[UINavigationBar appearance] setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
Have you tried titleView.opaque = NO;? If that's set to YES (i.e. by default, since you're using initWithImage:), the drawing system will assume your view fills its entire bounds, and won't bother drawing anything that overlaps its frame.
setTitleView: is a method on NavigationItem. But you are calling it on navigation bar

Adding image to iPhone navigation bar

I want to replace the current nav bar with a custom image. How my code is structured is that a tab bar controller controls a bunch of navigation controllers which contain views (tab bar controller -> nav controller -> view). I tried using this code in my app delegate
#implementation UINavigationBar (UINavigationBarCategory)
- (void)drawRect:(CGRect)rect {
UIColor *color = [UIColor blackColor];
UIImage *img = [UIImage imageNamed: #"nav.png"];
[img drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
self.tintColor = color;
}
#end
But it did not work. Any ideas why? Should I have placed it somewhere else? Thanks!
if you are using iOS 5, you can use setBackgroundImage: like this where ever you initialized the navigation controller (aNavigationController in this example):
[aNavigationController.navigationBar setBackgroundImage:[UIImage imageNamed:#"nav.png"] forBarMetrics:UIBarMetricsDefault];
I would not use a category. I would subclass UINavigationBar instead. See this: https://stackoverflow.com/a/6959354/472344
If you are targeting iOS 5 or up, use #BJH's solution instead.

How to customize UITabBar text labels?

I have customized a Tab Bar using the methods from Ray Wenderlich and iOS Blog but because I'm using a light color as background the text labels look awful and I want to change them to match my style. Is it possible and how?
If its not possible or if its too complex I would like to ask how to move the icon image down so its centered on the Tab Bar? This way I could "write" the labels on the .png files.
I'm planning on developing this app for iOS5+ so there is no worry about making it compatible with iOS4 (although if anyone finds a easy way of doing this I would really appreciate).
Here's what I got so far and here's what I want.
The code for my tabBarBackground:
UIImage* tabBarBackground = [UIImage imageNamed:#"tabbar.png"];
[[UITabBar appearance] setBackgroundImage:tabBarBackground];
[[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:#"selection-tab.png"]];
And for the Icons:
//Custom TabBar Items
UIImage *selectedImage = [UIImage imageNamed:#"home-icon-selected.png"];
UIImage *unselectedImage = [UIImage imageNamed:#"home-icon.png"];
UITabBar *tabBar = rootTabBarController.tabBar;
//Icons for the 1st Tab
UITabBarItem *item1 = [tabBar.items objectAtIndex:0];
[item1 setFinishedSelectedImage:selectedImage withFinishedUnselectedImage:unselectedImage];
You can do this by accessing the tab-bar item object of the tabbar for each view controller.
Check out some documentation here for more examples.
http://developer.apple.com/library/ios/#featuredarticles/ViewControllerPGforiPhoneOS/CombiningViewControllers/CombiningViewControllers.html
Use this to customize UITabBarItem text:
[[UITabBarItem appearance] setTitleTextAttributes: aNSDictionaryOfTextAttributes];
with a dictionary of attributes similar to those shown in the answer here.