I am customizing the back button in the navigation bar using appearance proxy, also setting image and text attributes. Everything works fine but the text in back button is not center aligned.
Here is my code.
UIBarButtonItem *backButton = [[[UIBarButtonItem alloc] initWithTitle:title style:UIBarButtonItemStyleBordered target:nil action:nil] autorelease];
UIImage *buttonBack32 = [[UIImage imageNamed:#"NavigationBackButton"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 10, 0, 5)];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:buttonBack32 forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UIBarButtonItem appearance] setTitleTextAttributes:
[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor whiteColor],
UITextAttributeTextColor,
[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.8],
UITextAttributeTextShadowColor,
[NSValue valueWithUIOffset:UIOffsetMake(0, -1)],
UITextAttributeTextShadowOffset,
[UIFont fontWithName:#"xxx" size:16.0],
UITextAttributeFont,
nil]
forState:UIControlStateNormal];
self.navigationItem.backBarButtonItem = backButton;
If I set the font size "0.0" then text becomes too small in size and still not centered aligned.
Thanks in advance for any help.
You can use the setTitlePositionAdjustment:forBarMetrics: method to set the title offset as required. For example:
[[UIBarButtonItem appearance] setTitlePositionAdjustment:UIOffsetMake(0.0f, 5.0f) forBarMetrics:UIBarMetricsDefault];
To adjust the text up I had to use this:
[[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:UIOffsetMake(0, -1.5) forBarMetrics:UIBarMetricsDefault];
You can use this :
UIView* leftContainer = [[UIView alloc] initWithFrame:CGRectMake(0.0, 4.0, 70.0, 44.0)];
UIImage *profileImg = [UIImage imageNamed:#"account-btn.png"];
UIButton *profilebutton = [UIButton buttonWithType:UIButtonTypeCustom];
profilebutton.frame = CGRectMake(0.0, 7.0, 70.0, 30.0 );
[profilebutton setImage:profileImg forState:UIControlStateNormal];
[profilebutton addTarget:self action:#selector(profileBtnClicked) forControlEvents:UIControlEventTouchUpInside];
[leftContainer addSubview:profilebutton];
UIBarButtonItem* item = [[UIBarButtonItem alloc] initWithCustomView:leftContainer];
self.navigationItem.leftBarButtonItem = item;
[leftContainer release];
[item release];
Related
How can I recreate the letterpress-like effect applied to the backbarbuttonitem in the notes app in ios 7? I tried the following:
NSShadow *textShadow = [[NSShadow alloc] init];
textShadow.shadowOffset = CGSizeMake(0.0, -1.0);
textShadow.shadowColor = [UIColor blackColor];
NSAttributedString *attributedTitle = [[NSAttributedString alloc] initWithString:#"Back" attributes:#{NSForegroundColorAttributeName : [UIColor orangeColor], NSShadowAttributeName : textShadow}];
self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:attributedTitle style:UIBarButtonItemStylePlain target:nil action:nil];
But it says I can't use NSAttributedString in place of an NSString.
For iOS 5 and above, you can use the UIAppearance functionality to change the Text Color, Font, Tint Color etc of multiple UI Components like UITabBar, UIBarButton, etc.
for UIBarButtonItem, check the below two options.
Option1: For ANY UIBarButtonItem:
NSDictionary *aButtonAttribute = [NSDictionary dictionaryWithObjectsAndKeys:
[UIColor darkGrayColor], UITextAttributeTextColor,
[UIColor whiteColor], UITextAttributeTextShadowColor,
[NSValue valueWithUIOffset:UIOffsetMake(0, 1)], UITextAttributeTextShadowOffset, nil];
[[UIBarButtonItem appearance] setTitleTextAttributes:aButtonAttribute forState:UIControlStateNormal];
Option 2: For UIBarButtonItem of a UINavigationBar ONLY:
NSDictionary *aButtonAttribute = [NSDictionary dictionaryWithObjectsAndKeys:
[UIColor darkGrayColor], UITextAttributeTextColor,
[UIColor whiteColor], UITextAttributeTextShadowColor,
[NSValue valueWithUIOffset:UIOffsetMake(0, 1)], UITextAttributeTextShadowOffset, nil];
[[UIBarButtonItem appearanceWhenContainedIn:[UINavigationBar class], nil] setTitleTextAttributes:aButtonAttribute forState: UIControlStateNormal];
NOTE: You can add these lines (either of the 2 options) in the .m file of AppDelegate..
I wanted to make my right bar button contain 2 buttons. So I did that by using a UIToolbar. But the problem is that the 2 buttons sit apart from each other, while the affect I would like to achieve is too have them sitting flush against each other.
Here is an image of how they look now
Here is the code I use to achieve the buttons so far
UIToolbar *tools = [[UIToolbar alloc] initWithFrame:CGRectMake(0.0f, 2.0f, 120.0f, 40.01f)]; // 44.01 shifts it up 1px for some reason
tools.clearsContextBeforeDrawing = NO;
tools.clipsToBounds = YES;
tools.tintColor = [UIColor blueColor];
tools.barStyle = -1;// -1; // clear background
NSMutableArray *buttons = [[NSMutableArray alloc] initWithCapacity:2];
UIButton * upButton = [[UIButton buttonWithType:UIButtonTypeCustom] retain];
upButton.frame = CGRectMake(0, 07, 46, 30);
upButton.titleLabel.font = [UIFont fontWithName:#"Arial-BoldMT" size:16];
[upButton setTitle:#"" forState:UIControlStateNormal];
upButton.backgroundColor = [UIColor clearColor];
[upButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal ];
[upButton addTarget:self action:#selector(pageDown) forControlEvents:UIControlEventTouchUpInside];
[upButton setBackgroundImage:[UIImage imageNamed:#"page_up.png"] forState:UIControlStateNormal];
[upButton setBackgroundImage:[UIImage imageNamed:#"page_up_action.png"] forState:UIControlStateSelected];
UIBarButtonItem *toggleSegmentedControlBarItemOne = [[UIBarButtonItem alloc] initWithCustomView:upButton];
[buttons addObject:toggleSegmentedControlBarItemOne];
UIButton * downButton = [[UIButton buttonWithType:UIButtonTypeCustom] retain];
downButton.frame = CGRectMake(0, 07, 46, 30);
downButton.titleLabel.font = [UIFont fontWithName:#"Arial-BoldMT" size:16];
[downButton setTitle:#"" forState:UIControlStateNormal];
downButton.backgroundColor = [UIColor clearColor];
[downButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal ];
[downButton addTarget:self action:#selector(pageUp) forControlEvents:UIControlEventTouchUpInside];
[downButton setBackgroundImage:[UIImage imageNamed:#"page_down.png"] forState:UIControlStateNormal];
[downButton setBackgroundImage:[UIImage imageNamed:#"page_down_action.png"] forState:UIControlStateSelected];
UIBarButtonItem *toggleSegmentedControlBarItemTwo = [[UIBarButtonItem alloc] initWithCustomView:downButton];
[buttons addObject:toggleSegmentedControlBarItemTwo];
[tools setItems:buttons animated:NO];
[buttons release];
UIBarButtonItem *twoButtons = [[UIBarButtonItem alloc] initWithCustomView:tools];
[tools release];
self.navigationItem.rightBarButtonItem = twoButtons;
[twoButtons release];
Can anybody please advise me how to get those two buttons to sit beside each other without any gap?
Many Thanks,
-Code
You can add UISegmentedControl as customView to your navigationItem and set its momentary property to true, that way you will get exactly what you want.
Here is sample code
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.title = #"Test";
UISegmentedControl *segControl = [[UISegmentedControl alloc] initWithFrame:CGRectMake(0, 0, 90, 30)];
segControl.momentary = YES;
segControl.segmentedControlStyle = UISegmentedControlStyleBar;
segControl.tintColor = [UIColor darkGrayColor];
[segControl insertSegmentWithImage:[UIImage imageNamed:#"up.png"] atIndex:0 animated:NO];
[segControl insertSegmentWithImage:[UIImage imageNamed:#"down.png"] atIndex:1 animated:NO];
[segControl addTarget:self action:#selector(segButtonDown:) forControlEvents:UIControlEventValueChanged];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:segControl];
}
- (void)segButtonDown:(id)sender {
UISegmentedControl *segControl = (UISegmentedControl *)sender;
switch (segControl.selectedSegmentIndex) {
case 0:
NSLog(#"Up");
break;
case 1:
NSLog(#"Down");
default:
break;
}
}
And here is image how it looks like.
And here you can see events in console.
2012-11-25 16:03:47.805 test2[13886:c07] Up
2012-11-25 16:03:48.367 test2[13886:c07] Down
2012-11-25 16:03:48.930 test2[13886:c07] Up
2012-11-25 16:03:49.538 test2[13886:c07] Down
take a look at this tutorial, maybe it helps :
Xcode: Multiple Buttons in Nav Bar
Add a no space space between two buttons.
two do this.
UIBarButtonItem *noSpace = [[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil] autorelease];
noSpace.width = -10.0;
insert this noSpace objet to you'r array (buttons in your case). between two objects of UIBarButtonItem.
it'l be ok..
i have UITableView based application, and i can't set backBarButtonItem properly.
Back button is button, which appears when i select any item, call second view with method didSelectRowAtIndexPath. When i try to set it like this:
UIButton *back1=[UIButton buttonWithType:UIButtonTypeCustom];
[back1 setFrame:CGRectMake(10.0, 2.0, 45.0, 40.0)];
[back1 addTarget:nil action:NULL forControlEvents:UIControlEventTouchUpInside];
[back1 setImage:[UIImage imageNamed:#"back_button.png"] forState:UIControlStateNormal];
UIBarButtonItem *back = [[UIBarButtonItem alloc]initWithCustomView:back1];
self.navigationItem.backBarButtonItem = back;
There is just back button with default style and somehow with title of my TableView controller window.
When i set it like this:
UIBarButtonItem *backButton = [[UIBarButtonItem alloc]
initWithImage:[UIImage imageNamed:#"back_button.png"]
style:UIBarButtonItemStyleBordered
target:nil
action:nil];
self.navigationItem.backBarButtonItem = backButton;
There is an image, but, it look like "inserted" in default back button, doesn't look nice at all.
Please help me.. i tried many ways to solve this, but, in many cases there is just default Back button with title "Products" (there is title which appears on top of navigation bar in my UITableView). Any help would be appreciated!
UIImage *buttonImage = [UIImage imageNamed:#"back_button.png"];
UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
[backButton setBackgroundImage:buttonImage forState:UIControlStateNormal];
[backButton setTitle:#"Back" forState:UIControlStateNormal];
backButton.font = [UIFont boldSystemFontOfSize:12];
backButton.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[backButton addTarget:self action:#selector(showMeter)
forControlEvents:UIControlEventTouchUpInside];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]
initWithCustomView:backButton];
//Create resizable images
UIImage *myButton = [[UIImage imageNamed:#"yourButton"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 5, 0, 5)];
//Set the background image for *all* UIBackBarButtons
[[UIBarButtonItem appearance] setBackgroundImage:myButton forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
You should assign it to self.navigationItem.leftBarButtonItem.
self.navigationItem.leftBarButtonItem = backButton;
When One of my app navigate from one controller to another, the 'go back' UIBarButtonItem disappear, so I wrote codes:
UIBarButtonItem *barButton1 = [[UIBarButtonItem alloc] initWithTitle:#""
style:UIBarButtonItemStyleDone
target:self
action:#selector(barButtonItemPressed:)];
self.navigationItem.leftBarButtonItem = barButton1;
[barButton1 setImage:[UIImage imageNamed:#"fdj.png"]];
[barButton1 release];
It works, but it display as
but I prefer the style (like standard go back barbuttonitem
Is it possible?
Welcome any comment
You should edit the navigationItem of the parent view controller:
You can place this in the viewDidLoad of the previous view controller:
self.navigationItem.backBarButtonItem = [[[UIBarButtonItem alloc] initWithTitle:nil style:UIBarButtonItemStylePlain target:nil action:nil] autorelease];
self.navigationItem.backBarButtonItem.image = [UIImage imageNamed:#"fdj.png"];
here is the code how you can do this
UIButton *btnBack = [UIButton buttonWithType:UIButtonTypeCustom];
btnBack.frame = CGRectMake(0, 0, 55, 36);
[btnBack setImage:[UIImage imageNamed:#"btnBack"] forState:UIControlStateNormal];
[btnBack setImage:[UIImage imageNamed:#"btnBack"] forState:UIControlStateSelected];
[btnBack addTarget:self action:#selector(onClickBack) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *item4 = [[UIBarButtonItem alloc] initWithCustomView:btnBack];
self.navigationItem.leftBarButtonItem = item4;
just make image and set it in uibutton, it's simple way to do this.
you can set any image you want.
hope this may help you what you want.
In the parent view controller's init method, set
self.navigationItem.backBarButtonItem = [[[UIBarButtonItem alloc] initWithImage: [UIimage imageNamed: #"fdj.png"]
style: UIBarButtonItemStyleBordered
target: nil
action: nil] autorelease];
This is what I'm using in an older project of mine (and yes, I know that stretchableImageWithLeftCapWidth is deprecated).
#implementation UIViewController (UIView_ExtenderClass) // this is a category, obviously
...
-(void)setLeftButton:(id)theTarget navItem:(UINavigationItem *)myNavItem action:(SEL)myAction title:(NSString *)myTitle;
{
CGSize titleWidth = [myTitle sizeWithFont:[UIFont boldSystemFontOfSize:14.0]];
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, titleWidth.width + 20, 32)];
[button setTitle: [NSString stringWithFormat:#" %#", myTitle] forState:UIControlStateNormal];
button.titleLabel.font = [UIFont boldSystemFontOfSize:14.0];
[button addTarget:theTarget action:myAction forControlEvents:UIControlEventTouchUpInside];
UIImage *imgBack = [UIImage imageNamed:#"32_left_nav_bar.png"];
UIImage *imgBackStretched = [imgBack stretchableImageWithLeftCapWidth:15 topCapHeight:0];
UIImage *imgBackSelected = [UIImage imageNamed:#"32_left_nav_bar_selected.png"];
UIImage *imgBackSelectedStretched = [imgBackSelected stretchableImageWithLeftCapWidth:15 topCapHeight:0];
[button setBackgroundImage:imgBackStretched forState:UIControlStateNormal];
[button setBackgroundImage:imgBackSelectedStretched forState:UIControlStateHighlighted];
UIBarButtonItem *buttonItem = [[UIBarButtonItem alloc] initWithCustomView:button];
[buttonItem setTarget:theTarget];
myNavItem.leftBarButtonItem = nil;
myNavItem.leftBarButtonItem = buttonItem;
[imgBack release];
[imgBackSelected release];
[button release];
[buttonItem release];
}
Call it in the viewDidLoad of the second controller, like this:
[self setLeftButton:self navItem:self.navigationItem action:#selector(yourActionHere) title:#"Back"]
The image I'm using is here: http://i49.tinypic.com/6qfzfs.png
I want customize UIBarButtonItem,here is my code.
in ios4.3 it works,but ios5, it‘s very strange.
the uibarbuttonitem disappeared out of sight,but you click on it still has the effect。As is transparent。
I need help,how to make the uibarbuttonitem display。thanks
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(0, 0, 50, 30);
[btn setBackgroundImage:[UIImage imageNamed:#"btnRegister.png"] forState:UIControlStateNormal];
[btn setTitle:#"register" forState:UIControlStateNormal];
[btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
[btn addTarget:self action:#selector(registerClick:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *item1 = [[UIBarButtonItem alloc] initWithCustomView:btn];
self.navigationItem.rightBarButtonItem = item1;
There is a great tutorial about new customization features in iOS 5 here : http://www.raywenderlich.com/4344/user-interface-customization-in-ios-5
Here's a copy of code from that site that deals with customization of UIBarButtonItems, its pretty self-explanatory :
UIImage *button30 = [[UIImage imageNamed:#"button_textured_30"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 5, 0, 5)];
UIImage *button24 = [[UIImage imageNamed:#"button_textured_24"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 5, 0, 5)];
[[UIBarButtonItem appearance] setBackgroundImage:button30 forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
[[UIBarButtonItem appearance] setBackgroundImage:button24 forState:UIControlStateNormal
barMetrics:UIBarMetricsLandscapePhone];
[[UIBarButtonItem appearance] setTitleTextAttributes:
[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor colorWithRed:220.0/255.0 green:104.0/255.0 blue:1.0/255.0 alpha:1.0],
UITextAttributeTextColor,
[UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0],
UITextAttributeTextShadowColor,
[NSValue valueWithUIOffset:UIOffsetMake(0, 1)],
UITextAttributeTextShadowOffset,
[UIFont fontWithName:#"AmericanTypewriter" size:0.0],
UITextAttributeFont,
nil]
forState:UIControlStateNormal];
My problem is similar to this one. In my case, the button appear no enable. And when you put in it still has the effect. One little solution is change the tint of the button with white but I am looking for a better way :)
My code is:
buttonImage = [UIImage imageNamed:#"top_icon_share.png"];
UIButton *buttonShare = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height)];
[buttonShare setBackgroundImage:buttonImage forState:UIControlStateNormal];
[buttonShare addTarget:self action:#selector(buttonSharePressed)
forControlEvents:UIControlEventTouchUpInside];
[buttonShare setShowsTouchWhenHighlighted:YES];];
UIBarButtonItem *buttonBarShare = [[UIBarButtonItem alloc]initWithImage:[UIImage imageNamed:#"top_icon_share.png"] style:UIBarButtonItemStylePlain target:self action:#selector(buttonSharePressed:)];