iOS自动布局:适合超级视图宽度的相等空间

时间:2012-12-03 09:25:20

标签: ios cocoa-touch autolayout

  

可能重复:
  Autolayout Even Spacing

我正在尝试使用按钮创建一个可滚动条(类似于UISegmentedControl)。超级视图是UIScrollView。一旦按钮不适合滚动视图,滚动视图应该是可滚动的。到目前为止,几乎一切正常:

有很多按钮(向右滚动):

Scrolled View

没有那么多按钮:

View is not scrolling

现在,我的目标是,如果所有按钮都有空间,它们应该平均分布在整个320px视图中。 如何为按钮之间的空格定义约束?

现在,我正在使用以下约束(self是UIScrollView):

UIView *firstButton = self.buttons[0];

[self.buttonConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"|-(5)-[firstButton]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(firstButton)]];

UIView *lastButton = [self.buttons lastObject];

[self.buttonConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"[lastButton]-(5)-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(lastButton)]];

UIView *previousView = nil;

for (UIView *view in self.buttons) {
    if (previousView) {
        [self.buttonConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"[previousView]-(5)-[view]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(previousView, view)]];
    }
    previousView = view;
}

如果我将超级视图的类型从UIScrollView更改为UIView,我会得到以下结果,仍然不是我想要的,但至少它会查找最后一个按钮的约束将它绑定到右边缘(有意义的是,滚动视图不会发生这种情况,因为内容大小是自动设置的):

UIView as the superview

有什么想法吗?

1 个答案:

答案 0 :(得分:20)

- (void) viewWillLayoutSubviews {
    // UIButton *button1, *button2, *button3, *button 4 ;
    // NSMutableArray *constraintsForButtons ;

    float unusedHorizontalSpace = self.view.bounds.size.width - button1.intrinsicContentSize.width - button2.intrinsicContentSize.width - button3.intrinsicContentSize.width - button4.intrinsicContentSize.width ;
    NSNumber* spaceBetweenEachButton=  [NSNumber numberWithFloat: unusedHorizontalSpace / 5 ] ;

    [self.view removeConstraints:constraintsForButtons] ;
    [constraintsForButtons removeAllObjects] ;
    [constraintsForButtons addObjectsFromArray: [NSLayoutConstraint constraintsWithVisualFormat: @"H:|-(space)-[button1]-(space)-[button2]-(space)-[button3]-(space)-[button4]-(space)-|"
                                                                                        options: NSLayoutFormatAlignAllCenterY
                                                                                        metrics: @{@"space":spaceBetweenEachButton}
                                                                                          views: NSDictionaryOfVariableBindings(button1,button2,button3,button4) ] ] ;
    [constraintsForButtons addObjectsFromArray: [NSLayoutConstraint constraintsWithVisualFormat: @"V:|[button1]"
                                                                                        options: 0
                                                                                        metrics: nil
                                                                                          views: NSDictionaryOfVariableBindings(button1) ] ] ;
    [self.view addConstraints:constraintsForButtons] ;
}

这不像你的那么漂亮,它假设有4个按钮,但它同样地将它们隔开。也就是说,按钮之间的空白区域都具有相同的宽度。这并不意味着button1和button2的NSLayoutAttributeLeading之间的距离与button2和button2之间的距离相同。 BUTTON3的。

portrait landscape