CODEWITHSUNDEEP
iosautolayoutios-autolayout
petekp
petekp

Reputation: 61

How do you define the vertical and horizontal relationship between views using the Masonry DSL for Auto Layout?

With Apple's Visual Format Language, it's pretty simple to set the horizontal and vertical relationships between views and their superview using spacers.

If I wanted view2 in the visual example below to have a fixed width, while view1 will fill the remaining space. With VFL I would specify this behavior as follows:

|-[view1]-[view2(==100)-|

visual example of layout I want to achieve with Masonry

With Masonry, it's not as clear how to establish these relationships between views; view1 is not 'aware' of view2 and will either undershoot or overlap it. What am I missing?

Upvotes: 1

Views: 336

Answers (1)

Ben Packard
Ben Packard

Reputation: 26506

Views are still 'aware' of each other. The key is to pin the left edge of view2 to the right edge of view1:

[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.bottom.left.equalTo(containerView);
        }];

[view2 mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.bottom.equalTo(containerView);
            make.left.equalTo(view1.mas_right);
            make.right.equalTo(containerView);
            make.width.equalTo(@100);
        }];

Upvotes: 1

Related Questions