add image to UIBarButtonItem for UIToolbar - iphone

I am trying to add an image to the UIBarButtonItem which I have to use in a UIToolbar.
I have managed to read the image and even get it to display with a UIImageView, but when i add it to the UIBarButtonItem and then add that item to the UIToolbar, the toolbar just displaces a "Blank White" space the size and shape of the image that I am trying to load.
here is what I am trying.
UIImage *image = [UIImage imageNamed:#"6.png"];
//This is the UIImageView that I was using to display the image so that i know that it is being read from the path specified.
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
imageView.frame = CGRectMake(0, 50, image.size.width, image.size.height);
[self.view addSubview:imageView];
UIButton *button1 = [UIButton buttonWithType:UIButtonTypeCustom];
[button1 setImage:image forState:UIControlStateNormal];
//This is the first way that I was trying to accomplish the task but i just get a blank white space
//This is the Second way but with the same blank white result.
UIBarButtonItem *systemItem1 = [[UIBarButtonItem alloc] initWithCustomView:button2];
NSArray *items = [NSArray arrayWithObjects: systemItem1, nil];
//Adding array of buttons to toolbar
[toolBar setItems:items animated:NO];
//Adding the Toolbar to the view.
[self.view addSubview:toolBar];
Your help will be much appreciated.
Thank You!
Shumais Ul Haq

Other than you'd normally expect in UIKit stuff, you might need to set a frame for the button explicitly. Maybe that's your problem.
This is what I wrote for a custom styled back button, as a category to UIBarButtonItem (but you can just take the pieces you need from it).
Note that this was used for the navigation bar, not the toolbar, but I presume the mechanics are the same, since it is a UIBarButtonItem as well. For UIToolbar you can just use IB to get it right at compile time.
#define TEXT_MARGIN 8.0f
#define ARROW_MARGIN 12.0f
#define FONT_SIZE 13.0f
#define IMAGE_HEIGHT 31.0f
+(UIBarButtonItem*)arrowLeftWithText:(NSString*)txt target:(id)target action:(SEL)selector
{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
UIImage *img = [[UIImage imageNamed:#"arrow_left.png"]
stretchableImageWithLeftCapWidth:15 topCapHeight:0];
[btn addTarget:target action:selector forControlEvents:UIControlEventTouchDown];
[btn setContentHorizontalAlignment:UIControlContentHorizontalAlignmentRight];
[btn setContentEdgeInsets:UIEdgeInsetsMake(0.0f,0.0f,0.0f,TEXT_MARGIN)];
[btn.titleLabel setFont:[UIFont fontWithName:#"Helvetica-Bold" size:FONT_SIZE]];
[btn.titleLabel setShadowOffset:CGSizeMake(0.0f,-1.0f)];
/**** this is the magic line ****/
btn.frame = CGRectMake(0.0f,0.0f,
[txt sizeWithFont:[btn.titleLabel font]].width+ARROW_MARGIN+TEXT_MARGIN,
IMAGE_HEIGHT);
[btn styleBarButtonForState:UIControlStateNormal withImage:img andText:txt];
[btn styleBarButtonForState:UIControlStateDisabled withImage:img andText:txt];
[btn styleBarButtonForState:UIControlStateHighlighted withImage:img andText:txt];
[btn styleBarButtonForState:UIControlStateSelected withImage:img andText:txt];
return [[[UIBarButtonItem alloc] initWithCustomView:btn] autorelease];
}
usage:
[UIBarButtonItem arrowLeftWithText:#"Back" target:self action:#selector(dismiss)];

Related

How to create multiline backBarButtonItem in UINavigationBar

I want to create multiline BackBarButtonItem. right now my back button display like this,
but i want to display it like this, color does not matter,
How can I do that? And this is my default back button which added while i am pushing my childviewcontroller thru my parentviewcontroller so i dont want to remove it.
You can do it using custom image,UILabel(MSLabel),UIButton.
MSLabel is used to change space between two line of UILabel. Because UILabel Does not provide any property to do that.
After you add MSLabel in your project use this code. Recommend size for backbtn.png is 48*30.
#import "MSLabel.h"
- (void)viewDidLoad
{
[super viewDidLoad];
// Set the custom back button
UIImage *buttonImage = [[UIImage imageNamed:#"backbtn.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 13, 0, 5)];
//create the button and assign the image
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button setBackgroundImage:buttonImage forState:UIControlStateNormal];
MSLabel *lbl = [[MSLabel alloc] initWithFrame:CGRectMake(12, 4, 65, 28)];
lbl.text = #"Account Summary";
lbl.backgroundColor = [UIColor clearColor];
//lbl.font = [UIFont fontWithName:#"Helvetica" size:12.0];
lbl.numberOfLines = 0;
lbl.lineHeight = 12;
lbl.verticalAlignment = MSLabelVerticalAlignmentMiddle;
lbl.font = [UIFont fontWithName:#"Helvetica" size:12];
[button addSubview:lbl];
//set the frame of the button to the size of the image (see note below)
button.frame = CGRectMake(0, 0, 70, buttonImage.size.height);
[button addTarget:self action:#selector(back) forControlEvents:UIControlEventTouchUpInside];
//create a UIBarButtonItem with the button as a custom view
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.leftBarButtonItem = customBarItem;
}
-(void)back {
NSLog(#"Dilip Back To ParentViewController");
// Tell the controller to go back
[self.navigationController popViewControllerAnimated:YES];
}
Outcome will display like this, Use your image for better result.
In this case you should use custom button and use background image on this button.Because i think it may not be possible.See for custom button
UIButton *backBtn = [[UIButton alloc] initWithFrame:CGRectMake(10.0f,6.5f,60.0f,30.0f)];
[backBtn setBackgroundImage:[UIImage imageNamed:#"accountSummary"] forState:UIControlStateNormal];
[backBtn setBackgroundImage:[UIImage imageNamed:#"accountSummary"] forState:UIControlStateHighlighted];
[backBtn addTarget:self action:#selector(accountSummaryBtnPressed:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *leftButton = [[UIBarButtonItem alloc] initWithCustomView:backBtn];
[self.navigationItem setLeftBarButtonItem:leftButton];
- (void)accountSummaryBtnPressed:(id)sender
{
//--------- do stuff for account summary
}
What i believe you can Create CustomView with ImageView And Transparent label with numberOflines more than two or whatever you want to restrict it to , then replace the navigation back button with That Barbutton initiated with CustomVIew, That Can Solve your problem,, Hope fully

How do I change the location of the back button on iOS?

You see I am making a completely custom navigation bar and when i create the back button it doesn't stay in the right place as you can see below the code.
here is my code for the app
- (void)viewDidLoad
{
[super viewDidLoad];
if(self.navigationController.viewControllers.count > 1) {
UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
[backButton setTitle:#"" forState:UIControlStateNormal];
[backButton setBackgroundImage:[UIImage imageNamed:#"backButton.png"] forState:UIControlStateNormal];
[backButton addTarget:self action:#selector(didTapBackButton:) forControlEvents:UIControlEventTouchUpInside];
backButton.frame = CGRectMake(0.0f, 0.0f, 44.0f, 45.0f);
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithCustomView:backButton];
self.navigationItem.leftBarButtonItem = backButtonItem;
}
}
I think you can just modify contentEdgeInsets to make the position of the button.
Something like this:
[backButton setContentEdgeInsets:UIEdgeInsetsMake(5, 0, -5, 0)];
Come from UIButton Class Reference
contentEdgeInsets
The inset or outset margins for the rectangle surrounding all of the button’s content.
#property(nonatomic) UIEdgeInsets contentEdgeInsets
DiscussionUse this property to resize and reposition the effective drawing rectangle for the button content. The content comprises the button image and button title. You can specify a different value for each of the four insets (top, left, bottom, right). A positive value shrinks, or insets, that edge—moving it closer to the center of the button. A negative value expands, or outsets, that edge. Use the UIEdgeInsetsMake function to construct a value for this property. The default value is UIEdgeInsetsZero.
You can render a larger image with some spacing on the left.
UIImage *origImage = [UIImage imageNamed:#"button-thin-hamburger.png"];
UIGraphicsBeginImageContextWithOptions(CGSizeMake(origImage.size.width + 10, origImage.size.height), NO, 0.0);
[origImage drawInRect:CGRectMake(10, 0, origImage.size.width, origImage.size.height)];
UIImage *buttonImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:#""
style:UIBarButtonItemStylePlain
target:nil
action:nil];
self.navigationItem.backBarButtonItem = backButton;
[[UINavigationBar appearance] setBackIndicatorImage:buttonImage];
[[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:buttonImage];
Well you can't change, you have to hide it.
Look at this page posted here:
http://rafaelsteil.com/2011/07/23/crappy-ios-apis-uinavigationcontroller/
Can't change back button title but I can hide it
you need to hide NavigationBar first...
[self.navigationController setNavigationBarHidden:YES animated:NO];
then create Custom UIButton..
UIButton *btn1=[UIButton buttonWithType:UIButtonTypeCustom];
[btn1 setFrame:CGRectMake(10, 0, 60, 40)];// Frame u want
[btn1 setImage:[UIImage imageNamed:#"BT_ipad_P_backbward#2x.png"] forState:UIControlStateNormal];
[btn1 addTarget:self action:#selector(Click_backward:) forControlEvents: UIControlEventTouchUpInside];
btn1.tintColor=[UIColor purpleColor];
[self.view addSubview:btn1];

How to set a picture programmatically in a NavBar?

I have a detailview with a navigation bar with a back button and a name for the view.
The navigation bar is set programmatically.
The name presented is set like this.
self.title = NSLocalizedString(name, #"");
The name depends on the presented view.
Now I would like to also present a small icon on the navigation bar which also is depends on the view.
How do I do that?
You can set backGround image to navigationBar Using this
Put in didFinishLaunchingWithOptions
[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:#"title_bar.png"] forBarMetrics:UIBarMetricsDefault];
Or you can set navigation bar image in any view using
UINavigationBar *navBar = [[self navigationController] navigationBar];
UIImage *image = [UIImage imageNamed:#"TopBar.png"];
[navBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
Or you can set a view on your NavigationBar Link
[[UINavigationBar appearance] addSubview:yourView];
or
self.navigationItem.titleView = YourView;
And set title using h
self.navigationItem.title = #"Your Title"; 
And you can get navigationBarButton using this
-(void)getRightBarBtn
{
UIButton *Btn =[UIButton buttonWithType:UIButtonTypeCustom];
[Btn setFrame:CGRectMake(0.0f,0.0f,68.0f,30.0f)];
[Btn setBackgroundImage:[UIImage imageNamed:[NSString stringWithFormat:#"yourImage.png"]] forState:UIControlStateNormal];
//[Btn setTitle:#"OK" forState:UIControlStateNormal];
//Btn.titleLabel.font = [UIFont fontWithName:#"Georgia" size:14];
[Btn addTarget:self action:#selector(yourBtnPress:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *addButton = [[UIBarButtonItem alloc] initWithCustomView:Btn];
[self.navigationItem setRightBarButtonItem:addButton];
}
And set simple imageView on navigation Bar
UIImageView *image = [[UIImageView alloc]initWithImage:[UIImage imageNamed:#"star.png"]];
UIBarButtonItem *backBarButton = [[UIBarButtonItem alloc] initWithCustomView:image];
self.navigationItem.rightBarButtonItem = backBarButton;
You need to subclass UINavigationBar. Then in drawRect do something like:
[[UIImage imageNamed...] drawInRect:...]
and call the super method ofcourse
Add this code into viewDidLoad in your ViewController:
UIImage *image = [UIImage imageNamed: #"myIcon.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
imageView.frame = CGRectMake(5, 2, 100, 39);
[self.navigationController.navigationBar addSubview:imageView];
imageView can also be declared as an instance variable, so you can access it after you've added it (e.g. if you want to remove your icon from your navigationBar at some point).
UIButton *homeBtn=[[UIButton alloc] initWithFrame:CGRectMake(0, 0, 46, 28)];
[homeBtn setBackgroundImage:[UIImage imageNamed:#"homeBtn.png"] forState:UIControlStateNormal];
[homeBtn addTarget:self action:#selector(homeBtnPressed) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *navHomeBtn=[[[UIBarButtonItem alloc] initWithCustomView:homeBtn] autorelease];
self.navigationItem.rightBarButtonItem=navHomeBtn;
[homeBtn release];

How to move a bar button item within a nav bar

I have a custom bar button item that I want to nudge down 5 pixels. How would I go about doing that witht the following code. I tried to set the "y" point but keep getting syntax errors.
[self.navigationController setNavigationBarHidden:NO animated:YES];
UIImage *image = [UIImage imageNamed:#"arrow_back.png"];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
[self.navigationController.navigationBar addSubview:imageView];
[imageView release];
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];
//create a UIBarButtonItem with the button as a custom view
UIBarButtonItem *customBarItem = [[UIBarButtonItem alloc] initWithCustomView:button];
self.navigationItem.leftBarButtonItem = customBarItem;
[customBarItem release];
}
thanks for any help
A UIBarButton item doesn't inherit from UIView so doesn't have a "frame" property that you can adjust directly so you need to use a different method.
Try:
[self.navigationItem.leftBarButtonItem setBackgroundVerticalPositionAdjustment:5 forBarMetrics:UIBarMetricsDefault];

UIButton as UINavigationbar button

I have a Tab bar application. and in one of the tab bars I have a navigation contorller.
Im trying to set a UIButton with an image as the right button the navigation bar.
UIButton *refreshButton = [[UIButton alloc] init];
[refreshButton setImage:[UIImage imageNamed:#"refresh_icon.png"] forState:UIControlStateNormal];
[refreshButton addTarget:self action:#selector(refreshSection) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *rightButton = [[UIBarButtonItem alloc] initWithCustomView:refreshButton];
//[rightButton setImage:[UIImage imageNamed:#"refresh_icon.png"]]; << DOESN'T WORK EITHER
self.navigationItem.rightBarButtonItem = rightButton;
[refreshButton release];
[rightButton release];
but the image doesn't show up. I get an invisible button.
EDIT:
I want the button style to be plain or background to be transparent, so that only the image shows. Hence I am using a UIbutton instead of using a UIBarButton directly.
You don't have to create a UIButton and use it as custom view in the UIBarButtonItem. You can create a UIBarButtonItem directly with an image:
UIImage *myImage = [UIImage imageNamed:#"myImage.png"];
UIBarButtonItem *button = [[UIBarButtonItem alloc] initWithImage:myImage style:UIBarButtonItemStyleBordered target:self action:#selector(refreshSection)];
self.navigationItem.rightBarButtonItem = button;
[button release];
--
Updated, according to comments
Use a UIImageView as custom view in the UIBarButtonItem:
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"myImage.png"]];
UIBarButtonItem *rightButton = [[UIBarButtonItem alloc] initWithCustomView:imageView];
self.navigationItem.rightBarButtonItem = rightButton;
[imageView release];
[rightButton release];
--
Updated
Tried the last approach and while this does visually look like you want it to, I can't seem to get it to handle taps. Although the target and action has been set.
--
Final update
I've gotten your initial code in the question up & running. The reason the image is not showing, is because you haven't set the frame of the button. Once you set the frame, the image is shown in the navigation bar.
Here's my snippet I used & tested:
UIImage *myImage = [UIImage imageNamed:#"paw.png"];
UIButton *myButton = [UIButton buttonWithType:UIButtonTypeCustom];
[myButton setImage:myImage forState:UIControlStateNormal];
myButton.showsTouchWhenHighlighted = YES;
myButton.frame = CGRectMake(0.0, 0.0, myImage.size.width, myImage.size.height);
[myButton addTarget:self action:#selector(tapped:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *rightButton = [[UIBarButtonItem alloc] initWithCustomView:myButton];
self.navigationItem.rightBarButtonItem = rightButton;
[rightButton release];
[myButton release];
Note: I have set the showsTouchWhenHighlighted property of the UIButton to visually hightlight the button when it is pressed.
I ended up doing this
UIButton *refreshButton = [[UIButton alloc] initWithFrame:CGRectMake(292, 9, 27, 27)];
[refreshButton setImage:[UIImage imageNamed:#"refresh_icon.png"] forState:UIControlStateNormal];
[refreshButton addTarget:self action:#selector(refresh) forControlEvents:UIControlEventTouchUpInside];
[self.navigationController.navigationBar addSubview:refreshButton];
[refreshButton release];
It works fine now but I am not really sure if this is the right way of doing it.