使用自动布局来改变空间同样的调整 [英] Using Auto Layout to change spaces equally on resizing

问题描述

如果我有我的3子视图应用程序的视图（作为一个例子），他们之间的间距如下：

If I have a view in my app with 3 subviews (as an example) with the following spacing between them:

TOP - 40分 - 子视图1 - 60分 - 子视图2 - 80分 - 子视图3 - 80点 - BOTTOM

TOP - 40 points - SUBVIEW 1 - 60 points - SUBVIEW 2 - 80 points - SUBVIEW 3 - 80 points - BOTTOM

我明白，我怎么可以使用自动布局，以确保我的每一个子视图保持它的高度和宽度，我可以得到一切无论是3.5或4英寸的iPhone屏幕上保持一致。

I understand how I can use auto layout to ensure each of my subviews keeps it's height and width, and I can get everything to be aligned on either a 3.5 OR 4 inch iPhone screen.

但我不能工作了，我需要让这个好像它是一个3.5对准画面，然后去了4画面，每个间隔将增加比例（如40点会是什么样的约束到47，60至71岁，80到95 - 点左右）。

But I can't work out what kind of constraint I need to make it so that if it were aligned for a 3.5" screen, and then went to a 4" screen, each spacing would increase proportionally (e.g. 40 points would go to 47, 60 to 71, 80 to 95 - or thereabouts).

这可能吗？或做我需要做的元素之间的所有间距相等？ （如果是的话我将如何仍然得到它同样大小？）

Is this possible? Or do I need to make all the spacing equal between the elements? (If so how would I still get it to resize equally?)

我是新来自动布局，所以如果我错过了什么状态，或者没有明确什么我指请让我知道，谢谢你。

I'm new to Auto Layout so if I've missed anything off, or haven't made it clear what I means please let me know, thank you.

推荐答案

我不知道有什么简单的方法来做到这一点。我做了一个，所有的空间都是平等的，但要做到这一点，我不得不填补隐形标签空间（只是没有标题标签）。所以，我有我的4可见对象和5间隔标签对彼此顶部没事。我做了4可见对象均具有明确的高度，并没有固定的高度间隔，但设置为所有相同的：

I don't know any easy way to do this. I made one where all the spaces were equal, but to do that, I had to fill the spaces with invisible labels (just label with no title). So, I had my 4 visible objects and the 5 "spacer labels" all right on top of each other. I made the 4 visible objects all have explicit heights, and the spacers with no fixed heights, but set to be all the same:

-(void)viewDidLoad {
    [super viewDidLoad];

    NSMutableDictionary *viewsDict = [NSMutableDictionary dictionary];
    for (int i=1; i<5; i++) { // Labels with titles
        UILabel *b = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 150, 44)];
         b.text = @"This is my label";
        [b setTranslatesAutoresizingMaskIntoConstraints:NO];
        [viewsDict setObject:b forKey:[NSString stringWithFormat:@"b%d",i]];
    }

    for (int i=1; i<6; i++) { // Spacer labels
        UILabel *l = [[UILabel alloc ]init];
        [l setTranslatesAutoresizingMaskIntoConstraints:NO];
        [viewsDict setObject:l forKey:[NSString stringWithFormat:@"l%d",i]];
    }

    for (id obj in viewsDict.allKeys) 
        [self.view addSubview:viewsDict[obj]];

    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[l1][b1][l2(==l1)][b2][l3(==l1)][b3][l4(==l1)][b4][l5(==l1)]|"
                                                                   options:NSLayoutFormatAlignAllLeading
                                                                   metrics:nil
                                                                     views:viewsDict];


    NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:@"|-[b1]"
                                                                   options:0
                                                                   metrics:nil
                                                                     views:viewsDict];


    [self.view addConstraints:constraints];
    [self.view addConstraints:constraints2];
} 

为了使空间不同，我认为你必须使用前pressing约束更长的形式，而不是视觉格式。下面code似乎为我工作。我使用的视图的定义如上，但我砍标题标签3和垫片的数量到4匹配你的问题。的相对间距应尽可能在例如2：3：4：4

To make the spaces different, I think you have to use the longer form of expressing constraints, rather than the visual format. The below code seems to work for me. I'm using the same definition of the views as above, except that I cut the number of titled labels to 3 and spacers to 4 to match you question. The relative spacing should be as in your example, 2:3:4:4.

NSLayoutConstraint *con1 = [NSLayoutConstraint constraintWithItem:self.view attribute:NSLayoutAttributeTop relatedBy:0 toItem:viewsDict[@"l1"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con2 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l1"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"b1"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con3 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b1"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"l2"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con4 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l2"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"b2"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con5 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b2"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"l3"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con6 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l3"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"b3"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con7 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b3"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:viewsDict[@"l4"] attribute:NSLayoutAttributeTop multiplier:1 constant:0];
    NSLayoutConstraint *con8 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l4"] attribute:NSLayoutAttributeBottom relatedBy:0 toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1 constant:0];
    NSLayoutConstraint *con9 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l1"] attribute:NSLayoutAttributeHeight relatedBy:0 toItem:viewsDict[@"l2"] attribute:NSLayoutAttributeHeight multiplier:.66 constant:0];
    NSLayoutConstraint *con10 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l1"] attribute:NSLayoutAttributeHeight relatedBy:0 toItem:viewsDict[@"l3"] attribute:NSLayoutAttributeHeight multiplier:.5 constant:0];
    NSLayoutConstraint *con11 = [NSLayoutConstraint constraintWithItem:viewsDict[@"l1"] attribute:NSLayoutAttributeHeight relatedBy:0 toItem:viewsDict[@"l4"] attribute:NSLayoutAttributeHeight multiplier:.5 constant:0];
    NSLayoutConstraint *con12 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b1"] attribute:NSLayoutAttributeLeading relatedBy:0 toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1 constant:100];
    NSLayoutConstraint *con13 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b2"] attribute:NSLayoutAttributeLeading relatedBy:0 toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1 constant:100];
    NSLayoutConstraint *con14 = [NSLayoutConstraint constraintWithItem:viewsDict[@"b3"] attribute:NSLayoutAttributeLeading relatedBy:0 toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1 constant:100];

    NSArray *constraints = @[con1,con2,con3,con4,con5,con6,con7,con8,con9,con10,con11,con12,con13,con14];
    [self.view addConstraints:constraints];

这篇关于使用自动布局来改变空间同样的调整的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！