I'm trying to make a custom UINavigationBar, but the problem is that my background image has a curve in it, and its little bit larger than default navigation bar. When I try to set background image and change navigation bar size, its just scales image as a rectangle. Any ideas?
Bar:
Override
- (CGSize) sizeThatFits:(CGSize)size {
return CGSizeMake(custom_width, custom_height);
}
in order to return the size for your custom navigation bar.
Note that if you use a height that is not a multiple of 4, it will cause trouble if you hide and then show the navigation bar at any point (it gets shifted by 1 pixel from the top)
Related
I'm hiding the Navigation Bar on one of the screens, and if is set:
navigationController?.navigationBarHidden = true
The status bar becomes black. Also, the image doesn't fit all the screen (see the screenshot).
If I comment this line, Navigation bar stays on screen, and the status bar is white.
Full code:
override func viewWillAppear(animated: Bool) {
navigationController?.navigationBarHidden = true
navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
navigationController?.navigationBar.translucent = true
navigationController?.navigationBar.backgroundColor = UIColor.clearColor()
navigationController?.view.backgroundColor = UIColor.clearColor()
All constraints of ImageView are set to 0 and it's set to fill the screen:
So, I want to put ImageView under the status bar and make the status bar icons/text white. What I'm doing wrong?
You're not doing anything "wrong". You have set the top of the image view to the bottom of the view controller's top layout guide. Well, that's the bottom of the status bar — exactly where you see the top of the image view.
If you want the image view to underlap the status bar, its top needs to be pinned to the top of the main view, not the top layout guide.
And if you want the status bar to change text color, you need to implement preferredStatusBarStyle to return .LightContent. If this means that the result of preferredStatusBarStyle has changed, you would need to call setNeedsStatusBarAppearanceUpdate to alert the runtime to this fact.
To place the image view under the status bar, and have the image view fill the UIViewControllers view:
Clear all constraints for the image view
Add a constraint to set the image view to have the same width as the parent view
Add a constraint to set the image view to have the same height as the parent view
Pin the image view to the nearest neighbor as shown below. Add the constraints
The final constraints will look like the following:
I have some problems in XCode. I tried to get my navigation bar colored which works perfectly but, the statusbar won't change its color too. I already searched, but nothing works for me.
I hope it is possible to do this without code.
Here is my take on this:
First, iOS gives only two kinds of status bar appearance - light or default.
It is important to note as well that the system status bar no longer
has any background color. When the API refers to
UIStatusBarStyleLightContent, they mean white text on a clear
background. UIStatusBarStyleDefault is black text on a clear
background.
To set status bar white throughout the app:
UIApplication.sharedApplication().statusBarStyle = .LightContent
To set status bar black throughout the app:
UIApplication.sharedApplication().statusBarStyle = .default
Second, As a side note, in your info.plist, you can use UIViewControllerBasedStatusBarAppearance to NOif you want to set the above style at app level (inside your AppDelegate). Otherwise set this property to YES and implement following method in each your view controller to set different styles based on your needs:
override func preferredStatusBarStyle() -> UIStatusBarStyle {
return UIStatusBarStyle.LightContent
}
Third, To have a custom color on your status bar, you can add a UIView of desired colour just below the status bar like this:
UIView *addStatusBar = [[UIView alloc] init];
addStatusBar.frame = CGRectMake(0, 0, screenWidth, 20);
addStatusBar.backgroundColor = [UIColor grayColor]]; //assign here your color
[self.window.rootViewController.view addSubview:addStatusBar];
Fourth, importantly, UINavigationController will alter the height of its UINavigationBar to either 44 points or 64 points based on following points:
If the UINavigationController detects that the top of its view’s
frame is visually contiguous with its UIWindow’s top, then it draws
its navigation bar with a height of 64 points.
If its view’s top is not contiguous with the UIWindow’s top (even if
off by only one point), then it draws its navigation bar in the
“traditional” way with a height of 44 points.
Using xcode6, and storyboarding
I have a toolbar that is at the top of my view. under the toolbar is a mapview. The map view extends under the status bar which is what I want. Basically I want the toolbar and status bar to be a little transparent ~20%, such that you can see the mapview beneath.
I have setup my toolbar's background color to be white 80% opaque. However I have no idea how to get the status bar to be exactly the same thing.
From everything I know, the status bar is 100% transparent, meaning it will show any view that is beneath it. I have tried to add a 20 point tall view above my toolbar, and I have set that to white, 80% transparent. That almost achieves the same effect that I am going for, but there is a black line between the toolbar and the status bar,
Am I even on the right track? How do I make the toolbar color and transparency match the status bar color and transparency and avoid the line?
EDIT:
clipsToBounds worked great at removing the line.
I added a button programmatically:
-(void)splitViewController:(UISplitViewController *)svc willHideViewController:(UIViewController *)aViewController withBarButtonItem:(UIBarButtonItem *)button forPopoverController:(UIPopoverController *) pc {
button.image = [UIImage imageNamed:#"bars"];
NSMutableArray *items = [self.toolbar.items mutableCopy];
if (!items) {
items = [NSMutableArray arrayWithObject:button];
} else {
[items insertObject:button atIndex:0];
}
[self.toolbar setItems:items];
}
And after I add that button my toolbar background turns back to white:
EDIT 2
So I just discovered the UIBarPositionTopAttached enum and that I can set my view as the toolbars delegate. I did this:
(UIBarPosition)positionForBar:(id )bar {
return UIBarPositionTopAttached;
}
And verified that it was called. I was hoping this would tell iOS that my toolbar is attached to the status bar and that my toolbar color and all would flow into the status bar. Is that not the case either?
Seems like attaching a toolbar to the status bar such that the status bar takes the backgroud of the toolbar should not be this hard, i.e. do I really have to create an extra 20 point high view to achieve this? And even if so seems like I am doing it wrong, as when I add button my toolbar transparency goes back to opaque.
The UIToolbar has a hairline shadow at the top. If you set the bounds clipping property it will hide the line.
toolbar.clipsToBounds = YES;
While clips to bounds works great, I think the right answer to this question use barPosition on toolbar.
There are a couple ways to do this:
Set your view as the delegate to the toolbar and implement this delegate method:
- (UIBarPosition)positionForBar:(id <UIBarPositioning>)bar {
return UIBarPositionTopAttached;
}
Or in a storyboard set a User Defined Runtime Attribute on the UIToolbar:
barPosition Number 3
I'm trying to set a horizontal gradient on a UINavigationBar. I've so far got it so that in portrait mode the gradient displays correctly by using the following code:
static internal class UINavigationControllerExtensions
{
public static void SetBarDefaults(this UINavigationController controller)
{
controller.NavigationBar.BarTintColor = UIColor.FromPatternImage(UIImage.FromFile(IosConstants.ApplicationGradient));
//Other setup stuff
}
}
This extension method gets called on our first view and it sets it correctly for all the portrait views.
My problem occurs when the device is rotated. When this happens the gradient gets cut off at the width of the NavigationBar as if it is in portrait mode and then starts again resulting in a line of stark difference.
I've tried as an experiment waiting for a rotation event on a view controller then re-calling this method to try to re-draw the gradient but apparently that doesn't work either.
Does anyone know how I can get this to resize properly on rotation?
You can use that :
[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:#"gardientImage"] forBarMetrics:UIBarMetricsDefault];
for ios 7 navigation bar height is 64px
I'm working on a project that needs to have the navigation bar height bigger than the default.
This is how i set the nav bar height:
- (CGSize)sizeThatFits:(CGSize)size {
if (iPad) {
CGSize newSize = CGSizeMake(768,86);
return newSize;
}
return CGSizeMake(320, 44);}
I set an bg image for the navigation bar and that's working ok.
The problem is that the back button and the right button item are not centered.
Does anyone know how to center them?
Thanks
It's generally bad practice to manipulate the navigation bar's height. I tried to do it a number of different ways for one project and every approach had a "gotcha". Namely, the navigation buttons are always justified to the bottom of the navigation bar, so adjusting it's height will cause the buttons to look like they're rendering towards the bottom of the bar. And the buttons will animate oddly as you push and pop other controllers. I would suggest not adjusting the height of the navigation bar.