CODEWITHSUNDEEP
iosobjective-cuiviewuikit
its me
its me

Reputation: 241

Auto Layout - programatically defining unusual constraints

I'm trying to find examples for some relatively nonstandard layouts, but all the documentation I found only gave examples of centring or aligning with the superview borders, or giving fixed numbers as spaces and sizes. Can you please advise about programatically defining the following constraints:

A. Diagonal views:

enter image description here

B. Put a view on the third of it's superview's border (or some other ratio which is not the middle)

enter image description here

C. Two standard spaces from the superview's border (like this |-[v1], but with double space)

Any documentation that discusses similar cases would be also highly appreciated :)

Thanks in advance!

Upvotes: 0

Views: 248

Answers (1)

DrummerB
DrummerB

Reputation: 40221

You can use the verbose NSLayoutContraint method to create any constraint, that can't be expressed with the visual format language.

A: You need two constraint that describe exactly what you want. In this case you want the top edge of v1 and the bottom edge of v2 be the same. Similarly for the right and left edges.

NSLayoutConstraint *constraint;
constraint = [NSLayoutConstraint constraintWithItem:v1
                                          attribute:NSLayoutAttributeTop
                                          relatedBy:NSLayoutRelationEqual
                                             toItem:v2
                                          attribute:NSLayoutAttributeBottom
                                         multiplier:1.0
                                           constant:0.0];
[self.view addConstraint:constraint];

constraint = [NSLayoutConstraint constraintWithItem:v1
                                          attribute:NSLayoutAttributeRight
                                          relatedBy:NSLayoutRelationEqual
                                             toItem:v2
                                          attribute:NSLayoutAttributeLeft
                                         multiplier:1.0
                                           constant:0.0];
[self.view addConstraint:constraint];

B: This time you want to top edge of v1 and v2 to be the same:

NSLayoutConstraint *constraint;
constraint = [NSLayoutConstraint constraintWithItem:v2
                                          attribute:NSLayoutAttributeTop
                                          relatedBy:NSLayoutRelationEqual
                                             toItem:v1
                                          attribute:NSLayoutAttributeTop
                                         multiplier:1.0
                                           constant:0.0];
[self.view addConstraint:constraint];

What constraint to use for the horizontal position of the orange view, depends on what you want. Do you want a fixed margin to the right edge of the blue view? 

constraint = [NSLayoutConstraint constraintWithItem:v2
                                          attribute:NSLayoutAttributeLeft
                                          relatedBy:NSLayoutRelationEqual
                                             toItem:v1
                                          attribute:NSLayoutAttributeLeft
                                         multiplier:1.0
                                           constant:rightMargin];
[self.view addConstraint:constraint];

C: I don't think you can specify a double space like that. You could either use an ugly trick, and insert an invisible (width 0) view between the standard spaces like this:

|-[invisibleView(0)-[v1]

Or you could just figure out what the standard margin is, and use twice that value as a constant:

|-(doubleMargin)-[v1]

Upvotes: 1

Related Questions