How would I implement the following constraints in storyboard programmatically?
Asked
Active
Viewed 462 times
0
-
[here check this](http://stackoverflow.com/questions/15893022/setting-constraints-programatically) and [**this**](http://stackoverflow.com/questions/12826878/creating-layout-constraints-programmatically) – Omer Obaid Feb 26 '14 at 14:11
-
This library look shandy https://github.com/iMartinKiss/KeepLayout – Mike Pollard Feb 26 '14 at 14:35
1 Answers
0
There are many different ways to do this.
Probably the easiest way is to use Visual Format Language https://developer.apple.com/library/ios/documentation/userexperience/conceptual/AutolayoutPG/VisualFormatLanguage/VisualFormatLanguage.html
Using this you can "draw" the layout using text and it will apply constraints.
Something like this...
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-[tableView]-|"
options:0
metrics:nil
views:NSDictionaryOfVariableBindings(tableView)]];
There are many different things you can do with VFL.
Your best bet is to take a look at the docs or buy a book. (I'd recommend Ray Wenderlich's iOS7 by Tutorials). I'm not associated with him but I bought the book and learnt AutoLayout from there.

Fogmeister
- 76,236
- 42
- 207
- 306
-
Or check out their website: http://www.raywenderlich.com/20881/beginning-auto-layout-part-1-of-2 – GeneralMike Feb 26 '14 at 14:23
-
True, although the site only shows how to lay out constraints using IB I think? – Fogmeister Feb 26 '14 at 14:44
-
I tried using the above code and I get the following error: `reason: 'Unable to parse constraint format: tableView is not a key in the views dictionary. |-[tableView]-| ` How do I add tableView to the views dictionary. tableView is implemented in storyboard btw. – Julia Feb 26 '14 at 14:47
-
@Fogmeister:Ah, you appear to be correct. I thought for sure I found a tutorial from them on their site that I learned it from - perhaps it was a different group, or under a different title. I just found the link and pasted it - I'll make sure I review what I'm linking a little closer next time. – GeneralMike Feb 26 '14 at 15:01
-
@Julia: the string you use in `constraintsWithVisualFormat:` has to exactly match the string in `views:NSDictionaryOfVariableBindings`, and it needs to exactly match the actual name of your variable. So if you are using `myTableView` instead of `tableView`, then you would have `[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-[myTableView]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(myTableView)]];` Does that make sense? I don't know if I explained that very well. – GeneralMike Feb 26 '14 at 15:04
-
1@Julia: Ah, that's a trickier one - you actually have to use the ivar for it in that case. I know I can't explain ivars vs local variables very well, espeically not in 500 chars, so I'll just give you the tl;dr: use `_tableView` as your variable name (so the whole thing will be `[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-[_tableView]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_tableView)]];`). – GeneralMike Feb 26 '14 at 15:09
-
That works. I'm wondering if that line does what I want it to do (as outlined in the screenshot). – Julia Feb 26 '14 at 15:13
-
1@GeneralMike thanks for clearing it up :D Yes, use _tableView in this case. RE the screen shot, it doesn't really show anything. This is where reading and learning come into play. Take the information I've provided along with tutorials and books and you'll be able to make them yourself. "Teach a man to fish..." and all that. My one like will set up horizontal constraints only. (You'll need vertical ones too). Also, it sets up constraints using the standard gap to the superview on the left and right edges. – Fogmeister Feb 26 '14 at 15:16
-
-
You should use... @"|[_tableView]|" that will set a gap of 0 between the tableview and the superview. Again, you can read all this in the documentation that I linked in my answer. – Fogmeister Feb 26 '14 at 15:57