以编程方式使用约束来布局多个视图

Question

如何使用objective-c中的约束以编程方式创建UIView的2 x 2网格？

例如，我有四个UIViews，其名称对应于它们的行/列位置（oneOne，oneTwo，twoOne，twoTwo），如下图所示。

这是我目前使用的代码：

-(void)buildGrid { 

    [self.view setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    UIView *oneOne = [UIView new]; 
    [oneOne setBackgroundColor:[UIColor redColor]]; 
    [oneOne setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    UIView *oneTwo = [UIView new]; 
    [oneTwo setBackgroundColor:[UIColor greenColor]]; 
    [oneTwo setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    UIView *twoOne = [UIView new]; 
    [twoOne setBackgroundColor:[UIColor blueColor]]; 
    [twoOne setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    UIView *twoTwo = [UIView new]; 
    [twoTwo setBackgroundColor:[UIColor purpleColor]]; 
    [twoTwo setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    [self.view addSubview:oneOne]; 
    [self.view addSubview:oneTwo]; 
    [self.view addSubview:twoOne]; 
    [self.view addSubview:twoTwo]; 

    NSDictionary *viewsDict = NSDictionaryOfVariableBindings(oneOne, oneTwo, twoOne, twoTwo); 



    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[oneOne]-10-[twoOne]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[oneOne]-10-[twoOne]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[oneTwo]-10-[twoTwo]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 


    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[twoOne]-10-[twoTwo]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 

} 

我跟了几个教程，但没有（到目前为止）已经描述了如何创建这样的“网格”布局，他们已经简单得多像UIViews单“列”，但是，当我有进一步的“列”我得到有关无法维持的约束错误：

Unable to simultaneously satisfy constraints. 
Probably at least one of the constraints in the following list is one you don't want. 

这段代码工作正常，如果我使它四个UIViews下来或跨屏幕，但不是如果我使它2×2。我做错了什么？

更新

按照接受的答案的约束应该是：你

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[oneOne]-10-[twoOne(==oneOne)]-10-|" 
                    options:0 
                    metrics:nil 
                    views:viewsDict]]; 

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-10-[oneTwo]-10-[twoTwo(==oneTwo)]-10-|" 
                    options:0 
                    metrics:nil 
                    views:viewsDict]]; 

    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[oneOne]-10-[oneTwo(==oneOne)]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 


    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[twoOne]-10-[twoTwo(==twoOne)]-10-|" 
                    options:0 
                    metrics:nil 
                    views:viewsDict]]; 

Answer 1

首先在第二约束错误。它应该是：

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[oneOne]-10-[oneTwo]-10-|" 
                    options:NSLayoutFormatDirectionLeadingToTrailing 
                    metrics:nil 
                    views:viewsDict]]; 

此外，您的布局仍不包含有关子视图大小（宽度和高度）的任何信息。您必须添加像这样的约束（伪代码）

oneOne.width = oneTwo.width = twoOne.width = twoTwo.width 
oneOne.height = oneTwo.height = twoOne.height = twoTwo.height