How to set an image on tab bar controllers? - objective-c

I am trying to change the image of a Tab Bar in my application. When I changed the image it was giving me a blank image instead.
Can I set .png format image?
Is it possible to change the color of the tab bar?
Can I use a colored image in the tab bar?

No, You can use .icon images for tabbar which has transparent background and black and white. It is possible to set color of tabbar also.
tabbar Color
CGRect frame = CGRectMake(0.0, 0, 320, 48);
UIView *v = [[UIView alloc] initWithFrame:frame];
[v setBackgroundColor:[UIColor colorWithRed:0.2 green:0.8 blue:0.4 alpha:0.3]];
//[v setAlpha:1.0];
[[tabbar tabBar] insertSubview:v atIndex:0];
[v release];

in iOS5 all of those things are possible!
UIImage *selectedImage0 = [UIImage imageNamed:#"TabBa1selected.png"];
UIImage *selectedImage1 = [UIImage imageNamed:#"TabBa2selected.png.png"];
UIImage *selectedImage2 = [UIImage imageNamed:#"TabBa3selected.png.png"];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
[item0 setFinishedSelectedImage:selectedImage0 withFinishedUnselectedImage:selectedImage0];
[item1 setFinishedSelectedImage:selectedImage1 withFinishedUnselectedImage:selectedImage1];
[item2 setFinishedSelectedImage:selectedImage2 withFinishedUnselectedImage:selectedImage2];
UIImage* tabBarBackground = [UIImage imageNamed:#"tabBarBackground.png"];
UIImage* tabBarSelected = [UIImage imageNamed:#"SelectedImage.png"];
[[UITabBar appearance] setBackgroundImage:tabBarBackground];
[[UITabBar appearance] setSelectionIndicatorImage:tabBarSelected];

You would typically set an image for your tab bar in the AppDelegate class. It likely has a tab bar controller defined as _tabBarController, so the code would be:
[[_tabBarController tabBar] setBackgroundImage:[UIImage imageNamed:#"imageName.png"]];
If the image provided is of the proper size or stretchable it will be that image, otherwise it will be the image tiled however many times it takes to fill the tab bar.
You could also change the tab color if you'd like.

Related

Navigationbar background image not fill navigationbar Objective-C

I need to add background image to navigationbar, I done the code but it shows below the status bar.How to display the image fully on navigationbar.(iOS 8).
What actually I need to achieve is like the image below
The code I used for navigationbar background image is
UIImage *navBarBackgroundImage = [UIImage imageNamed:#"NavigationBarImg"];
[[UINavigationBar appearance] setBackgroundImage:navBarBackgroundImage forBarMetrics:UIBarMetricsDefault];
[UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleLightContent;
Make UINavigationBar transparent
[self.navigationBar setBackgroundImage:[UIImage new]
forBarMetrics:UIBarMetricsDefault];
self.navigationBar.shadowImage = [UIImage new];
self.navigationBar.translucent = YES;

not able to see selected button image in iOS 7

I have app where I am using tab bar controller. For tab bar buttons, I have images of size 30x30 and 60x60.
When I run my app in iOS 6, it shows me selected image, however when I switch to iOS 7, it don't show me selected tab image. Any idea why this is happening?
Below are screenshots for the same.
iOS 6
iOS 7
Edit 1
On further investigation, I found that this is happening only with first two tab bar. From third to fifth, images are showing fine for iOS7.
Code used is
UIImage *selectedImage0 = [UIImage imageNamed:#"home_selected.png"];
UIImage *unselectedImage0 = [UIImage imageNamed:#"home.png"];
UIImage *selectedImage1 = [UIImage imageNamed:#"search_selected.png"];
UIImage *unselectedImage1 = [UIImage imageNamed:#"search.png"];
UIImage *selectedImage2 = [UIImage imageNamed:#"ad_with_us_selected.png"];
UIImage *unselectedImage2 = [UIImage imageNamed:#"ad_with_us.png"];
UIImage *selectedImage3 = [UIImage imageNamed:#"aboutus_selected.png"];
UIImage *unselectedImage3 = [UIImage imageNamed:#"aboutus.png"];
UIImage *selectedImage4 = [UIImage imageNamed:#"contacts_selected.png"];
UIImage *unselectedImage4 = [UIImage imageNamed:#"contacts.png"];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
UITabBarItem *item4 = [tabBar.items objectAtIndex:4];
[[UITabBar appearance] setSelectionIndicatorImage:[[UIImage alloc] init]];
[item0 setFinishedSelectedImage:selectedImage0 withFinishedUnselectedImage:unselectedImage0];
[item1 setFinishedSelectedImage:selectedImage1 withFinishedUnselectedImage:unselectedImage1];
[item2 setFinishedSelectedImage:selectedImage2 withFinishedUnselectedImage:unselectedImage2];
[item3 setFinishedSelectedImage:selectedImage3 withFinishedUnselectedImage:unselectedImage3];
[item4 setFinishedSelectedImage:selectedImage4 withFinishedUnselectedImage:unselectedImage4];
Edit 2
Also below is not working in iOS 7.
[tabItem setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIFont fontWithName:localize(#"fontNameN") size:10.0f], NSFontAttributeName, [UIColor greenColor], NSForegroundColorAttributeName,nil] forState:UIControlStateSelected];
and for forState:UIControlStateHighlighted also
Note
I had created this project in Xcode 4.2 and now for iOS 7, I am opening in Xcode 5. Will that be a problem?
Just use
[item0 setSelectedImage:selectedImage0];
and so on, because
setFinishedSelectedImage:withFinishedUnselectedImage:
is deprecated in iOS 7
Believe it or not
When I remove text that is default in Title and Image from IB, all is working perfectly now.
Apple only knows what was problem

tab bar item position not lined up with the background of the bar

Im having trouble trying to implement my own design to a tab bar. Somehow the items and background don't align correctly even tho they have the same height. The buttons seem to be further up than the background and i can't figure out why.
Code for implementing the items/buttons:
(this is added in my "viewDidLoad" in "Tab1ViewController.m", wich is the first of my 5 view controllers)
UIImage *selectedImage0 = [UIImage imageNamed:#"searchSEL"];
UIImage *unselectedImage0 = [UIImage imageNamed:#"search"];
UIImage *selectedImage1 = [UIImage imageNamed:#"homeSEL"];
UIImage *unselectedImage1 = [UIImage imageNamed:#"home"];
UIImage *selectedImage2 = [UIImage imageNamed:#"dareSEL"];
UIImage *unselectedImage2 = [UIImage imageNamed:#"dare"];
UIImage *selectedImage3 = [UIImage imageNamed:#"starSEL"];
UIImage *unselectedImage3 = [UIImage imageNamed:#"star"];
UIImage *selectedImage4 = [UIImage imageNamed:#"friendsSEL"];
UIImage *unselectedImage4 = [UIImage imageNamed:#"friends"];
UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *item0 = [tabBar.items objectAtIndex:0];
UITabBarItem *item1 = [tabBar.items objectAtIndex:1];
UITabBarItem *item2 = [tabBar.items objectAtIndex:2];
UITabBarItem *item3 = [tabBar.items objectAtIndex:3];
UITabBarItem *item4 = [tabBar.items objectAtIndex:4];
[item0 setTitle:#""];
[item1 setTitle:#""];
[item2 setTitle:#""];
[item3 setTitle:#""];
[item4 setTitle:#""];
[item0 setFinishedSelectedImage:selectedImage0 withFinishedUnselectedImage:unselectedImage0];
[item1 setFinishedSelectedImage:selectedImage1 withFinishedUnselectedImage:unselectedImage1];
[item2 setFinishedSelectedImage:selectedImage2 withFinishedUnselectedImage:unselectedImage2];
[item3 setFinishedSelectedImage:selectedImage3 withFinishedUnselectedImage:unselectedImage3];
[item4 setFinishedSelectedImage:selectedImage4 withFinishedUnselectedImage:unselectedImage4];
and to add the background i just added this code to my didFinishLaunchingWithOptions in my appDelegate.m
UITabBar *tabBar = [UITabBar appearance];
[tabBar setBackgroundImage:[UIImage imageNamed:#"bg"]];
The buttons are 64x49px and the background is 320x49px.
I wont be able to answer to or read comments in a while, but I will as soon as i can, hopefully someone can help.
Well, figured it out and it was kind of obvious. The part under the items are where the title should be. And since my icons just took up the icon space and not the title space, there was a emptiness under where the title would be.
Solved the problem by creating a whole background image for the bar and specified borders and gradient on that instead and just created the icons separately ass small white/black images and transparent background.

Custom tab bar size

I'm making a custom tab bar, i add a 320x82 background image and for each tab i have a selection image with height 82.
The problem is when a fit the tab bar frame with the background height (82) it gets a sort of shadow that its not on the original layout, and the selection images are not aligned. Here how i'm setting my tab bar:
self.tabBatController = [[UITabBarController alloc] init];
self.tabBarController.viewControllers = [NSArray arrayWithObjects:myView1, myView2, myView3, nil];
UIImage *tabBackground = [[UIImage imageNamed:#"tab_bar_background"] resizableImageWithCapInsets:UIEdgeInsetsMake(0,0,0,0)];
[[UITabBar appearence] setBackgroundImage:tabBackground];
UITabBar *tabBar = self.tabBarController.tabBar;
CGRect viewFrame = tabBar.frame;
viewFrame.origin.y -=41; //the correct position of the tab bar
viewFrame.size.height = 82; //the correct height
tabBar.frame = viewFrame;
UITabBarItem *item1 = [tabBar.items objectAtIndex:0];
UITabBarItem *item2 = [tabBar.items objectAtIndex:1];
UITabBarItem *item3 = [tabBar.items objectAtIndex:2];
//this set of images are not aligned with the tabs
[item1 setFinishedSelectedImage:[UIImage imageNamed:#"tab1_selected"] withFinishedUnselectedImage:[UIImage imageNamed:#"tab1_unselected"]];
[item2 setFinishedSelectedImage:[UIImage imageNamed:#"tab2_selected"] withFinishedUnselectedImage:[UIImage imageNamed:#"tab2_unselected"]];
[item3 setFinishedSelectedImage:[UIImage imageNamed:#"tab3_selected"] withFinishedUnselectedImage:[UIImage imageNamed:#"tab3_unselected"]];
The tab is with the correct size, but it has this shadow and the non aligned selection images. How can i correct that?

Move UIBarButtonItem few pixels down?

I have created a custom UINavigationBar which is a tiny bit taller than Apples default navigation bar.
I can’t seem to find a way to move the UIBarButtonItem down to be directly centered between the two dashed lines.
Is there an easy way to do this? I’ve tried creating a custom button but had no success. Ideally I would just like to move the default back button down a couple of pixels.
Code used to create UINavigationBar, custom header image and UIBarButtonItem:
//Create image for navigation background
UIImage *NavigationPortraitBackground = [[UIImage imageNamed:#"navbackground.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UINavigationBar appearance] setBackgroundImage: NavigationPortraitBackground
forBarMetrics:UIBarMetricsDefault];
//Centered title image
UIImageView *headerImage = [[UIImageView alloc] initWithImage: [UIImage imageNamed: #"hometitle.png"]];
[headerImage setFrame: CGRectMake(0, 0, 180, 49)];
self.navigationItem.titleView = headerImage;
UIBarButtonItem *backBarButtonItem = [[UIBarButtonItem alloc] init];
[backBarButtonItem setTintColor: [UIColor colorWithRed:0 green:69.0/255 blue:118.0/255 alpha:1]];
[backBarButtonItem setStyle: UIBarButtonItemStylePlain];
self.navigationItem.backBarButtonItem = backBarButtonItem;
[backBarButtonItem release];
Thanks in advance,
Create the UIBarButtonItem using a custom view. This custom view will be a UIView with the actual UIButton (as a subview) placed x pixels from the top (x=the number of pixels you want to move it down).
sorry
UIButton *myButton1 = [UIButton buttonWithType:UIButtonTypeCustom];
[myButton1 setImage:[UIImage imageNamed:#"back.png"] forState:UIControlStateNormal]; myButton1.showsTouchWhenHighlighted = YES;
myButton1.frame = CGRectMake(0.0, 3.0, 50,30);
[myButton1 addTarget:self action:#selector(back) forControlEvents:UIControlEventTouchUpInside]; UIBarButtonItem *leftButton = [[UIBarButtonItem alloc] initWithCustomView:myButton1];
self.navigationItem.leftBarButtonItem = leftButton;