I am using a navigation controller, and I have the style set to :
navController.navigationBar.barStyle = UIBarStyleBlackTranslucent;
But when I run my program, the navigation controller looks like it is on top of a white background, not my background. When I push a controller, left or right, all my view, the current one, shifts to the top exactly the size of the navigation bar. And it is there where I can see my background through the navigation controller bar. Any ideas? When my barStyle is set to opaque, everything looks fine. I was thinking on setting my view frame a negative 'y' value, but I think there should a more elegant way.
I believe the UINavigationController assumes that your controller view frames don't include the area beneath the navigation bar.
UIBarStyleBlackTranslucent is more often used for UIToolbar, so Apple probably didn't make it easy to use it nicely with UINavigationBar. You'll probably need to abandon the UINavigationController, or start hacking the frames (careful with rotations), if you want to reliably render under the bar area.
Also, if your intention is to hide the navigation bar after a few seconds, you'll have a much easier time if you make it fade out (like the Photos app) instead of trying to slide it up (like Mobile Safari). Trust me on that one... that took me a lot of time to learn the hard way.
Simply use a transparent background image, and translucent = YES to allow the content to flow below the bar. Works on iOS 5 / 6. Add in viewDidLoad.
self.navigationController.navigationBar.translucent = YES;
UIImage * backgroundImage = [UIImage imageNamed:#"spacer.gif"];
[self.navigationController.navigationBar setBackgroundImage:(UIImage *)backgroundImage forBarMetrics:UIBarMetricsDefault];
I attached the spacer.gif image here, a single 1px x 1px transparent image.
self.navigationController.navigationBar.tintColor = [UIColor colorWithRed:0.169 green:0.373 blue:0.192 alpha:0.9];
self.navigationController.navigationBar.translucent = YES;
Note:
Don't use self.navigationBarStyle and self.navigationBarTintColor to change.
Add the last two statements to your viewDidLoad.
I ran into this same problem (in 3.1.3) and while you can't set the bar style after the navigationBar has already been setup you CAN set the tintColor and translucent values whenever you like:
self.navigationController.navigationBar.tintColor = [UIColor blackColor];
self.navigationController.navigationBar.translucent = YES;
Will create the 'blackTranslucent' bar, I change the navigationBar look when I push certain view controllers onto the stack.
I had the same problem, and I solved it by making the background of the root view the same as my view. The white area behind the navigation bar turned out to be the root view.
The navigation controller offsets the coordinate sytem of all it's subviews so they draw below the navigation bar.
Extend your view's frame into the negative y domain for it to draw under the navigation bar.
You need to set the barstyle in your info.plist file for it offset everything correctly.
However, I haven't tried it since the 2.1 f/w was released, but when I tried this in 2.0 I found that the setting was lost after a rotation from portrait to landscape.
try to use this, may be it will helpful.
_topToolBar.barStyle = UIBarStyleBlackTranslucent;
_topToolBar.alpha = 0.3;
I had a same problem.I solved!
ImageViewExtendController *detailImageController = [[ImageViewExtendController alloc] init];
[detailImageController loadImage:url];
[self.navigationController pushViewController:detailImageController animated:YES];
If you set your nav controller's navigationBar to transparent in your App delegate early enough (It worked for me before adding the nav controller to the window), it will automatically shift your view up underneath the navigation bar.
Unfortunately it does not also shift your view underneath the status bar. Sad, it looks like you need to implement your own version of UINavigationController. Luckily, it's not too bad as UINavigationBar is pretty reusable.
Try this:
self.tabBarController.tabBar.superview.backgroundColor = [UIColor blackColor];
Change the Extend Edges options in child viewControllers
As for example, in xcode editor, go to your first viewcontroller child and unset the options:
Extend Edges;
Under Top Bars;
Under Bottom Bars;
Under Opaque Bars;
This way your child ViewController will not layout starting below the status bar of the navigation controller, neither the tabbar or the toolbars
hope it may help anyone
Related
I had to add an image so that half of it is in the navigation bar and remaining is in the view.I know there is always a probability of adding two images,but i want to know is there any way to add an image view(only one)between the two?Now i know i can do this way ,
[self.navigationController.navigationBar addSubview:imageView];
and also self.view addSubview:imageView,but i need a single image view to be shared between the two
ie the first half is in navigation bar and the remaning is in the view.can anybody help me on this?
No, this is not possible AFAIK. A view (including a UIImageView) can only have one superview. SO it's either a child of the UINavigationBar or one of the other view, but not both.
with ios 7 you can use translucent navigations bars so that you can set the imageview in your view and it shines through the navbar :-)
CGRect cgRect1 = [[UIScreen mainScreen] applicationFrame];
UISearchBar *mySearchBar = [[UISearchBar alloc]
initWithFrame:CGRectMake(0, 0, cgRect.size.width, 40)];
mySearchBar.autoresizingMask =
UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight ;
UITableView *myTableView = [[UITableView alloc]
initWithFrame:CGRectMake(0, 40, cgRect.size.width, cgRect.size.height-40)];
myTableView.autoresizingMask =
UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight;
[self.view addSubview:mySearchBar];
[self.view addSubview:myTableView];
In the earlier versions it is working correctly. The search bar is appearing below the statusbar and navigation bar. The tableview is appearing below the search bar
But when I run this on Xcode 5 sdk iOS 7, the search bar is not visible (I think its placed under the status bar and navigation bar) , and also the navigation bar is appearing over the table view.
Will it be fixed with iOS 7 stable release ?
Or is it the problem of my coding ?
Or should we handle it by adding the y (y = statubar height + nav bar height) value for iOS 7 ?
I recently downloaded Xcode 5 DP to test my apps in iOS 7. The first thing I noticed and confirmed is that my view's bounds is not always resized to account for the status bar and navigation bar.
In viewDidLayoutSubviews, I print the view's bounds:
{{0, 0}, {320, 568}}
This results in my content appearing below the navigation bar and status bar.
I know I could account for the height myself by getting the main screen's height, subtracting the status bar's height and navigation bar's height, but that seems like unnecessary extra work.
Has anyone else experienced this issue?
UPDATE:
I've found a solution for this specific problem. Set the navigation bar's translucent property to NO:
self.navigationController.navigationBar.translucent = NO;
This will fix the view from being framed underneath the navigation bar and status bar.
However, I have not found a fix for the case when you want the navigation bar to be translucent. For instance, viewing a photo full screen, I wish to have the navigation bar translucent, and the view to be framed underneath it. That works, but when I toggle showing/hiding the navigation bar, I've experienced even stranger results. The first subview (a UIScrollView) gets its bounds y origin changed every time.
That’s not entirely true. There has been a new property introduced in iOS 7 that lets you adjust the layout behavior as in previous versions of iOS. Place this piece of code in your view controller, and you should be good to go! The space your navigation bar takes up should be accounted for automatically
if ([self respondsToSelector:#selector(edgesForExtendedLayout)])
self.edgesForExtendedLayout = UIRectEdgeNone;
You need add the above in your -(void)viewDidLoad method.
Note: You should be using the latest GM release of iOS 7 and Xcode 5 now since the API has changed from beta versions.
If you are working in Storyboard (which I strongly recommend!) this is the solution:
You can disable "Extend Edges" of your ViewController in storyboard. You have to do this for each viewController. You can disable extended edges by clicking the viewController icon in stortyboard (besides the productOwner beneath the view itself) and then selecting the attributes inspector (Like the images shows).
This will also set the alignment lines like iOS 6.
Another great tool in xCode 5 is "Preview": click on the butler Button (assistant editor) and select Preview. there you can select iOS 6 and see how your storyboard design will look like on iOS 6.
Its just great:D
[Update]
Be careful: disabling "Extend Edges" might result in a black glow on the navigation bar when the app enters background on iOS7. the glow will also be visible on the multitasking view (double press on home button). this can be solved by setting the background color of the navigation's bar view to white.
[self.navigationController.view setBackgroundColor:[UIColor whiteColor]];
As the OP says, there is a simple solution to this which is to set the navigation bar to be opaque. Rather than doing this in code, simply untick "Translucent" for your root navigation bar:
self.edgesForExtendedLayout=UIRectEdgeNone;
It works on iOS 7 simulator(Xcode 5 DP5)
these answers were all helpful, especially MQoder's, but for me i also had to set the default top bar to "opaque black navigation".
#One Man Crew's answer is correct, but:
I would recommend to use this code to avoid errors when running the app on older versions :
#if __IPHONE_OS_VERSION_MAX_ALLOWED > __IPHONE_6_1
if ([self respondsToSelector:#selector(edgesForExtendedLayout)])
self.edgesForExtendedLayout = UIRectEdgeNone;
#endif
self.edgesForExtendedLayout = UIRectEdgeNone;
And you need to do this on AppDelegate#application:didFinishLaunchingWithOptions:
self.window.backgroundColor = [UIColor whiteColor];
Otherwise Navigation Bar's background color will changed to gray. Because the transparent Navigation Bar overlaps window.
If you want to keep the transparency when the user scrolls your table view, you can set the contentInset of it:
CGFloat topLayoutGuide = self.topLayoutGuide.length + self.tabBarController.navigationController.navigationBar.frame.size.height;
self.tableView.contentInset = UIEdgeInsetsMake(topLayoutGuide, 0, 0, 0);
One solution is to use Navigation Controller. This automatically solve the issue.
Also use Xcode 5 instead of Xcode Preview versions since they are beta ones.
How to make tableview's content displayed under a transparent navigation bar?
Like this:In "Photos" app, albums displayed under navigation bar.
Special thanks
If you use _rootNavigationController.navigationBar.barStyle = UIBarStyleBlackTranslucent; then set correct tableview frame thats it. If you are in xib dont forget to simulate the translucent navigation bar.
One way I have found to accomplish this is by shifting your tableview's superview up to have the origin at {0, 0}. However after researching more several people have said altering the superview (UIViewControllerWrapperView) is a bad idea. However I also have not found any information on why just changing the frame would create problems. I am shifting the superview right now and haven't found any problems related to it yet.
Might be you can set it like this:
[navigationBar setAlpha:0.5f];
For making the navigation bar transparent alone, you can check this post, How to make a Navigation bar transparent and fade out like in the photo app in the iPhone
Also check this How to set the transparency color for Toolbar and Navigation bar using MonoTouch?
I am not sure whether you can add the table view behind the navigation bar. You might have to add it as a subview of self.parentViewController.view.
Another way to do this is by hiding navigation bar and using a transparent tool bar in place of that. This can be added on top of the current view. The only problem is with the back button. You might have to use custom button for that.
As above, I can't seem to change the background color or image of the tabBar. Even when hiding it by changing alphan 0, I still see it as a black solid bar.
How can I fix this?
Try this piece of code:
[tabBar setHidden:YES];
If you're trying to set an image for the background, try this:
[tabBar setBackgroundImage:myImage];
There is nothing behind the tab bar. The views of the view controllers that tab bar controllers manage do not extend into the area occupied by the tab bar.
In my applicationDidFinishLaunching I set up a UINavigationController:
- (void)applicationDidFinishLaunching:(UIApplication *)application {
navController = [[UINavigationController alloc] init];
[[navController navigationBar] setFrame:CGRectMake(0.0,0.0,320.0,20.0)];
...
}
As you can see, I am trying to make the navigation controller's height 20px. However, this is not working. I would imagine setFrame must be the correct function but I am not calling it in the right place. I realize that other questions on SO are similar to mine, but I think setting the navigationBar height should be possible if it responds to setFrame...right?
Also, anyone know the default height of the navigationBar?
Thanks!
The default height of the navigation bar is 44px.
I am not sure you should be attempting to directly resize the navigation bar, the documentation certainly discourages it:
When used in conjunction with a
navigation controller, there are only
a handful of direct customizations you
can make to the navigation bar.
Specifically, it is alright to modify
the barStyle, tintColor, and
translucent properties of this class,
but you must never directly change
UIView-level properties such as the
frame, bounds, alpha, or hidden
properties directly.
Depending on what you are trying to do it may be easier to place a new UIView over/below the navigation bar.
Default height is 44 pixels for navigationbar.
If you want to change it, try adding a category to UINavigationBar and override setFrame: method.