Trying to use a background image that is bigger that than the regular size with some details that hang off the bottom.
So I'm doing this to set the image:
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:#"nav_bar_home.png"] forBarMetrics:UIBarMetricsDefault];
[self.navigationController.navigationBar setClipsToBounds:NO];
[self.navigationController.navigationBar setTranslucent:NO];
And It's still getting clipped.
Some other things I've tried:
Splitting the image up in Photoshop and setting the top 44points (the size that logs out when I log out the navigationBar's frame) to the backgroundImage and the rest to the shadowImage.
From memory this worked fine in iOS 5, 6.
Is there a nice way to do this now? Thanks :)
I'm pretty sure that I remember from one of the WWDC 2013 videos that what you were doing in iOS 5 and 6 (nav bar background view larger than the nav bar "with some details hanging off it") was considered wrong and they are no longer allowing it.
However, if you are supplying your own background image you can add a custom shadow image.
Related
I'd like to migrate my tableHeaderView based search bar to the new seamless search bar approach in iOS 11 by configuring navigationItem.searchController.
Since my navigation bar uses a custom background image, I'm wondering how to apply the same background image to the search bar as well. I tried
[navigationBar setBackgroundImage:[UIImage imageNamed:#"NavigationBarPromptBackground"] forBarMetrics:UIBarMetricsDefaultPrompt];
[searchBar setBackgroundImage:[UIImage imageNamed:#"NavigationBarBackground"] forBarPosition:UIBarPositionAny barMetrics:UIBarMetricsDefault];
to no avail. The search bar keeps the standard navigation bar background (with a barTintColor applied) but doesn't show the custom background image.
In my case I have a UISearchBar in a view, not placed in a UINavigationItem. A transparent background image I was setting wasn't showing up in iOS 11. However if I add a height constraint that forces the searchBar to be smaller the background image gets used for some reason. This is really odd behavior that must be a bug but it is working for me now.
If I do the following the background image gets used:
[[searchBar.heightAnchor constraintEqualToConstant:44.0] setActive:YES];
I do a very similar thing in my application and discovered on IOS11 it's now broken. This is the code I had which sets my image across the Search and Scope bars, works fine up to IOS10:
[searchBarSearch setBackgroundImage:image];
[searchBarSearch setScopeBarBackgroundImage:image];
I fixed it by adding this to the .plist
View controller-based status bar appearance = NO
Now my bar is coloured and changes as I select different options as it did before IOS11.
Hope this helps you!
Plasma
I have set a background image slightly bigger than the navigationBar.The image is 55px in height.[I want a banner looking image with ribbon at the bottom of nav bar]
It was working ok in iOS6.
But in iOS7, its getting clipped by itself.
I tried setting
[self.navigationController.navigationBar setClipsToBounds:NO];
It's still getting clipped.
Can't I have a bigger background image without getting clipped?
this is due to Ui navigation bar is 64 point in ios7 that why this create problem.
refer this link https://developer.apple.com/library/ios/documentation/userexperience/conceptual/transitionguide/Bars.html refer table 5-1 that is give you idea that for resizable image what are the change in new ios7
you can use UIBarPositioning propety to solve your problem not sure but that may help you
refer this link for more info related to UIBarPositioning
https://developer.apple.com/library/ios/documentation/uikit/reference/UIBarPositioning_Protocol/Reference/Reference.html#//apple_ref/occ/intfp/UIBarPositioning/barPosition
Edited
also try by set this flag
navigationBar.translucent = NO;
for more info refer this link
iOS 7 UINavigationBar - UIView layout issue
The image is not getting clipped, it is most probably just too small.
The UINavigationBar is 64 points in iOS 7, so the 55px image will be too small, especially considering the retina resolution where 128px would be needed.
set the delegate of your navigation bar to your view controller, and return UIBarPositionTopAttached in delegate method. return the position which you want to see
- (UIBarPosition)positionForBar:(id<UIBarPositioning>)bar
https://developer.apple.com/library/ios/documentation/uikit/reference/UIBarPositioning_Protocol/Reference/Reference.html#//apple_ref/occ/intf/UIBarPositioning
I'm trying to adapt my iOS 6 app to the new iOS 7 and I have found a problem that I can't fix.
As you can see in the images, it appears a black line in the header image. I think that this black line is because the background image is duplicated and the black line is just the end of the image and where starts the other.
pic 1 http://d3j5vwomefv46c.cloudfront.net/photos/large/810043729.png?1379670640
pic 2 http://d3j5vwomefv46c.cloudfront.net/photos/large/810043923.png?1379670706
The white one is a white image background
What I have done right now is to put the edges to none:
if ([self respondsToSelector:#selector(edgesForExtendedLayout)]) {
self.edgesForExtendedLayout = UIRectEdgeNone;
}
EDIT:
If I comment the line where I assign the image to the background, I can't se the black line! There all white, obviously without the image "forex crunch". So now, the question is, how can I put a background image in the navigation bar in iOS7?
What I have read in the Apple developers forum is to create an image with 64px instead of 44px. That's the solution for this problem
Only thing to do is set ShadowImage with this code and black line is off.
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed: #"navBarBack"]
forBarMetrics:UIBarMetricsDefault];
[self.navigationController.navigationBar setShadowImage:[[UIImage alloc] init]];
In this case I put navBarBack.png as navigationBar background. This image has 640pxx96px.
I'm trying to customise the navigation bars throughout my app.
The navigation controller has been created in IB.
I used the following code to add a custom image to the bar. The image is 320 x 44 points.
This code is in the AppDelegate in applicationDidFinishLaunchingWithOptions:
UIImage *navBackgroundImage = [UIImage imageNamed:#"Nav Image.png"];
[[UINavigationBar appearance] setBackgroundImage:navBackgroundImage forBarMetrics:UIBarMetricsDefault];
The problem is that on the simulator, the bar now covers half the screen! And covers up a load of content. Ive tried messing around with the image dimensions in Photoshop and it helps, but their must be an easier way than messing around and rebuilding with trial and error?!!
Are there any convenience methods that set the size of the nav bar?
Any help much appreciated!!
Maybe it is a layer Rasterization issue :
check if there is :
layer.shouldRasterize = YES;
layer.rasterizationScale = [UIScreen mainScreen].scale;
somewhere in your code and try commenting those lines.
(these lines are often linked to shadows to improve the performance when displaying them).
A quick solution is to go to the NIB file and select UINavigationControler -> Size Inspector -> TurnOff Autoresizing.
In my iOS 5+ app, I use a custom navigation bar image, with custom navbar buttons.
First of all, here is how I tell my app to use the images :
In AppDelegate.m :
UIImage *navBarImage = [UIImage imageNamed:#"Navbar"];
[[UINavigationBar appearance] setBackgroundImage:navBarImage forBarMetrics:UIBarMetricsDefault];
UIImage *barButton = [[UIImage imageNamed:#"Nav-button"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 6, 0, 6)];
[[UIBarButtonItem appearance] setBackgroundImage:barButton forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
So, the images are used. Great. But, there are a couple of things happening :
• First, on my button, under the bottom corners, au few white pixels appear (they're not on the original image, that's for sure). I also use a custom back button, and same thing happens. This seems to be more visible under iOS 6 than iOS 5.
• When I open a modal VC, the navigation bar is "filled up to the status bar" with white pixels. Only for a modal VC.
Here are screenshots of the situation.
iOS 5 , main VC.
iOS 5, modal VC.
iOS 6, main VC.
iOS 6, modal VC.
So, what can I do ? The white pixels under the buttons are not highly visible (a bit more for the back button), but I really want a nice design for the app, and this doesn't contribute at all..
Concerning the modal VC, I can use a "rectangle" image, which could cover the white pixels, but again, regarding design consistency, I'd prefer to use only one navigation bar..
As always, any explanation / solution / hint is greatly appreciated ! ;)
Thanks.
EDIT :
I just noticed that under iOS 6, the white pixels on top of the navigation bar are rounded, as the navigation bars in iOS 6.. Strange.. :)
Hm! just for testing purpose, can you download the following sample image for a navigation bar background and try this image instead? Just let us now how it looks with this image.
I'm just guessing, but i suppose your image is not pixel perfect for the navigation bar dimensions! Probably a few pixels below the optimum height for the navigation bar.