以编程方式自动布局垂直ios时出错
Posted
技术标签:
【中文标题】以编程方式自动布局垂直ios时出错【英文标题】：Error in programmatically Auto-layout vertically ios 【发布时间】：2014-02-21 07:01:52 【问题描述】：我正在以编程方式创建视图，其中有两个子视图，我为此设置了高度和宽度约束， 我想要的是这样的，
UIView (variable height)
[10px gap]
UIView (fix height 40)
但我得到了：
我的代码是：
- (void)viewDidLoad
[super viewDidLoad];
UIView *button1, *button2 ;
button1=[UIView new];
button2=[UIView new];
button1.backgroundColor=[UIColor redColor];
button2.backgroundColor=[UIColor yellowColor];
button1.translatesAutoresizingMaskIntoConstraints=button2.translatesAutoresizingMaskIntoConstraints=NO;
[self.view addSubview:button1];
[self.view addSubview:button2];
NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(button1,button2);
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button1]-|"
options:0
metrics:nil
views:viewsDictionary];
[self.view addConstraints:constraints];
constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[button1]-10-[button2]-|"
options: NSLayoutFormatAlignAllLeft
metrics:nil
views:viewsDictionary];
[self.view addConstraints:constraints];
编辑 第二次尝试
- (void)viewDidLoad
[super viewDidLoad];
UIView *button1, *button2 ;
button1=[UIView new];
button2=[UIView new];
button1.backgroundColor=[UIColor redColor];
button2.backgroundColor=[UIColor yellowColor];
button1.translatesAutoresizingMaskIntoConstraints=button2.translatesAutoresizingMaskIntoConstraints=NO;
[self.view addSubview:button1];
[self.view addSubview:button2];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeLeft
multiplier:1.0
constant:25.0]];
// [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
// attribute:NSLayoutAttributeWidth
// relatedBy:NSLayoutRelationEqual
// toItem:nil
// attribute:NSLayoutAttributeNotAnAttribute
// multiplier:1.0
// constant:100]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeRight
multiplier:1.0
constant:-25.0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:30]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button1
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:button2
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:-30.0]];
//// Yellow
/// Left
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeLeft
multiplier:1.0
constant:25.0]];
//Right
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeRight
multiplier:1.0
constant:-50.0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:button1
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:30]];
// [self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
// attribute:NSLayoutAttributeBottom
// relatedBy:NSLayoutRelationEqual
// toItem:self.view
// attribute:NSLayoutAttributeBottom
// multiplier:1.0
// constant:-30.0]];
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:button2
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:nil
attribute:NSLayoutAttributeNotAnAttribute
multiplier:1.0
constant:100]];
我得到了：
【问题讨论】：
【参考方案1】：常规视图没有任何固有大小，并且您没有向系统提示视图应该有多大，因此按钮 1 首先布局，至少留出 10 个点，然后视图 2 结束高 0 点，宽 0 点。
要更正此问题，请确保为两个视图都设置了一些水平规则，而不仅仅是其中一个视图。其次，确保你给系统一些关于高度的想法。如果您希望视图大小相等，则需要告诉系统。为按钮 2 添加另一个水平约束：
constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button2]-|" options:0 metrics:0 views:viewsDictionary];
[[self view] addConstraints:constraints];
然后为视图添加一个高度约束，在这种情况下，通过添加(==button1) 大小信息来调整您的垂直约束以使视图等高：
constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[button1]-10-[button2(==button1)]-|"
options:0
metrics:nil
views:viewsDictionary];
现在您应该看到两个视图，顶部为红色，底部为黄色，它们占据了相等的垂直空间，它们之间有 10p 的空间，并在容器视图的每一侧延伸到 20 个点。
要手动创建这些相同的约束（我不建议这样做），您可以执行以下操作：
UIView* view = [self view]; // for brevity
NSMutableArray* manualConstraints = [NSMutableArray array];
NSLayoutConstraint* b1_top = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTop multiplier:1 constant:20];
[manualConstraints addObject:b1_top];
NSLayoutConstraint* b1_left = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeLeading multiplier:1 constant:20];
[manualConstraints addObject:b1_left];
NSLayoutConstraint* b1_right = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTrailing multiplier:1 constant:-20];
[manualConstraints addObject:b1_right];
NSLayoutConstraint* b1_bottom = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:button2 attribute:NSLayoutAttributeTop multiplier:1 constant:-10];
[manualConstraints addObject:b1_bottom];
NSLayoutConstraint* b2_left = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeLeading multiplier:1 constant:20];
[manualConstraints addObject:b2_left];
NSLayoutConstraint* b2_right = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeTrailing multiplier:1 constant:-20];
[manualConstraints addObject:b2_right];
NSLayoutConstraint* b2_bottom = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeBottom multiplier:1 constant:-20];
[manualConstraints addObject:b2_bottom];
NSLayoutConstraint* b2_height = [NSLayoutConstraint constraintWithItem:button2 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:40];
[manualConstraints addObject:b2_height];
// Add all constraints
[view addConstraints:manualConstraints];
【讨论】：
感谢您的回答，如果我想修复第二个视图比我应该在第二个约束中更改什么？ 好的，我已经设置了[button2(40)]。谢谢
我尝试了另一个使用不同的约束，你能告诉我我错过了什么吗？我会更新问题。
@Optimistic 新问题是什么？你应该写一个新问题，而不仅仅是把这个问题改成不同的问题。
：我更新了问题，你只是在你的答案中编辑，如果我在另一个问题中问它会不好，所以如果你在我的第二次尝试中编辑你的答案会很棒。再次感谢。以上是关于以编程方式自动布局垂直ios时出错的主要内容，如果未能解决你的问题，请参考以下文章