Trouble with AutoLayout on UITableViewCell - ios

I'm having trouble with autolayout on an xcode 5 project. I am using a plain view controller inside with a navigation controller. I have a MKMapView on the top half and a UITableView on the bottom half. I am using storyboards, and have configured the prototype UITableViewCell, but I am adding the constraints through code. I have double-checked every control in the prototype and don't see any constraints configured there. My problem occurs when I add the constraints for the UITableViewCell. I have the following code in the cells:
-(void)updateConstraints {
[super updateConstraints];
//first remove old constraints
[self removeConstraints:self.constraints];
[self.nameLabel removeConstraints:self.nameLabel.constraints];
[self.addressLabel removeConstraints:self.nameLabel.constraints];
[self.rentableSquareFeetLabel removeConstraints:self.rentableSquareFeetLabel.constraints];
[self.lastSaleAmountLabel removeConstraints:self.lastSaleAmountLabel.constraints];
[self.lastSaleDateLabel removeConstraints:self.lastSaleAmountLabel.constraints];
[self.thumbnailImageView removeConstraints:self.thumbnailImageView.constraints];
//then set up constraints
NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(_thumbnailImageView, _nameLabel, _rentableSquareFeetLabel, _lastSaleAmountLabel, _addressLabel, _lastSaleDateLabel);
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_thumbnailImageView(60)]-[_nameLabel(<=200)]-(>=8)-[_rentableSquareFeetLabel]-(>=8)-[_lastSaleAmountLabel]|" options:0 metrics:nil views:viewsDictionary]];
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[_nameLabel]-(-4)-[_addressLabel]" options:NSLayoutFormatAlignAllLeading metrics:nil views:viewsDictionary]];
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:[_lastSaleAmountLabel]-(-4)-[_lastSaleDateLabel]" options:NSLayoutFormatAlignAllLeading metrics:nil views:viewsDictionary]];
}
I am getting the following in the debugging console. The exception is triggered by the first addConstraints line. If I just continue through those then eventually everything shows up as it should be, as it looks like xcode is choosing to break the correct constraint:
2013-09-25 15:07:14.169 PECProperties[32381:a0b] Unable to simultaneously satisfy constraints. Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints) (
"<NSIBPrototypingLayoutConstraint:0x9d56c70 'IB auto generated at build time for view with fixed frame' H:|-(0)-[UIImageView:0x9d558f0](LTR) (Names: '|':UITableViewCellContentView:0x9d55620 )>",
"<NSIBPrototypingLayoutConstraint:0x9d56d20 'IB auto generated at build time for view with fixed frame' H:[UIImageView:0x9d558f0(60)]>",
"<NSIBPrototypingLayoutConstraint:0x9d56d80 'IB auto generated at build time for view with fixed frame' H:|-(78)-[UILabel:0x9d559e0](LTR) (Names: '|':UITableViewCellContentView:0x9d55620 )>",
"<NSLayoutConstraint:0x9d53830 H:[UIImageView:0x9d558f0]-(NSSpace(8))-[UILabel:0x9d559e0]>" )
Will attempt to recover by breaking constraint <NSIBPrototypingLayoutConstraint:0x9d56d80 'IB auto generated at build time for view with fixed frame' H:|-(78)-[UILabel:0x9d559e0](LTR) (Names: '|':UITableViewCellContentView:0x9d55620 )>
Break on objc_exception_throw to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful.
The third NSIBPrototypingLayoutConstraint shows 78 points between the edge of the view and a label. That is where the prototype is positioned roughly (and if I move it in the prototype, I see the change in the constraint in the debugging console), but that conflicts with my own constraint of "standard" distance between the image view and the label.
I have tried setting the translatesAutoresizingMaskIntoConstraints=NO in the view controller's cellForRowAtIndexPath, but that doesn't seem to be helping either. How can I fix the layout?

