I have a project that was built last year, and it uses XIBs, no storyboards. The XIBs do not use Auto Layout, but they do use some Autosizing. I have an issue when running with iOS7, in which all the views are tucked under the status bar. I fully understand this is a new feature with iOS7, in which this can be expected. However, all of the solutions for fixing it to not do this are not working. I have an image at the top of the view that always shows under the status-bar, and I'm not using nav-bars or anything like that.
I have tried updating the Y-deltas in the XIB (they have no effect on the view), I have tried setting the edgesForExtendedLayout to UIRectEdgeNone (does nothing), and a multitude of other things. Every time, the status bar shows with the view tucked under it, no matter what I do.. that is unless I manually move down the view in the XIB to allow room for the status bar (but that solution doesn't work because it doesn't look right in iOS6, of course).
What's odd is that even when I try a line of code to hack in a view-shift, it doesn't work (like the following):
self.view.frame = CGRectMake(self.view.frame.origin.x, self.view.frame.origin.y+20, self.view.frame.size.width, self.view.frame.size.height);
..Not that I would go with that kind of solution, but it's just odd that it didn't work (the only time I typically see that not work is if Auto Layout is in place, which it's not in this case).
It is a design requirement that the status-bar shows, and I'm just stumped on why I can't set the view to be under the status bar for iOS7. I have read every single Stack Overflow post on the subject, as well as Apple's transition/guides. Once again, to reiterate, I fully understand how it should function and what the expected solution should be to this, but none of that seems to be working for this particular project.
I am an experienced iOS dev, but this project was built by another team, so I don't know if there's something hidden somewhere in the XIB files, plist, or code that could be trumping the above settings. Please let me know if there is something else that can be looked at on this, or more information I can provide.
Thanks in advance!
If you set the iOS 6/7 delta values in Interface Builder, remember to set "View as" to "iOS 6" on the Interface Builder Document, since it is the iOS 6 layout you want to replicate. The deltas will then be used only on iOS 7 to push the content below the status bar. If you leave "View as" set to iOS 7 (the default) the deltas will instead give you the iOS 7 look on iOS 6.
However, the deltas will not help you if you reposition or resize views programmatically based on the view frame, since the frame does not account for the deltas.
Instead of using the deltas, the best solution I have found is to enable Auto Layout on your main XIB and then set the top space constraint on your top/content view to follow the Top Layout Guide. This guide was introduced in iOS 7 and represents the position below the status bar. Unfortunately the guide is not available in Interface Builder when not using Storyboards, but you can add it programmatically.
What I did was add a top space constraint to the superview instead in Interface Builder, and created an outlet for this in the code. Then, in viewDidLoad, if the topLayoutGuide is available (iOS 7+), replace the constraint in this outlet with a version using the Top Layout Guide instead.
if ([self respondsToSelector:#selector(topLayoutGuide)]) {
[self.view removeConstraint:self.containerTopSpaceConstraint];
self.containerTopSpaceConstraint =
[NSLayoutConstraint constraintWithItem:self.contentView
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.topLayoutGuide
attribute:NSLayoutAttributeBottom
multiplier:1
constant:0];
[self.view addConstraint:self.containerTopSpaceConstraint];
[self.view setNeedsUpdateConstraints];
[self.view layoutIfNeeded];
}
For reference, the solution below did work when I applied it to my ViewControllers. However, it's not ideal and a bit hacky. If it's the only approach I can take, then so be it, though.
float systemVersion=[[[UIDevice currentDevice] systemVersion] floatValue];
if(systemVersion>=7.0f)
{
CGRect tempRect;
for(UIView *sub in [[self view] subviews])
{
tempRect = [sub frame];
tempRect.origin.y += 20.0f; //Height of status bar
[sub setFrame:tempRect];
}
}
Apple are pushing you to use autolayout to accomplish this. You need to set a constraint to the "Top Layout Guide" from the top subview in your view.
See this document for examples:
https://developer.apple.com/library/ios/qa/qa1797/_index.html
To do this without XIBs, you'll need to add the constraint programatically. Apple's docs give a good example of this, which I've summarised below.
Giving that the topLayoutGuide is a property on a view controller, you just use it in your dictionary of variable bindings. Then you set up your constraint like normal:
id topGuide = [myViewController topLayoutGuide];
NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(button, topGuide);
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"V:[topGuide]-20-[button]" options:0 metrics:nil views:viewsDictionary];
The documentation for this can be found in the UIViewController class reference.
1)The simplest solution if you don't mind having an opaque navigation bar:
self.navigationController.navigationBar.translucent = NO;
2) svguerin3's answer can't work in the general case. For example, if one of your subviews uses autosizing to be hooked at the bottom of its container, then its new position will be wrong. And it could go out of screen in the worst case.
- (void)viewDidAppear:(BOOL)animated {
[self.view setFrame:CGRectMake(0, 20, self.view.frame.size.width, self.view.frame.size.height)];
// OR
self.view.transform = CGAffineTransformMakeTranslation(0, 20);
}
Have you tried viewing your XIBs as source and removing any line containing edgesforextendedlayout ??
We had to remove this line in our storyboard's scenes since our storyboard's scenes' main views are represented by XIBs
What was happening for us was that somehow, in some scenes, the XIB content for the scene's main view was being pushed down by the height of the status bar and the navigation bar.
Removing that line allowed the XIBs to be displayed as if their top originated at the same top of its storyboard's scene.
Sadly, we have no idea what triggered this, but I saw it happen when changing the order of the contents within the XIB's main view so that a UITextView appeared first. Rearranging the order of items after this was triggered had no effect in removing this unwanted behaviour.
Hope this helps anyone else running into this type of problem.
If you are using the storyboard, after setting the top layout of your view, you can uncheck the "Under Opaque Bars" in the Attributes Inspector
I have defined a UIView in the header file named rectangle0
I got a question in regards to IB vs coding a view. Please see the following code example:
rectangle0.frame = CGRectMake(0.0, 70.0, 320.0, 190.0);
Now I can re-create the look of the view easy enough in IB except for the coordinates which are greyed out.
So by calling this code in an IBAction after designing the UIView in IB I can display in the app.
[self.view addSubview:rectangle0];
Now the last line of code will call this view to appear at the set coordinates if I code it - but if I build in interface builder I can make it look exactly the same, but it appears from Y coordinate 20 (just under the status bar) and I can't set the coordinate upon calling it - is there a way to do this??
The UIView is being build outside of the ViewController and then linked to it in the connections inspector.
cheers Jeff
I have added an image to show what screen I am using - as you can see the x and y coordinates are greyed out, it would be great if I can set those to something else.
A view inside the NIB is just an object like any other. It is made to be reusable and I believe that is the key point that resulted in the coordinates being greyed out.
Greying out the position makes the developer worry about where is the view going to be placed. I say that because the position is pretty dependent on the container that your view object is going to be added to.
Although it is just my personal opinion and I am looking forward to hearing if there is indeed a way to do that.
You (effectively) said the view is managed by a view controller. Before you can resize the view, you need to change the Size setting in the view controller's Simulated Metrics to "Freeform". (It is probably set to "None" by default.)
In my application I need show some info popup. This is just a text message above an image. When I create UIView for my popup in IB, it's size is non-ediatable (and equals to 320x460).
But my popup is not full-screen size.
Of course, I can create this popup programmatically, but I'd prefer data-driven approach.
So, the question is: how do I create custom-size UIView in IB?
If you set status bar of the view to none then you should be able to resize the view.
When a view is at the root level in an interface builder document it will always appear to be 320x460 but the size isn't actually set. Interface builder is just simulating what it will look like when it's actually loaded.
If this Popup view is actually supposed to appear in another existing view then drag it inside that view in IB. Once it's no longer at the root level you will be able to set its size.
I have two viewControllers, one is a subclass of UIViewController (autoresizes correctly), the other one is a subclass of a subclass of UIViewController.
I did a layout in Interface Builder, I tested my code in the Simulator and everything works as expected. But if I rotate the device my views don't resize.
So I went back to Interface Builder and found out that I cannot change the Resizing property of the "root"-UIView. So I opened another file and the resizing property is fixed there, too. But it is set to resizing in both direction. This is the behavior I want.
How can I change the autoresizing of the top UIView so it does what I want?
There are not so many subviews that it is impossible to start again from scratch, but I don't want to do this.
I ran into this before and it was incredibly frustrating. It turns out that when you have Simulated User Interface Elements turned on then you can't change the struts and springs like you want.
Go to Attributes tab (Cmd-1) and make sure that Status Bar, Top Bar, Bottom Bar, and Split View are all set to "Unspecified." Then go back to the Size tab (Cmd-3) and you'll be able to click the lines and changes your Struts and Springs. Then finally you can go back to Cmd-1 and turn those simulated elements back on.
I have a simplified answer:
Goto IB
Click on the 'ViewController'
Goto 'Attributes Inspector'
Change 'Size' to 'Freeform' (something other than 'Inferred')
What you have is this:
Change 'size' to 'freeform' & try now!
Now, it works! Go back & change it to 'Inferred' after you have set the Autoresizing masks.
Open Main.storyboard as source (do not forget, it is just an XML file) and replace "autoresizingMask" tag in the View with the following line:
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
Running through an iPhone SDK book and one of the examples has me creating a table and then later adding a UISegmentedControl to the table for sorting.
I dutifully did this in IB, and it looks great:
IB Screenshot http://img.skitch.com/20100529-83sefni21q4nj51rw1mghh2yj1.jpg
When I run it in the simulator or my phone, it's totally squished:
Squished http://img.skitch.com/20100529-x3pmr7gkb6xpm766bupi7quy55.jpg
The buttons work perfectly, it's just they are not sizing according to their content. Any ideas what's going wrong?
Here's the attributes I have set:
Attributes http://img.skitch.com/20100529-tp4d69bk8x98c6sjpmcne92etb.jpg
You could try explicitly setting the width of each of the segmented control's components. Click the Size tab at the top of the inspector and set the width for each component.
I experienced the same issue once. The problem was that the UINavigationController's view was not the top-level view in the hierarchy (it was not added to UIWindow directly), but it was added as a subview to another view controller's view instead. It's just a guess, maybe that's your problem, too (or that there are more than one visible view controllers).
OK, so in attempting to implement #Chris Gummer's answer, I seem to have learned more about how the Size->View Size property panel works. The default is:
Default Sizing http://img.skitch.com/20100529-gg9dwq5em3557yb1d6d721hpn4.jpg
and this is not a good default, it would seem. My book didn't mention needing to adjust this, so I didn't look at it. Setting the inner horizontal arrow of the box (which I guess means "fit width to available space") did the trick:
The Answer http://img.skitch.com/20100529-xt1bqghb4kbm2pbcqf1i1uygab.jpg