I think my title is what i am looking for. So, i have a tab bar with 4 view controllers. I started to configure my app within storyboard and i configured my tab bar controller from there. I, also, have declared the names of the view controllers in my appdelegate file. My question is the following. Can i add a button in the middle of my tab bar controller? I searched a lot about that and i didn't find a complete solution. Can i use storyboard to connect my view controllers to the tab bar and also app delegate to declare that button to the center of tab bar? Please help. This is my code so far in app delegate file (anything else is in storyboard, juts the view controllers connected to tabbarcontroller) :
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
Assign tab bar item with titles
UITabBarController *tabBarController = (UITabBarController *)self.window.rootViewController;
tabBarController.selectedIndex = 1;
UITabBar *tabBar = tabBarController.tabBar;
UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:3];
UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:4];
tabBarItem1.title = #"Tab1";
tabBarItem2.title = #"Tab2";
tabBarItem3.title = #"Tab3";
tabBarItem4.title = #"Tab4";
[tabBarItem2 setFinishedSelectedImage:[UIImage imageNamed:#"maps_selected.png"] withFinishedUnselectedImage:[UIImage imageNamed:#"maps.png"]];
// Change the tab bar background
UIImage* tabBarBackground = [UIImage imageNamed:#"TAPBARBGR.png"];
[[UITabBar appearance] setBackgroundImage:tabBarBackground];
[[UITabBar appearance] setSelectionIndicatorImage:[UIImage imageNamed:#"tabbar_selected.png"]];
// Change the title color of tab bar items
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor whiteColor], UITextAttributeTextColor,
nil] forState:UIControlStateNormal];
UIColor *titleHighlightedColor = [UIColor colorWithRed:153/255.0 green:192/255.0 blue:48/255.0 alpha:1.0];
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
titleHighlightedColor, UITextAttributeTextColor,
nil] forState:UIControlStateHighlighted];
return YES;
}
Thank you.
If you connect 4 pages to the standard UITabbarController it will layout 4 buttons equally dividing the space between them. You don't have any control how they are laid down. You can rearrange them in the storyboard or in the code but with 4 buttons - no button will be in the middle.
You can add 5th button and rearrange it to the 3rd position, so this one will be in the middle of tabbar. Or you can look for 3rd party custom tabbar implementations - there are bunch of them on gitnub and other places. Some of them would have specific middle page that styled differently from others.
Can i add a button in the middle of my tab bar controller?
No.
Assuming that you mean adding a button different from the other tab bar items, then no, UITabBar doesn't provide for this. As explained in the UITabBar documentation, all items in a tab bar are expected to be tab bar items, but you could consider a UIToolbar instead:
Each button in a tab bar is called a tab bar item and is an instance
of the UITabBarItem class. If you instead want to give the user a bar
of buttons that each perform an action, use a UIToolbar object.
From a user experience point of view (IMO) it's probably not a good plan to try to mix tab bar and tool bar functionality.
Related
Note, I've recently come back to this and it seems to have been fixed in more recent versions of the SDK, without me having to implement anything except the code in the question. Many thanks to all who answered.
I have an Objective-C app that runs on the iPad and displays a view controller with a modal presentation style of UIModalPresentationPageSheet:
UINavigationController *editorNavigationController = [[UINavigationController alloc] initWithRootViewController:editorViewController];
editorNavigationController.modalPresentationStyle = UIModalPresentationPageSheet;
[navigationController presentViewController:editorNavigationController animated:YES completion:nil];
When this view controller is displayed the buttons in the navigation bar are purple, which I assume has been picked up from the window's tint colour, which is what I want.
Later I need to display another view controller over the top, that fills the whole window:
UINavigationController *previewNavigationController = [[UINavigationController alloc]initWithRootViewController:myPreviewViewController];
[owningViewController presentViewController:previewNavigationController animated:YES completion:nil];
The problem I have is that when myPreviewController is displayed, the buttons in the navigation bar are grey. I've tried reinstating the colour on the new navigation controller:
previewNavigationController.navigationBar.tintColor = [UIColor colorWithRed:123/255.0 green:26/255.0 blue:69/255.0 alpha:1];
but without any joy.
How can I get the buttons to have the correct colour? Can I get the new navigation controller to pick up the window tint colour automatically, or do I have to set it explicitly? Is this something to do with presenting the second navigation controller over the top of one that uses UIModalPresentationPageSheet?
Any help much appreciated! Thanks,
Paul
You can set the navigationBar translucent and transparent.
In view Will Appear:
self.navigationController.navigationBar.translucent = NO;
Than create a UIView with frame size of navigationBar (CGRectMake(0,0,self.view.frame.size.height,22) and create buttons on it with color you need.
I know, thats a crutch but should work)
You can change the appearance of the UIBarButtonItem globally so all UINavigationControllers will share the same design:
[[UIBarButtonItem appearance] setTintColor:[UIColor purpleColor]];
[[UIBarButtonItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
[UIFont fontWithName:#"fontName" size:16.0f],NSFontAttributeName,
nil] forState:UIControlStateNormal];
Additionally you could also change the [UINavigationBar appearance]:
//The setTintColor would tint the < Back button in the NavigationBar
[[UINavigationBar appearance] setTintColor:[UIColor greenColor]];
[[UINavigationBar appearance] setBarTintColor:[UIColor redColor]];
[[UINavigationBar appearance] setTitleTextAttributes:
#{NSForegroundColorAttributeName:[UIColor blueColor]}];
This code can be add it before presenting the UIViewControllers or simply in the AppDelegate.m.
Earlier I used a navigationcontroller with this code :
self.navigationItem.title = #"News";
Now I have the problem that I no longer needed the navigationcontroller as I am using a page controller for navigation. Now I added a navigationbar however it doesn't change the title with this code anymore.
Also how can I change the background color?
IN iOS 7 use write following code in didFinishLaunchingWithOptions
if ([[UINavigationBar class] respondsToSelector:#selector(appearance)])
{
[[UINavigationBar appearance] setBarTintColor:[UIColor colorWithRed: 4.0/255.0 green:173.0/255.0 blue:214.0/255.0 alpha:1.0f ]]; //// change background color of navigationBar
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]]; /// set backButton color of navigation bar
[[UINavigationBar appearance] setTitleTextAttributes:#{NSForegroundColorAttributeName : [UIColor whiteColor]}]; // set title color
[[UIBarButtonItem appearanceWhenContainedIn:[UINavigationBar class], nil] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor whiteColor], UITextAttributeTextColor,nil] forState:UIControlStateNormal]; /// set all barButton item color
self.navController.navigationBar.translucent = NO;// set translucent NO
}
Use as per your requirement.
So there is some magic happening when you use a navigation controller that you don't see and now that you've made the switch to justing using a navigation bar you lose that magic.
Navigation bars are responsible for managing and presenting UNavigationItems, and as such hold an array of them. A NavigationItem holds things like left and right buttons, and the title or titleView. When your navigation controller pushes a new controller, it creates a brand new UINavigation item then links it to your new view controller, and then pushes that onto navigation bars stack of nav items. That's why from within your view controller you set the title with self.navigationItem.title instead of referencing the navbar.
Basically you have to manage the bar and nav items yourself now. This should about do it for you:
_navBar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, yOffset, CGRectGetHeight(size), height)];
_navItem = [[UINavigationItem alloc] initWithTitle:#"My navbar title"];
[_navBar setItems:#[_navItem]];
[self.view addSubview:_navBar];
Of course you'll have to manage the size a bit differently as my example comes from an app where it's being used in landscape mode.
I have subclassed UINavigationBar to have a custom navigation bar within my application. The bar is re-used on multiple view controllers with the same style Menu button as the left button item, which is why it is subclassed.
The subclass is then added to the View Controllers navigation bar in the storyboard.
This is the code within the UINavigationBar subclass:
- (void)drawRect:(CGRect)rect
{
// Drawing code
UIImage *image = [[UIImage imageNamed: #"mainNavBar"] resizableImageWithCapInsets:UIEdgeInsetsMake(0,5,0,5)];
[image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
}
-(void)awakeFromNib {
UIButton *leftButton = [[UIButton alloc]initWithFrame:CGRectMake(7.0f, 7.0f, 38.0f, 29.0f)];
[leftButton setImage:[UIImage imageNamed:#"menuBarItem"] forState:UIControlStateNormal];
[leftButton addTarget:nil action:#selector(menuItemPressed:) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:leftButton];
}
The issue is Rotation of the Device. I also have some code in appDidFinishLaunching using the appearance API for additional setup:
// Custom Navigation Bar appearance setup
[[UINavigationBar appearance] setTitleTextAttributes: [NSDictionary dictionaryWithObjectsAndKeys:
[UIColor colorWithRed:245.0/255.0 green:245.0/255.0 blue:245.0/255.0 alpha:1.0], UITextAttributeTextColor,
[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.5],UITextAttributeTextShadowColor,
[NSValue valueWithUIOffset:UIOffsetMake(0, 1)],
UITextAttributeTextShadowOffset,nil]];
// Used to deal with the rotation of the nav bar when implemented outside of Navigation Controller
[[UINavigationBar appearance] setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleHeight];
[[UINavigationBar appearance] setContentMode:UIViewContentModeScaleAspectFit];
// Used to push the title down slightly when in Landscape and NavBar outside of Navigation Controller
[[UINavigationBar appearance] setTitleVerticalPositionAdjustment:2 forBarMetrics:UIBarMetricsLandscapePhone];
When the device rotates it all works correctly in terms of the bar scaling in height as expected from 44 to 32px. However, the buttons still appear out side of the bar.
I have looked through some other SO posts on this, but cannot figure how to complete this correctly: iPhone: UINavigationBar with buttons - adjust the height
UINavigationBar autoresizing
Ideally I do not want to have to deal with the auto rotation in a View Controller because this UINavigationBar is re-used through a large amount of VCs. Adding in auto rotation code would mean each of the VCs would potentially need this too?
EDIT - following answer
If I change the awakeFromNib to include the following:
UINavigationItem* ni = [[UINavigationItem alloc] initWithTitle:#"Test"];
UIImage *menuBgImage = [UIImage imageNamed:#"menuBarItem"];
UIBarButtonItem *b =[[UIBarButtonItem alloc] initWithImage:menuBgImage landscapeImagePhone:menuBgImage style:UIBarButtonItemStylePlain target:nil action:#selector(menuItemPressed:)];
ni.leftBarButtonItem = b;
self.items = #[ni];
I have the issue of the UIBarButtonItemStylePlain ruining the image:
If I complete the previous setup with initWithCustomView and use the leftButton from the original code. With the leftButton using the autoresize for height- I then get a badly stretched image in landscape?
EDIT 2 - Additional image per answer
[self addSubview:leftButton];
That's the problem. This is not how you add things to a UINavigationBar! You must start with a UINavigationItem and set its buttons to a UIBarButtonItem. The bar button items will be adjusted when the navigation bar is resized.
Here is a simple example to get you started (could go in your awakeFromNib):
UINavigationItem* ni = [[UINavigationItem alloc] initWithTitle:#"Test"];
UIBarButtonItem* b = [[UIBarButtonItem alloc] initWithTitle:#"Howdy"
style:UIBarButtonItemStyleBordered
target:self action:#selector(pushNext:)];
ni.leftBarButtonItem = b;
self.items = #[ni];
However, note that this is not going to work if you then use this UINavigationBar as part of a UINavigationController! The left bar button will be pushed off by the view controller's navigationItem. If this is part of a standard navigation interface, just have every navigation controller add the left bar button item.
Also you should not be implementing drawRect. Set the nav bar's background image instead.
I am customizing my TabBar Icons and I'm having a problem with the customized tab graphics not showing up until the first time they are clicked on, except for the first tab. The setup is as follows Entry->VC->Tab Controller->TabVC1->TabVC2->TabVC3->TabVC4->TabVC5. What is the best way to get them showing up on first initialization of the tab controller.
** These attributes are set when I enter the tab controller (they work fine)
// Set background to white for the tab bar
UIImage *tabBackground = [[UIImage imageNamed:#"tabback.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UITabBar appearance] setBackgroundImage:tabBackground];
// setting the selected color to blue
self.tabBar.tintColor = [UIColor blueColor];
// changing the tab bar text color
[[UITabBarItem appearance] setTitleTextAttributes: [NSDictionary dictionaryWithObjectsAndKeys: [UIColor blackColor], UITextAttributeTextColor,[UIFont fontWithName:#"Copperplate-Bold" size:0.0], UITextAttributeFont, nil] forState:UIControlStateNormal];
** these are set in the individual TabVCs (they show up only after the first time their tab has been clicked)
// loading the custom icon for front and back
UITabBarItem *tabicon = [[UITabBarItem alloc] initWithTitle:#"Daily" image:[UIImage imageNamed:#"Day.png"] tag:0];
[tabicon setFinishedSelectedImage:[UIImage imageNamed:#"Day.png"] withFinishedUnselectedImage:[UIImage imageNamed:#"Day.png"]];
[self setTabBarItem:tabicon];
First of all your tab bar controller should be your root view controller. That is, the rootViewController of your window.
From the documentation:
When deploying a tab bar interface, you must install this view as the
root of your window. Unlike other view controllers, a tab bar
interface should never be installed as a child of another view
controller.
Also, since you call self.tabBar I get the feeling you are subclassing UITabBarController.
The documentation advice against this as well.
That being said, you can set up the tab bar items where ever you do your first appearance set up (the first code snippet).
For instance to alter the second view controllers tab item you would do
// loading the custom icon for front and back
UITabBarItem *tabicon = [[UITabBarItem alloc] initWithTitle:#"Daily" image:[UIImage imageNamed:#"Day.png"] tag:0];
[tabicon setFinishedSelectedImage:[UIImage imageNamed:#"Day.png"] withFinishedUnselectedImage:[UIImage imageNamed:#"Day.png"]];
UIViewController *second = [self.viewControllers objectAtIndex:1];
[second setTabBarItem:tabicon];
The point is that you need to set up the custom appearance before the tab bar view has appeared.
Set the custom tabBarItem in your designated init method. This way it will get set when the controller is initialized and you wont have to wait until it is displayed for the first time to see your custom tabBarItem.
For example, here is an example in Swift, and where the controller is setup in a storyboard:
required init(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
self.tabBarItem = getTabBarItem(NSLocalizedString("Calendar", comment: ""), UIImage(named: "851-calendar.png")!)
}
Note that getTabBarItem() is a custom function of mine that returns a UITabBarItem.
I have a reference of UIViewController. From that reference i want to get references to all my navigation bar and bar button items and apply custom styles on them.
How can i achieve this on iOS 5?
You can do something like that.
[backbutton setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor blackColor],UITextAttributeTextColor,[UIFont fontWithName:TEXTFONT size:16.0f],UITextAttributeFont,
nil] forState:UIControlStateNormal];
Assuming your view controller has a navigation controller, you should be able to access the navigation bar and its items using the following code:
UINavigationBar *navBar = [myViewController.navigationController.navigationBar];
NSArray *navBarItems = navBar.items;