A few things to cover here:
The NSIBPrototypingLayoutConstraint constraints that you're running into (and that are causing exceptions) are auto-generated by Interface Builder in order to make your Storyboard or XIB view layout non-ambiguous. It's pretty sneaky about doing this, but it's automatically adding the minimum constraints required so that the position and size of each ambiguous view becomes fully specified. This is a change from Xcode 4, because in Xcode 4 you could not have ambiguous layouts in Interface Builder. With Xcode 5 and later you can, however IB will auto-generate these constraints for you if your layout is ambiguous at compile time.
The way to fix this issue is to add the minimum required constraints in Interface Builder so that each view's position & size is fully specified, then select each of these unwanted constraints, go to the right sidebar Attributes inspector, and check the box next to Placeholder - Remove at build time.
Not only does this checkbox remove the constraint you added, but most importantly it will prevent the auto-generated IB constraint from taking its place! (As you can imagine, this is quite tedious when you have a number of views in IB and want to manage all your constraints in code. For this reason you may want to avoid using IB entirely for view hierarchies in which you intend to implement Auto Layout programmatically.)
What is the difference between a Placeholder constraint and an Uninstalled constraint? Here's a slide from my Adaptive Auto Layout talk (video) (PDF slides) comparing the two:
In updateConstraints, you don't want to remove constraints and re-add them like you have there. Why not? Essentially, it's terrible for performance, and I have confirmed with Apple engineers that this is not a good idea. See the question/answer I have posted here for some more details, as well as this answer. In order to prevent constraints being added more than once, use a boolean flag (e.g. hasSetupConstraints) that you set to YES once you have set up your constraints the first time, and if updateConstraints is called again you can just return immediately if you have no new constraints to add. See this question for further discussion.
The code you're using to remove constraints may not work completely. This is because [view removeConstraints:view.constraints] will only remove constraints that have been added to view -- remember that constraints can be added to any common superview of the views they constrain -- and the constraints added to view may not be the only ones affecting the layout of view! If you need to remove a number of constraints, you should store a reference to each of those constraints in a property (e.g. an NSArray property containing NSLayoutConstraint instances), and then deactivate/remove those constraints using the API on NSLayoutConstraint or the PureLayout open-source library. You should only deactivate/remove as few constraints as possible because it is computationally expensive to do so. On the other hand, changing the constant of any constraint is very efficient and encouraged, and you don't need to remove or re-add the constraint to do that.

Related

UIScrollView constraints problems [duplicate]

I have a scroll view and an image view behind it and I am populating it with nibs. I am using autolayout. I have a bottom space to superview and a top space to superview on both of the views. The image view does exactly what I want it to do. For iphone 5 it is where I want it. And for the other iphones, it stays above the bottom of the screen, so it resizes correctly. The scroll view looks right on the iphone 5, but on the other phones it doesn't get resized, so it scrolls down below the view of the app. I get these messages in the log:
2012-11-21 10:42:38.576 LCHApp[12604:907] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want.
Try this: (1) look at each constraint and try to figure out which you don't expect;
(2) find the code that added the unwanted constraint or constraints and fix it.
(Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer
to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
"<NSLayoutConstraint:0x1d8ea080 UIScrollView:0x1d8413b0.bottom == UIImageView:0x1d892110.bottom>",
"<NSAutoresizingMaskLayoutConstraint:0x1d8cca10 h=-&- v=-&- ScheduleViewNib:0x1d853630.height == UIScrollView:0x1d8413b0.height - 386>",
"<NSLayoutConstraint:0x1d8e5340 V:[UIImageView:0x1d892110]-(64)-| (Names: '|':ScheduleView:0x1d8efc30 )>",
"<NSAutoresizingMaskLayoutConstraint:0x1d8cf520 h=--& v=--& V:[ScheduleView:0x1d8efc30(480)]>",
"<NSLayoutConstraint:0x1d8eaed0 V:|-(45)-[UIScrollView:0x1d8413b0] (Names: '|':ScheduleView:0x1d8efc30 )>"
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x1d8ea080 UIScrollView:0x1d8413b0.bottom == UIImageView:0x1d892110.bottom>
I already tried
[self setTranslatesAutoresizingMaskIntoConstraints:YES];
and
[self.myScrollView setTranslatesAutoresizingMaskIntoConstraints:YES];
From what I can see this just takes off all constraints from the views. And isn't what I want.
The relationship between UIScrollView and auto layout is different from other aspects of auto layout. Basically, if simple auto layout were allowed to operate, nothing would scroll. For example, if a subview of the scroll view were pinned in the normal way by a constraint to 10 points from the top of the scroll view, it would be absolutely pinned there; it would never move, no matter how the scroll view were scrolled.
To solve this problem, a UIScrollView that uses autolayout operates in a completely new way. Therefore when you say "I am using autolayout" you must prepare for things to operate very differently from before. You must either use a single scroll view subview with translatesAutoresizingMaskIntoConstraints = YES, and an explicit content size, or else everything must have translatesAutoresizingMaskIntoConstraints = NO and the content size will be deduced implicitly based on the constraints of the subviews.
This is very well explained in https://developer.apple.com/library/content/releasenotes/General/RN-iOSSDK-6_0/index.html
Very important when using auto-layout: you must pin the right and/or bottom of the last subview to the right and/or bottom of the scroll view. This is how the scroll view knows the content size. For example:
[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:lastSubView
attribute:NSLayoutAttributeRight
relatedBy:NSLayoutRelationEqual
toItem:scrollView
attribute:NSLayoutAttributeRight
multiplier:1.0
constant:0]];
My thanks to this site for providing the perfect example.
I lost hours because of this, and I hope to spare others my pain.
To get UIScrollviews to work nicely with constraints, I use this approach answered here. In that answer, I tackle how to get a vertically scrolling scrollview working that also works with device rotation. You can tweak the approach to work with horizontally scrolling scrollviews too. For scrollviews that scroll in both directions, don't add the size matching width constraint trick. But do everything else the same.
A couple of things.
make sure autolayout is on (IB on the "File Inspector Tab")
Make sure you are NOT making any changes that involve bounds, frame, etc. - this is all done by Auto constraints now
Make sure you stay away from AutoResizingMask. This will compete with your new settings.
If these are done right, you can now layout your button and it will work great. Here's how.
This error is stating that either your nib or an a control within that nib is NOT using auto layout.

