在单元格/视图中垂直将可变数量的UILabel居中

Question

有没有办法将一个可变数量的标签垂直放置在一个超级视图中（在我的情况下是UITableViewCell）？

在我的应用程序中的此特定视图中，我想显示数据库中的数据。 数据归入一组，大小范围为0到3个元素，因此视图将具有0到3个对应的标签。 如果有一个标签，它应该出现在单元格的垂直中心线上。 如果有两个标签，则每个标签应在单元格的垂直中心线上方和下方出现相等的距离。 如果有三个标签，则一个标签应出现在垂直中心线上，另外两个标签应在中心线上方和下方出现相等的距离。

希望这种对视觉的不良尝试能有所帮助。 在此视觉效果的第二个示例中，代表标签的两个刻度线看起来好像与第三个示例中的顶部标签和底部标签相距相同，但我希望在实际情况下，它们稍微靠近一点比这要好得多，但这是尝试为复杂的UI元素建模时纯文本的局限性。

**********************************************************************************

- -


  -
-    These two should be slightly closer to center than shown here.
  -


  -
- -
  -

**********************************************************************************

我已尽力尝试摆弄约束，但似乎找不到找到这样的方法。

由于我来自Web编程背景，因此将其描述为在其父容器中垂直居中的可变高度的无序列表，但是我不确定如何重新创建它。

Answer 1

假设containerView是您的单元格中的UIView，用于为标签提供容器，则下面的代码将执行您想要的操作。

NSLayoutConstraint* containerCenterXConstraint = 
    [NSLayoutConstraint constraintWithItem:containerView
                                 attribute:NSLayoutAttributeCenterX
                                 relatedBy:NSLayoutRelationEqual
                                    toItem:containerView.superview
                                 attribute:NSLayoutAttributeCenterX
                                multiplier:1
                                  constant:0];

NSLayoutConstraint* containerCenterYConstraint = 
    [NSLayoutConstraint constraintWithItem:containerView
                                 attribute:NSLayoutAttributeCenterY
                                 relatedBy:NSLayoutRelationEqual
                                    toItem:containerView.superview
                                 attribute:NSLayoutAttributeCenterY
                                multiplier:1
                                  constant:0];

[containerView.superview addConstraints:@[containerCenterXConstraint, containerCenterYConstraint]];


[containerView setTranslatesAutoresizingMaskIntoConstraints:NO];
UILabel* previousLabel = nil;
for (int i = 0; i < numberOfElements; i++) {
    UILabel* label = [[UILabel alloc] init];
    [label setTranslatesAutoresizingMaskIntoConstraints:NO];
    label.text = <init label with data>;
    [label sizeToFit];
    [containerView addSubview:label];
    NSArray* constraints;
    NSDictionary* viewsDict;
    NSDictionary* metricsDict = @{@"labelHeight": @(CGRectGetHeight(label.frame))};
    if (i == 0 && numberOfElements == 1) {
        viewsDict = NSDictionaryOfVariableBindings(label);
        constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[label(labelHeight)]|"
                                                                                 options:0
                                                                                 metrics:metricsDict
                                                                                   views:viewsDict];

    } else if (i == 0 && numberOfElements > 1) {
        viewsDict = NSDictionaryOfVariableBindings(label);
        constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|[label(labelHeight)]"
                                                              options:0
                                                              metrics:metricsDict
                                                                views:viewsDict];
    } else if (i == (numberOfElements - 1) && numberOfElements > 1) {
        viewsDict = NSDictionaryOfVariableBindings(label);
        constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[label(labelHeight)]|"
                                                              options:0
                                                              metrics:metricsDict
                                                                views:viewsDict];


    }

    if (i > 0 && numberOfElements > 1) {
        viewsDict = NSDictionaryOfVariableBindings(previousLabel, label);
        constraints = [[NSLayoutConstraint constraintsWithVisualFormat:@"V:[previousLabel][label(labelHeight)]"
                                                               options:0
                                                               metrics:metricsDict
                                                                 views:viewsDict] arrayByAddingObjectsFromArray:constraints];
    }
    [containerView addConstraints:constraints];
    constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"|[label]|"
                                                          options:0
                                                          metrics:nil
                                                            views:viewsDict];
    [containerView addConstraints:constraints];
    previousLabel = label;
}