如何定义布局约束以使一个标签保持其内容的宽度并允许另一个标签填充剩余空间?

时间:2013-09-26 20:35:18

标签: ios autolayout nslayoutconstraint

考虑以下所需的布局。请注意,这不是“布局字符串”,而是图片的代理。所以| = superview边缘, - =空间,[xxx] =视图。

| - [label1的] - [LABEL2 --------------] - [按钮] - |

上面的布局是我想要实现的。用英语:

  • label1大小适合内容并从superview的边缘填充
  • label2label1的边缘填充,并根据可用的水平空间展开/收缩
  • button的大小适合内容,并从label2的边缘和超级视图的右边缘填充

我希望这很清楚。我当前的约束定义为:

[NSLayoutConstraint
 constraintsWithVisualFormat:@"H:|-8-[label1]-4-[label2]-4-[button]-8-|"
 options:0
 metrics:nil
 views:views];

这导致以下布局:

| - [label1的----------------------] - [LABEL2] - [按钮] - |

问题:如何修改约束,以便label2按比例调整大小,labelbutton的大小适合内容?

- 编辑 -

如果有帮助,这里是创建上述样本生成的约束的等效代码。

NSLayoutConstraint *c1 = [NSLayoutConstraint
                          constraintWithItem:self.label1
                          attribute:NSLayoutAttributeLeading
                          relatedBy:NSLayoutRelationEqual
                          toItem:self
                          attribute:NSLayoutAttributeLeading
                          multiplier:1.0f
                          constant:8.0f];

NSLayoutConstraint *c2 = [NSLayoutConstraint
                          constraintWithItem:self.label2
                          attribute:NSLayoutAttributeLeading
                          relatedBy:NSLayoutRelationEqual
                          toItem:self.label1
                          attribute:NSLayoutAttributeTrailing
                          multiplier:1.0f
                          constant:4.0f];

NSLayoutConstraint *c3 = [NSLayoutConstraint
                          constraintWithItem:self.button
                          attribute:NSLayoutAttributeLeading
                          relatedBy:NSLayoutRelationEqual
                          toItem:self.label2
                          attribute:NSLayoutAttributeTrailing
                          multiplier:1.0f
                          constant:4.0f];

NSLayoutConstraint *c4 = [NSLayoutConstraint
                          constraintWithItem:self
                          attribute:NSLayoutAttributeTrailing
                          relatedBy:NSLayoutRelationEqual
                          toItem:self.button
                          attribute:NSLayoutAttributeTrailing
                          multiplier:1.0f
                          constant:8.0f];

2 个答案:

答案 0 :(得分:5)

@ ilya的答案是部分解决方案。它确实使label1不会扩展,但label2仍然可以扩展到我想要button所在的区域,并且可以压缩`按钮。经过一些试验和错误并阅读所有文档后,我找到了一个更好,更合适的解决方案。很有趣,学习汽车布局。

不是指定label1的最小宽度,这有点人为,并且还会根据视图内容留下其他问题,更好的解决方案是设置contentCompressionResistancePrioritycontentHuggingPriority所有观点。

只要我还添加以下内容,我的问题中显示的约束也能正常工作:

    [self.label1
     setContentCompressionResistancePriority:UILayoutPriorityDefaultHigh
     forAxis:UILayoutConstraintAxisHorizontal];
    [self.label1
     setContentHuggingPriority:UILayoutPriorityDefaultLow
     forAxis:UILayoutConstraintAxisHorizontal];
    [self.label2
     setContentCompressionResistancePriority:UILayoutPriorityDefaultLow
     forAxis:UILayoutConstraintAxisHorizontal];
    [self.label2
     setContentHuggingPriority:UILayoutPriorityDefaultHigh
     forAxis:UILayoutConstraintAxisHorizontal];
    [self.button
     setContentCompressionResistancePriority:UILayoutPriorityDefaultHigh
     forAxis:UILayoutConstraintAxisHorizontal];
    [self.button
     setContentHuggingPriority:UILayoutPriorityDefaultLow
     forAxis:UILayoutConstraintAxisHorizontal];

答案 1 :(得分:1)

只需为label1的宽度添加另一个约束以等于某个最小大小(例如,在添加宽度约束时,在界面构建器中,它将自动使用当前宽度),但将其优先级设置为更低。