iphone - 使用自动布局更改约束

Question

我在 View 中有一个方形按钮网格，非常适合 iPhone 5。我现在希望它在 3.5 英寸屏幕上看起来也不错。我正在使用自动布局，并且为 3.5 英寸创建了新图像，它们的高度稍微小一些，以便它们适合屏幕(它们不再是正方形)。据我了解，您在使用自动布局时不能像往常一样使用框架吗？相反，您应该使用约束。但我该怎么做呢？

基本上我需要做的是改变按钮的 y 坐标和高度。

这是屏幕在 4 英寸屏幕(底部的标签栏)上的外观示例。

Answer 1

在 VFL 中表示这个，你想要的是这样的:

使垂直的红色框垂直大小均匀，跨越它们的父 View 的垂直跨度:

@"V:|-[subview1]-[subview2(==subview1)]-[subview3(==subview1)]-|"
@"V:|-[subview4]-[subview5(==subview4)]-[subview6(==subview4)]-|"

同样，使盒子水平大小均匀，也跨越它们父 View 的水平跨度:

@"H:|-[subview1]-[subview4(==subview1)]-|"
@"H:|-[subview2]-[subview5(==subview2)]-|"
@"H:|-[subview3]-[subview6(==subview3)]-|"

这使得六个 subview 在它们的父 View 中大小相等且间隔均匀。这说明了自动布局的优势之一，因为我们非常明确地避免了对 y 或 height 值的任何引用。我们只需定义 View 、它们的兄弟 View 和它们的父 View 之间的关系，自动布局会处理剩下的事情。

无论您是像上面那样使用 VFL 还是在 Interface Builder 中以编程方式执行此模式，此模式都适用，但希望它能说明这个概念。

或者，您可以使用 UICollectionView，它是为分隔这些控件而设计的，您可以对其进行设置，以便正确调整纵向和横向的布局。

---

例如，要向我的 View 添加六个 ImageView ，我可以将 QuartzCore.framework 添加到项目(我可以使用它来创建带圆角的红色 ImageView 背景)，然后导入标题:

#import <QuartzCore/QuartzCore.h>   // and 

然后在viewDidLoad中:

NSMutableArray *subviews = [NSMutableArray array];

for (NSInteger i = 0; i < 6; i++)
{
    UIImageView *subview = [[UIImageView alloc] init];
    [subviews addObject:subview];
    subview.layer.cornerRadius = 10.0;
    subview.backgroundColor = [UIColor redColor];
    subview.contentMode = UIViewContentModeCenter;
    subview.translatesAutoresizingMaskIntoConstraints = NO;
    [self.view addSubview:subview];
}

NSDictionary *views = @{@"subview1": subviews[0],
                        @"subview2": subviews[1],
                        @"subview3": subviews[2],
                        @"subview4": subviews[3],
                        @"subview5": subviews[4],
                        @"subview6": subviews[5]};

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[subview1]-[subview2(==subview1)]-[subview3(==subview1)]-|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[subview4]-[subview5(==subview4)]-[subview6(==subview4)]-|" options:0 metrics:nil views:views]];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[subview1]-[subview4(==subview1)]-|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[subview2]-[subview5(==subview2)]-|" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[subview3]-[subview6(==subview3)]-|" options:0 metrics:nil views:views]];

然后，如果我使用具有透明背景的 PNG 图像，我可以为这六个 ImageView 设置 image 属性，让自动布局定义 frame，QuartzCore 将做漂亮的圆角等。