How can I pin more than two UIViews with Widths Equally using NSLayoutConstraints?
Right now, I'm using the following code and I can't pin more than two UIViews:
for (int i = 0; i < column.count; i++) {
NSString *horizontalFormat = @"H:|[view1][view2(==view1)]|";
NSDictionary *views;
if (i < column.count - 1) {
views = @{
@"view1": column[i],
@"view2": column[i + 1]
};
}else{
views = @{
@"view1": column[i - 1],
@"view2": column[i]
};
}
NSArray * horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:horizontalFormat
options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom
metrics:nil
views:views];
[self.contentView addConstraints:horizontalConstraints];
}
Any ideas?
Here's an example. All views are generated in the code, so just copy this code right into a UIViewController (e.g. into its viewDidLoad
) and run it:
UIView* v1 = [[UIView alloc] init];
v1.layer.borderWidth = 2;
v1.layer.borderColor = [UIColor redColor].CGColor;
v1.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:v1];
[NSLayoutConstraint activateConstraints:
@[[v1.topAnchor constraintEqualToAnchor:self.view.topAnchor constant:100],
[v1.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor],
[v1.heightAnchor constraintEqualToConstant:40],
]];
NSInteger n = 6; // change this number as desired
NSMutableArray* marr = [NSMutableArray new];
[marr addObject:v1];
for (NSInteger i = 1; i < n; i++) {
UIView* v = [[UIView alloc] init];
v.layer.borderWidth = 2;
v.layer.borderColor = [UIColor redColor].CGColor;
v.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:v];
[marr addObject:v];
}
for (NSInteger i = 1; i < n; i++) {
UIView* v = marr[i];
UIView* prev = marr[i-1];
[NSLayoutConstraint activateConstraints:
@[[v.topAnchor constraintEqualToAnchor:v1.topAnchor],
[v.bottomAnchor constraintEqualToAnchor:v1.bottomAnchor],
[v.leadingAnchor constraintEqualToAnchor:prev.trailingAnchor],
[v.widthAnchor constraintEqualToAnchor:v1.widthAnchor]
]];
}
UIView* v = marr[n-1];
[NSLayoutConstraint activateConstraints:
@[[v.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor]
]];
Each NSLayoutConstraint can only relate two views, but nothing is stopping you from adding additional constraints. E.g:
[NSLayoutConstraint constraintWithItem:column[i-1] attribute: NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:column[i] attribute:NSLayoutAttributeWidth multiplied:1.f constant:0.f];
[NSLayoutConstraint constraintWithItem:column[i+1] attribute: NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:column[i] attribute:NSLayoutAttributeWidth multiplied:1.f constant:0.f];
If you add these two constraints, the "columns" at i-1, i, and i+1 will now all have equal widths.