Contraints greyed-out in Xcode

I am trying to debug+understand autolayout constraints and I notice that when debugging the view with xcode (using the cool layer thing) I noticed that on one element in the view the constraints look like this
and the view is indeed ignoring these constraints.
All constraints have the same priority (1000) since I want them all. All constraints were made with interface builder and not through code, and there are not warning or conflicts in IB.
But in runtime I do see this
Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
(
"<NSLayoutConstraint:0x79684f10 V:[UIImageView:0x79686800(>=160)]>",
"<NSLayoutConstraint:0x7968a310 V:[UIImageView:0x79686800]-(130.5)-| (Names: '|':UIView:0x79686790 )>",
"<NSLayoutConstraint:0x7968a340 V:|-(0)-[UIImageView:0x79686800] (Names: '|':UIView:0x79686790 )>",
"<NSLayoutConstraint:0x796997b0 'UIView-Encapsulated-Layout-Height' V:[CoverCell:0x79686570(192)]>",
"<NSAutoresizingMaskLayoutConstraint:0x7969cd30 h=-&- v=-&- UIView:0x79686790.height == CoverCell:0x79686570.height>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x79684f10 V:[UIImageView:0x79686800(>=160)]>
So from this I understand that some rules conflict, but I'm not sure how to read this
the >=160 is a rule on the UIImageView so it would have height of atleast 160 and 130.5 is the bottom padding of the imageview (so when using systemLayoutSizeFittingSize:UILayoutFittingCompressedSize the height won't be 0. So the minimum height for the entire cell is 160+130.5)
The rest of the error I don't understand.
What is wrong with the constraints and why do constraint conflicts occur in runtime and not in IB?
XCode 6 now supports different layouts. This greyed out constraints exist in Compact Width | Any Height layout, for example, but you currently editing Any Width | Any Height.
More detailed:
Storyboard View Elements Greyed Out
It depends. If you don't use size classes the grey ones are the removed ones. And you need to remove them second time. No matter how stupid it sounds.
If you use size classes, it means that your current size class is different than for greyed constraint. (however the first scenario is also possible...)
In your case it looks like this is the first case. You need to remove greyed constraints once again.

What is the correct way to use UIScrollView?

I tried to setup a simple view which displays a text-only article with a headline. Here are the steps that I've done:
Create View Controller with its .xib file,
Create UIScrollView and places a UIView directly as the content wrapper,
Set the constraints [scrollview]-0-[superview] in top, bottom, leading, and trailing.
Set the constraints [content wrapper]-0-[scroll view] in top, bottom, leading, and trailing.
Set Width and Height to content wrapper as placeholder.
Add Label and UITextView as content wrapper's subviews.
Add constraints to the subviews.
Following this tutorial, I programmatically set content wrapper's leading = scrollview's superview left,
... And content wrapper's trailing = scrollview's superview right.
When I ran the code, it shows everything in place perfectly; The UIScrollView scrolls, margins are properly set, etc.
However, Xcode throws an exception:
2015-02-05 18:06:58.230 ScrollViewApp[5353:180401] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
(
"<NSLayoutConstraint:0x7ff9fa49a3f0 H:[UIView:0x7ff9fa571560(600)]>",
"<NSLayoutConstraint:0x7ff9fa49b1a0 H:|-(0)-[UIView:0x7ff9fa571560] (Names: '|':UIScrollView:0x7ff9fa49a910 )>",
"<NSLayoutConstraint:0x7ff9fa49ce00 H:|-(0)-[UIScrollView:0x7ff9fa49a910] (Names: '|':UIView:0x7ff9fa49a840 )>",
"<NSLayoutConstraint:0x7ff9fa61c050 UIView:0x7ff9fa571560.right == UIView:0x7ff9fa49a840.trailing>",
"<NSLayoutConstraint:0x7ff9fa580970 'UIView-Encapsulated-Layout-Width' H:[UIView:0x7ff9fa49a840(375)]>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x7ff9fa49a3f0 H:[UIView:0x7ff9fa571560(600)]>
Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful.
After further googling, I found out that I can dismiss the warning by setting content wrapper's width (see step 5 above) priority to low; however it breaks the layout in interface builder. Take a look:
Compared to when it's set to High priority:
I know that in the end it makes no difference because it's both working as expected.. But I'm kind of curious as to why these things happen..
I'm trying to understand how UIScrollView works, but maybe I'm misunderstanding something; so, what is the proper way for setting up UIScrollView to work as expected?
Try to add a center horizontally constraint from your content wrapper to your scroll view.
To be honest, I really don't know why that works, i figured this one out by trial an error. If you want your view to be compatible different screen sizes, remove the width constraint of the content wrapper.
Hope it helped.
you can use scrollview like this. Add scrollview in design. Give it's left, top, right, bottom constraints in design. Add your subviews in scrollview. Add proper constraints for them. There is no need to add constraints in code. In viewDidLayoutSubviews set your scrollview's content size.
- (void)viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
CGRect boundsOfSelf = self.view.bounds;
scrollView.frame = boundsOfSelf;
[scrollView setContentSize: boundsOfSelf.size];
}

Auto layout constraints in code conflicting with sizes in XIB

I've set up a number of UILabels and UIButtons within 3 subviews in a storyboard. In code, I've defined auto layout constraints for all of these however for some reason when I run the app, the sizes that I have defined in the storyboard are conflicting with the constraints in code.
For example, one subview is positioned at 0,0 in the XIB with height 200 and width 320, simply for me to layout the elements before writing the code. There are no constraints in the storyboard.
This subview has a number of UILabels and UIButtons within it and their cumulative height is supposed to define the height of the subview. This should end up at 205pts height, however the log shows a conflict:
2014-06-02 16:45:38.506 discounter[11691:60b] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
(
"<NSIBPrototypingLayoutConstraint:0x109390160 'IB auto generated at build time for view with fixed frame' V:[UIView:0x109389010(200)]>",
"<NSLayoutConstraint:0x109249510 V:[UIView:0x109389010(205)]>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x109249510 V:[UIView:0x109389010(205)]>
I have set all my views to have translatesAutoresizingMaskIntoConstraints = NO so I'm at a loss as to why this is happening. It appears to be happening to a number of other elements too, but I have a feeling its probably the same reason why.
Can anyone help?
Thanks!
Add those constraints that you will replace in your code in your storyboard, and check their "remove at build time" properties. Like this:
Background:
This is a way for you to promise Xcode that you will add the constraint in code, and thus will prevent Xcode from auto generating the necessary constraints. The auto generation is necessary, as otherwise the runtime wouldn't be able to determine how to present the view in question. Generally, you should strive to define all your constraints in the storyboard. You could also IBOutlet a constraint to your code, and then edit its constant value when the app is ran, that way avoiding the tedious adding of constraints in your code.

UIScrollView with autolayout pure approach [duplicate]

I have a scroll view and an image view behind it and I am populating it with nibs. I am using autolayout. I have a bottom space to superview and a top space to superview on both of the views. The image view does exactly what I want it to do. For iphone 5 it is where I want it. And for the other iphones, it stays above the bottom of the screen, so it resizes correctly. The scroll view looks right on the iphone 5, but on the other phones it doesn't get resized, so it scrolls down below the view of the app. I get these messages in the log:
2012-11-21 10:42:38.576 LCHApp[12604:907] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want.
Try this: (1) look at each constraint and try to figure out which you don't expect;
(2) find the code that added the unwanted constraint or constraints and fix it.
(Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer
to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
"<NSLayoutConstraint:0x1d8ea080 UIScrollView:0x1d8413b0.bottom == UIImageView:0x1d892110.bottom>",
"<NSAutoresizingMaskLayoutConstraint:0x1d8cca10 h=-&- v=-&- ScheduleViewNib:0x1d853630.height == UIScrollView:0x1d8413b0.height - 386>",
"<NSLayoutConstraint:0x1d8e5340 V:[UIImageView:0x1d892110]-(64)-| (Names: '|':ScheduleView:0x1d8efc30 )>",
"<NSAutoresizingMaskLayoutConstraint:0x1d8cf520 h=--& v=--& V:[ScheduleView:0x1d8efc30(480)]>",
"<NSLayoutConstraint:0x1d8eaed0 V:|-(45)-[UIScrollView:0x1d8413b0] (Names: '|':ScheduleView:0x1d8efc30 )>"
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x1d8ea080 UIScrollView:0x1d8413b0.bottom == UIImageView:0x1d892110.bottom>
I already tried
[self setTranslatesAutoresizingMaskIntoConstraints:YES];
and
[self.myScrollView setTranslatesAutoresizingMaskIntoConstraints:YES];
From what I can see this just takes off all constraints from the views. And isn't what I want.
The relationship between UIScrollView and auto layout is different from other aspects of auto layout. Basically, if simple auto layout were allowed to operate, nothing would scroll. For example, if a subview of the scroll view were pinned in the normal way by a constraint to 10 points from the top of the scroll view, it would be absolutely pinned there; it would never move, no matter how the scroll view were scrolled.
To solve this problem, a UIScrollView that uses autolayout operates in a completely new way. Therefore when you say "I am using autolayout" you must prepare for things to operate very differently from before. You must either use a single scroll view subview with translatesAutoresizingMaskIntoConstraints = YES, and an explicit content size, or else everything must have translatesAutoresizingMaskIntoConstraints = NO and the content size will be deduced implicitly based on the constraints of the subviews.
This is very well explained in https://developer.apple.com/library/content/releasenotes/General/RN-iOSSDK-6_0/index.html
Very important when using auto-layout: you must pin the right and/or bottom of the last subview to the right and/or bottom of the scroll view. This is how the scroll view knows the content size. For example:
[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:lastSubView
attribute:NSLayoutAttributeRight
relatedBy:NSLayoutRelationEqual
toItem:scrollView
attribute:NSLayoutAttributeRight
multiplier:1.0
constant:0]];
My thanks to this site for providing the perfect example.
I lost hours because of this, and I hope to spare others my pain.
To get UIScrollviews to work nicely with constraints, I use this approach answered here. In that answer, I tackle how to get a vertically scrolling scrollview working that also works with device rotation. You can tweak the approach to work with horizontally scrolling scrollviews too. For scrollviews that scroll in both directions, don't add the size matching width constraint trick. But do everything else the same.
A couple of things.
make sure autolayout is on (IB on the "File Inspector Tab")
Make sure you are NOT making any changes that involve bounds, frame, etc. - this is all done by Auto constraints now
Make sure you stay away from AutoResizingMask. This will compete with your new settings.
If these are done right, you can now layout your button and it will work great. Here's how.
This error is stating that either your nib or an a control within that nib is NOT using auto layout.

Resources