I have a custom UIBarButtonItem with an image that works fine in iOS 6.1. But iOS 7 has a tintColor and it overlays this color over my image. If I set the tintColor to [UIColor clearColor] the button doesn't show up all together.
How can I have my back button show up in iOS 7 as it does in iOS 6? Please help?
You should use appearance on UINavigationBar to globally set the custom back button.
[UINavigationBar appearance].backIndicatorImage = customBackButton;
[UINavigationBar appearance].backIndicatorTransitionMaskImage = customBackButton;
Try to set UIBarButtonItem like this way in ios7:-
UIImage *temp = [[UIImage imageNamed:#"theImage"] imageWithRenderingMode: UIImageRenderingModeAlwaysOriginal];
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithImage:temp style:UIBarButtonItemStyleBordered target:self action:#selector(action)];
Here is an original post in apple Dev center discussion Forums
For supporting both version iOS7 as well as lower then you check system-version and set code like:-
UIImage *temp=nil;
if([[[UIDevice currentDevice] systemVersion] floatValue] < 7.0)
{
temp = [UIImage imageNamed:#"btn-back.png"];
}
else
{
temp = [[UIImage imageNamed:#"btn-back.png"] imageWithRenderingMode: UIImageRenderingModeAlwaysOriginal];
}
The following seems to make a bit more sense for people who don't want to mess with the existing target action, etc. Just copy and paste. Also this forces iOS to use your image with all of its flairs -- as opposed to simply using a template/impression of the image.
- (void)setCustomNavigationBackButton
{
UIImage *backBtn = [UIImage imageNamed:#"arrow"];
backBtn = [backBtn imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
self.navigationItem.backBarButtonItem.title=#"";
self.navigationController.navigationBar.backIndicatorImage = backBtn;
self.navigationController.navigationBar.backIndicatorTransitionMaskImage = backBtn;
}
arrow is the name of your image.
swift version:
var backBtn = UIImage(named: "return_menu")
backBtn = backBtn?.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
self.navigationController!.navigationBar.backIndicatorImage = backBtn;
self.navigationController!.navigationBar.backIndicatorTransitionMaskImage = backBtn;
Try it this way:
self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:#"" style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationController.navigationBar.backIndicatorImage = [UIImage imageNamed:#"yourImageName.png"];
self.navigationController.navigationBar.backIndicatorTransitionMaskImage = [UIImage imageNamed:#"yourImageName.png"];
This will create an image mask in the global tint colour which will give you your own custom icon. Does not work for colour images.
// ADDING IMAGE TO BUTTON
UIButton *refreshButton = [UIButton buttonWithType:UIButtonTypeCustom];
[refreshButton setFrame:CGRectMake(0,0,30,30)];
refreshButton.userInteractionEnabled = YES;
[refreshButton setImage:[UIImage imageNamed:#"yourimage.jpg"] forState:UIControlStateNormal];
// ASSIGNING THE BUTTON WITH IMAGE TO BACK BAR BUTTON
UIBarButtonItem *refreshBarButton = [[[UIBarButtonItem alloc] initWithCustomView:refreshButton] autorelease];
self.navigationItem.leftBarButtonItem = refreshBarButton;
Related
I'm simply trying to set the backBarButtonItem for my navigation controller to this image
instead of the Apple default arrow button whose title is the same as the previous view controller's title. The closest I've gotten so far is the above image stretched horizontally with the title still appearing overlaid. To get that, I used this code in my AppDelegate.
UIImage *backButtonImage = [UIImage imageNamed:#"back-button.png"];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:backButtonImage
forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
How can I get rid of the title (and prevent the button from being stretched)?
When you use appearance, you are setting the background image of the back bar button items of your app. The fact that they have a background image has nothing to do with whether or not there is a title displayed on them. To use a custom bar button item instead of the default back item, look at this question.
In your case, you may want to not use appearance at all and instead create a bar button item as in the link above but use -initWithImage:style:target:action: instead of -initWithTitle:style:target:action:
you can set custom Image of BarbuttonItem like :-
- (void)viewDidLoad
{
UIImage* imageRight = [UIImage imageNamed:#"Home_btn.png"];
CGRect frameimgRight = CGRectMake(100, 100, 50, 30);
RightBtn = [[UIButton alloc] initWithFrame:frameimgRight];
[RightBtn setBackgroundImage:imageRight forState:UIControlStateNormal];
[RightBtn addTarget:self action:#selector(ActionhomeBtn)
forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *btnRight = [[UIBarButtonItem alloc]initWithCustomView:RightBtn];
self.navigationItem.leftBarButtonItem = btnRight;
[super viewDidLoad];
}
Look like:-
Hope its halp's you
I know this method works, and should be called in ViewDidLoad:
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:#"back-button.png"] style:UIBarButtonItemStyleBordered target:nil action:#selector(methodName)];
which then has to be assigned to the nav bar:
item.rightBarButtonItem = backButtonItem;
and then pushed:
[self.navBar pushNavigationItem:item animated:NO];
Everything is fine in iOS 5.0, but when i'm running my code in iOS 4.0, background image of bar button in navigation as well as title in navigation is not showing up.
Here is the code i'm using:
// check for version 5.0 support
navController = [[[UINavigationController alloc] initWithRootViewController:self.viewController] autorelease];
UINavigationBar *navigationBar = [navController navigationBar];
if ([navController.navigationBar respondsToSelector:#selector(setBackgroundImage:forBarMetrics:)] ) {
UIImage *image = [UIImage imageNamed:#"Nav_Bar.png"];
[navigationBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
}
else
{
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed: #"Nav_Bar.png"]];
[self.navController.navigationBar addSubview:imageView];
}
Then in viewDidLoad:
self.title = #"MyTitle";
self.leftBTN= [UIButton buttonWithType:UIButtonTypeCustom];
[leftBTN setImage:[UIImage imageNamed:#"BTN1.png"] forState:UIControlStateNormal];
[leftBTN setTitle:#"Edit" forState:UIControlStateNormal];
[leftBTN addTarget:self action:#selector(editOption) forControlEvents:UIControlEventTouchUpInside];
[leftBTN setFrame:CGRectMake(0, 0, 60, 30)];
self.navigationItem.leftBarButtonItem = [[[UIBarButtonItem alloc] initWithCustomView:leftBTN] autorelease];
Can any one please, explain me, why image and title is not showing in navigation controller.
Moreover, if I click on that frame, button’s action is working, only problem is that button is not showing.
Its a problem with iOS 4. When the view is added to Navigation Bar, the subviews are not handled properly. Its resolved in iOS 5.
See this link.
It has sample project which runs with background image in navigation bar on both iOS 4 and iOS 5.
In my application I want to change the color of bacBarButtonItem.
Is it possible to change the color? or I have to put an image of it.
and in case of image tell me the code how to put the image.
If you just want to change the color you can do it with this line of code.
[[UIBarButtonItem appearance] setTintColor:[UIColor redColor]];
Replace redColor with the following to adjust the color of the buttons:
colorWithRed:0/255.0 green:144/255.0 blue:200/255.0 alpha:1.0// pick your color using this
Be sure to put this in the view controller that pushes. Not the view controller where you want to see this back button color.
Praveen-K answer is right, but take in mind that you'll have to do it in every viewcontroller.
Starting at iOS5, Apple have introduced the "appearance" concept.
- (void)setBackButtonBackgroundImage:(UIImage *)backgroundImage forState:(UIControlState)state barMetrics:(UIBarMetrics)barMetrics __OSX_AVAILABLE_STARTING(__MAC_NA,__IPHONE_5_0) UI_APPEARANCE_SELECTOR;
In your case would be something like this
UIImage *image = [UIImage imageNamed:#"imageName.png"];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:image forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
But as I said, Praveen-K answer is ok and will work, but just to let you know for the future.
UIImage *image = [UIImage imageNamed:#"imageName.png"];
UIBarButtonItem* backBarButton = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:self action:#selector(backButtonAction)];
self.navigationItem.leftBarButtonItem=backBarButton;
[backBarButton release];
Another way to change the color of back bar button item is to use segment control
UISegmentedControl *button = [[[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:#"Back", nil]] autorelease];
button.frame = CGRectMake(0, 0, 60, 30);
button.center = self.view.center;
button.momentary = YES;
button.segmentedControlStyle = UISegmentedControlStyleBar;
button.tintColor = [UIColor colorWithRed:0 green:0.1 blue:0.5 alpha:0];
[button addTarget:self action:#selector(handleBack:) forControlEvents:UIControlEventValueChanged];
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button];
Notice that we assign the color we want to the property tintColor of UISegmentedControl.
I got the idea from this site:
http://charles.lescampeurs.org/2011/02/10/tint-color-uibutton-and-uibarbuttonitem
Im not sure what im doing wrong. The file name is correct, the style is set to plain. But Im getting a bank white box the size of my image. Im using UINavigationController.
Please assist and thank you thank you in advance.
**FYI I am sorta new to objective c so dont be too hard on me. ;)
UIBarButtonItem *toolbarChannelGuideButton = [[UIBarButtonItem alloc]
initWithImage:[UIImage imageNamed:#"channel-guide-button.png"]
style:UIBarButtonItemStylePlain
target:self
action:#selector(action:)];
self.toolbarItems = [NSArray arrayWithObjects:toolbarChannelGuideButton, nil];
[toolbarChannelGuideButton release];
The reason it was creating the white mask was because the UIToolBar doesnt allow color images on it by default. The way to accomplish this is creating a UIImage then assign a UIButton to that image. Then create a UIBarButton using initWithCustomView with the UIButton as the custom view.
Code:
//Load the image
UIImage *buttonImage = [UIImage imageNamed:#"your-image.png"];
//create the button and assign the image
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setImage:buttonImage forState:UIControlStateNormal];
//sets the frame of the button to the size of the image
button.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
//creates a UIBarButtonItem with the button as a custom view
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.toolbarItems = [NSArray arrayWithObjects:customBarItem, nil];
[customBarItem release];
Starting with iOS 7 you can use below:
UIImage *image = [[UIImage imageNamed:#"myImage.png"];
imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIBarButtonItem *button = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:self action:#selector(YOUR_METHOD:)];
Does channel-guide-button.png belong to project?
You could break this out like this:
UIImage *image = [UIImage imageNamed:#"channel-guide-button.png"];
NSLog(#" image = %p", image);
UIBarButtonItem *toolbarChannelGuideButton = [[UIBarButtonItem alloc]
initWithImage:image
style:UIBarButtonItemStylePlain
target:self
action:#selector(action:)];
or just check your project ;-)
how to display an image in the navigation bar of an iPhone application? (say, right after the title)
Here's how to have the image centered in the NavBar.
UIImage *image = [UIImage imageNamed: #"NavBarImage.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage: image];
self.navigationItem.titleView = imageView;
[imageView release];
This code is actually contained with the Apple source for the NavBar and can be found at the iPhone Developer Center at Apple.
The source shows you various ways to manipulate both the StatusBar & NavBar.
I haven't tested this but as UINavigationBar is a view you can add subViews to it.
UIImage* myImage = [UIImage imageNamed:#"Myimage.png"];
UIImageView* myImageView = [[UIImageView alloc] initWithImage:myImage];
myImageView.frame.origin.x = 30.0; // You will have to find suitable values for the origin
myImageView.frame.origin.y = 5.0;
[myTabbar addSubView:myImageView];
[myImageView release];
You can use things like the backItem property to calculate the position of your image view.
If you want the image at the right of the nav bar, you can define it as a custom button with no action when presed, like this
UIButton* fakeButton = (UIButton *) [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"yourimage.png"]];
UIBarButtonItem *fakeButtonItem = [[UIBarButtonItem alloc] initWithCustomView:fakeButton];
self.navigationItem.rightBarButtonItem = fakeButtonItem;
[fakeButtonItem release];
[fakeButton release];
Simply Place that code in - (void)viewWillAppear:(BOOL)animated; so it'll work fine
and add one image having size 320x40 named Top Bar
UIImage *image = [UIImage imageNamed: #"TopBar.png"];
[self.navigationController.navigationBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
the navigation bar has a property called title view - set this to the image you like. Since the titleView overwrites the title of the nav bar you have to include the desired title in the image file. Still set the title to what you want so it appears on the back button when you push a view Controller
I encountered the same problem.Found out the best solution
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:#"background_image.png"] forBarMetrics:UIBarMetricsDefault];
Hope this would help....
Just write your own navigation bar. Therefore you have to disable the Navigation Bar fist:
Disable the top bar in the interface builder by selecting your Navigation Controller in
your Storyboard: Attributes Inspector -> Simulated Metrics -> Top Bar: select None
Afterwards you can add any HeaderView you like...
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, sFrame.size.width, 100)];
UIColor *background = [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:#"header_image.png"]];
self.headerView.backgroundColor = background;
// ...add buttons and labels
[self.view addSubview:headerView];