I'm working on project that uses a tab bar at the bottom to flip through 5 sections of my app. One of these sections loads a map view which then spawns a web view. This was done with Round Rect Buttons at first, but they got in the way of the views, so I decided to switch to a navigation bar. In Interface Builder I inserted a navigation item and within it two Bar Button Items (left and right side). I've gotten the functionality for both button to work by control dragging from file's owner to fire the method associated with each button. This works fine and launches my web view, but what I would like to be able to do and have yet to figure out how to so far, is changing one of the buttons to a "done" or "back" button once in the web view. I've tried creating both buttons programmatically but neither would appear. This is the code I tried using to accomplish this...
UIBarButtonItem *updatePosition = [[UIBarButtonItem alloc] initWithTitle:#"Update Position"
style:UIBarButtonItemStylePlain target:self action:#selector(findMe)];
self.navigationItem.leftBarButtonItem = updatePosition;
[updatePosition release];
When I run the app, the button does not show up on the navigation item I inserted using Xcode. The only way I can get the buttons to appear is by inserting them with Interface Builder as I previously mentioned. But then I can not change the left button to a "back" or "done" button once I've brought up the new view. I tried running this code to change the style of the button on the UIBarButtonItem I inserted using IB with this code
self.navigationItem.leftBarButtonItem.style = UIBarButtonItemStyleDone;
But to no avail.
Here are some Utility methods to help you along the way:
+ (UIBarButtonItem *)setRightBarButtonItem:(SEL)action target:(id)sender withImage:(NSString *)imageName {
UIImage *buttonImage = [UIImage imageNamed:imageName];
UIBarButtonItem *buttonItem = [[[UIBarButtonItem alloc] initWithImage:buttonImage
style:UIBarButtonItemStyleBordered
target:sender
action:action] autorelease];
return buttonItem;
}
+ (UIBarButtonItem *)setRightBarButtonItem:(SEL)action target:(id)sender withBarButtonSystemItem:(UIBarButtonSystemItem)systemItem {
UIBarButtonItem *buttonItem = [[[UIBarButtonItem alloc] initWithBarButtonSystemItem:systemItem
target:sender
action:action] autorelease];
return buttonItem;
}
Usage:
// Done button.
self.navigationItem.rightBarButtonItem = [Utility setRightBarButtonItem:#selector(doneTapped:) target:self withBarButtonSystemItem:UIBarButtonSystemItemDone];
Related
This is a bit of a hack, but trying to get a badge on a toolbaritem. Almost there, but it appears in the back, tried normal methods to get to front with no luck.
deletedCountBadge = [CustomBadge customBadgeWithString:#"0"];
deletedCountBadge.frame = CGRectMake(100,10,25,25);
UIView *view = (UIView *)[bottomToolBar.subviews objectAtIndex:0];
[view addSubview:deletedCountBadge];
Got it to work with a couple of different pointers on the net.
1) If you are moving the toolbar around at all (.frame=) make sure to set the items after the layout
2) Can use negative spacing items to get it to show up where you want.
UIBarButtonItem *deleteBadge = [BarButtonItemBadge barButtonItemBadge:#"1" insideColor:[UIColor blueColor]];
UIBarButtonItem *negativeSeperator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
negativeSeperator.width = -30;
[bottomToolBarDictionaryButtonItems addObject:deleteBadge];
[bottomToolBarDictionaryButtonItems addObject:negativeSeperator];
// after any layout, of tool bar
[bottomToolBar setItems:bottomToolBarDictionaryButtonItems];
As I'm sure you know, navbars inside a navigation controller stack get a back button that shaped sort of like an arrow with a pointy end on the left. I want to use this button image for my own uibuttons and navbar items, but it's missing from from the attribute inspector > bar item > image drop down menu. Where is this graphic located and how can I use it?
here's a screen of the button to which I refer:
If you want to do this programatically -
UIBarButtonItem *button = [[UIBarButtonItem alloc] initWithImage:yourImage style:UIBarButtonItemStyleBordered target:nil action:nil];
self.navigationItem.backBarButtonItem = button;
[button release];
You can use like below in xib-
I am working on a navigation based application. Until now I am able to do this:
self.navigationItem.title=self.Category;
UIBarButtonItem *btnNewGame = [[UIBarButtonItem alloc] initWithTitle:#"New Game" style:UIBarButtonItemStyleBordered
target:self action:#selector(btnNewGameclicked:)];
self.navigationItem.rightBarButtonItem = btnNewGame;
[btnNewGame release];
and then I can call the method provided by the selector. No problems since here.
What happens now is that I have the left bar button item, the title and the right bar button item.
Problem
The title on the left bar button item is not back, but it appears to be the same as the navigation item's title. How can I change this? Any suggestions?
Thanks.
default behaviour of the left bar button item, is to display the title of the previous view Controller
if you want to change the text on the left bar button item, you need to replace the left (back) button like this
UIBarButtonItem *myBarButtonItem = [[UIBarButtonItem alloc] init];
myBarButtonItem.title = #"Back"; // or whatever text you want
self.navigationItem.backBarButtonItem = myBarButtonItem;
[myBarButtonItem release];
As per your question what i understand , your problem is that the title of leftbarbuttonitem is not Back, this is because you gave the previous screen some title.That's why leftbarbutton item shows the title of navigation-item and not as Back.To remove that you must have erase the title of previous view or do it pro-grammatically as given by Matt.
And why not
self.navigationItem.leftBarButtonItem.title = #"MyTitle";
?
Try this way in the viewDidLoad method:
self.navigationController.navigationBar.topItem.title = #"YourBack";
This worked for me.
I am tearing my hair out on this one. My client wants to add a button to the left of a search bar like the example below:
(source: erik.co.uk)
But I just can't figure out how to do it. Apple don't seem to provide any documented method for adding custom buttons to a UISearchBar, let alone to the left of the search bar.
I've tried hacking around in Interface Builder adding a UIToolbar with a button in it to the left but I cannot find any combination of styles where the two line up properly to give the impression that they are one. There is always what looks like one pixel difference in the vertical alignment as you can see from the picture below:
(source: erik.co.uk)
I've searched around and just can't find the answer, but as we can see from the screenshot it must be possible!
Thank you in advance for your help.
Erik
Use a navigation bar instead of a toolbar. Set the search bar to the navigation bar's title view.
In Interface Builder:
Result:
You can replace the Bookmark image instead, and adjust its offset if necessary.
For example:
[self.searchDisplayController.searchBar setImage:[UIImage imageNamed:#"plus2"] forSearchBarIcon:UISearchBarIconBookmark state:UIControlStateNormal];
[self.searchDisplayController.searchBar setPositionAdjustment:UIOffsetMake(-10, 0) forSearchBarIcon:UISearchBarIconBookmark];
Handle the button event in the delegate method:
- (void)searchBarBookmarkButtonClicked:(UISearchBar *)searchBar
This is how it looks:
The first solution is to use UINavigationBar instead of UIToolbar, as KennyTM noticed. But you may not be satisfied with Navigation bar, like in my case, when I need to use 3 buttons (Navigation bar is allow to use only 2 buttons) - see the left picture. This is how I did it:
Use Toolbar with 3 buttons and Flexible Space Bar Button Item in the place where search bar should be placed.
Put search bar on (not in) the toolbar. To do so in Interface Builder, do not drag & drop the search bar on the toolbar. Instead, put it somewhere nearby and then move it to place using the arrow keys on the keyboard (or by changing X & Y position in Interface Builder).
Search bar left black line under it (see the right picture). To hide it I put one additional view with the height 1px and a white background over it.
It looks a bit dirty for me, so if you have a better solution, let me know.
The easiest solution is to add your SearchBar in TOP of your Toolbar, (not in), I give you the best solution I use in my company eBuildy:
UIBarButtonItem *mySettingsButton = [[UIBarButtonItem alloc] initWithTitle:#"Settings" style:UIBarButtonItemStyleBordered target:self action:#selector(refresh)];
UIBarButtonItem *mySpacer = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
UIBarButtonItem *myRefreshButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh target:self action:#selector(refresh)];
UIToolbar *myTopToolbar = [[UIToolbar alloc]initWithFrame:CGRectMake(0,0,320,40)];
UISearchBar *mySearchBar = [[UISearchBar alloc]initWithFrame:CGRectMake(70,1,220,40)];
[myTopToolbar setItems:[NSArray arrayWithObjects:mySettingsButton,mySpacer,myRefreshButton, nil] animated:NO];
[self.view addSubview:myTopToolbar];
[self.view addSubview:mySearchBar];
answering an old question here but i was struggling with this one myself recently and found some shortcomings with the other answers for the situation i was trying to address. here's what i did in a subclass of UISearchBar:
first add a UIButton property (here "selectButton"). then override the initWithFrame method and do something similar to the following:
-(id)initWithFrame:(CGRect)frame{
if (self = [super initWithFrame:frame])
{
self.selectButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
self.selectButton.contentEdgeInsets = (UIEdgeInsets){.left=4,.right=4};
[self.selectButton addTarget:self action:#selector(pressedButton:) forControlEvents:UIControlEventTouchUpInside];
self.selectButton.titleLabel.numberOfLines = 1;
self.selectButton.titleLabel.adjustsFontSizeToFitWidth = YES;
self.selectButton.titleLabel.lineBreakMode = UILineBreakModeClip;
[self addSubview:self.selectButton];
[self.selectButton setFrame:CGRectMake(5, 6, 60, 31)];
}
return self;
}
Now you want to override the layout subviews method to resize the searchbar to the appropriate width, depending on whether or not the cancel button is showing. That should look something like this:
-(void)layoutSubviews
{
[super layoutSubviews];
float cancelButtonWidth = 65.0;
UITextField *searchField = [self.subviews objectAtIndex:1];
if (self.showsCancelButton == YES)
[searchField setFrame:CGRectMake(70, 6, self.frame.size.width - 70 - cancelButtonWidth, 31)];
else
[searchField setFrame:CGRectMake(70, 6, self.frame.size.width - 70, 31)];
}
Note that in the above method I added a constant for the cancelButtonWidth. I tried adding code to get the width from [self cancelButton] but that seems only accessible at runtime and doesn't allow the project to compile. In any case this should be a good start for what you need
If you want a custom button on the right, taking place of the Cancel button, just use this code (valid for iOS 9 and up):
[self.searchBar setShowsCancelButton:YES];
[[UIBarButtonItem appearanceWhenContainedIn:[self.searchBar class], nil] setTitle:#""];
[[UIBarButtonItem appearanceWhenContainedIn:[self.searchBar class], nil] setImage:[UIImage imageNamed:#"search"]];
I have a UIBarButtonItem on a navigation bar. I'd like to make it arrow shaped. By that I mean I want it to be square except for a pointy side. Does anyone know how to do this?
Thanks!
I wrestled with several approaches on this one and finally figured it out using all the answers from several sources. There are a couple of tricks; this snippet will show it all (I was creating a custom rightNavButton, but you can adapt this easily for any UIBarButtonItem):
// Produces a nice "right arrow" style button that mirrors the back arrow
// automatically added by the navController
//
UIImage *buttonImage = [UIImage imageNamed:#"forwardButton.png"];
UIButton *forwardButton = [UIButton buttonWithType:UIButtonTypeCustom];
[forwardButton setBackgroundImage:buttonImage forState:UIControlStateNormal];
[forwardButton setTitle:#"Meter" forState:UIControlStateNormal];
forwardButton.font = [UIFont boldSystemFontOfSize:12];
forwardButton.frame = CGRectMake(0, 0, buttonImage.size.width, buttonImage.size.height);
[forwardButton addTarget:self action:#selector(showMeter)
forControlEvents:UIControlEventTouchUpInside];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc]
initWithCustomView:forwardButton];
Note: it turns out that if you try to set the target and action directly on the button item after assigning a custom view using a UIButton that it won't take - you have to set the target and action on the button itself - apparently the navBar uses the button provided verbatim.
This is the image I was using on the opaque black navBar (you can use anything, obviously): http://raretiger.com/images/forwardbutton.png
Make a custom background. See Creating a left-arrow button (like UINavigationBar's "back" style) on a UIToolbar for how.
You may -pushNavigationItem:animated: to make the built-in back button appear, although you cannot assign custom actions to it.
For undocumented methods, you may use
UIButton* backButton = [UIButton buttonWithType:101];
to create a back "button".
You could create an UIImageView or an UIButton with the required image then use:
[[UIBarButtonItem alloc] initWithCustomView: arrowButton];
Hope this helps.
continuing on #Plamen Dragozov's idea: i noticed if you leave the uibutton as is, it would trigger a picture adjustment when touched and that is quite the opposite what a normal navigation back button does. So what I did was to uncheck "highlighted adjusts Image" and it works like a charm.
hope this helps newbies like me.
More elegant solution:
UIBarButtonItem * backButtonItem = [[UIBarButtonItem alloc] initWithTitle:#"Title" style:UIBarButtonItemStylePlain target:self action:#selector(back:)];
[backButtonItem setBackgroundImage:[UIImage imageNamed:#"back.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
self.navigationItem.leftBarButtonItem = backButtonItem;
My problem was renaming the back button that appears on the pushed view controller. I found a dirty workaround and if you ignore the non-ideal animation problem, you'll get a back button with the title you want.
The trick is to change the title of the first VC in viewWillDisappear and re-set it of course in viewWillAppear
(Needless to say, by default, if there is no leftBarButtonItem set, UINavigationController will show a back button with the title of the VC that pushed the current VC)
In the VC where you push your current VC, do
-(void) viewWillDisappear:(BOOL) animated {
[super viewWillDisappear:animated];
self.title = #"Back";
}
-(void) viewWillAppear:(BOOL) animated {
[super viewWillAppear:animated];
self.title = #"Original Title";
}