如何使用自动布局以编程方式表示此UITableCell的内容？

Question

我刚刚开始在我的最新项目中使用自动布局，我想知道布置下表格单元的最有效方法是什么：

视图A和B都是UILabel。 C是固定大小的图像，A下的视图是可以存在或不存在的图像。我可以很容易地布置A，B和C.但是如果A下的图像存在，A的高度需要按比例缩小，图像需要适合在下面，以便两者在contentView中水平居中。

我正在尝试使用代码和Visual Format语言来创建整个单元格，并且到目前为止已经非常接近了。唯一的问题是A和它的伴随图像不是在容器中垂直居中。你可以看到我在下面的图片中走了多远：

以下是我在updateConstraints方法中使用的代码。请注意，使用此代码，我不会得到模糊的布局：

NSDictionary *views = NSDictionaryOfVariableBindings(viewA, viewB, viewC);
    [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[viewA]-[viewB]-(>=8)-[viewC]-|"
                                                                             options:0
                                                                             metrics:nil
                                                                               views:views]];


    NSDictionary *metrics = @{@"width":@(40.0f), @"height":@(40.0f), @"priority":@(UILayoutPriorityRequired)};

    [viewC addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[viewC(==width@priority)]"
                                                                          options:0
                                                                          metrics:metrics
                                                                            views:@{@"viewC": _merchantLogo}]];
    [viewC addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[viewC(==height@priority)]"
                                                                          options:0
                                                                          metrics:metrics
                                                                            views:views]];

    [viewA addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[viewA(>=75@750)]"
                                                                           options:0
                                                                           metrics:nil
                                                                             views:views]];

    [viewB addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[viewB(>=115@500)]"
                                                                          options:0
                                                                          metrics:nil
                                                                            views:views]];

    [self.contentView addConstraints:@[[NSLayoutConstraint constraintWithItem:viewC
                                                                    attribute:NSLayoutAttributeCenterY
                                                                    relatedBy:NSLayoutRelationEqual
                                                                       toItem:self.contentView
                                                                    attribute:NSLayoutAttributeCenterY multiplier:1.0f constant:0.0f],
                                       [NSLayoutConstraint constraintWithItem:viewB
                                                                    attribute:NSLayoutAttributeCenterY
                                                                    relatedBy:NSLayoutRelationEqual
                                                                       toItem:self.contentView
                                                                    attribute:NSLayoutAttributeCenterY multiplier:1.0f constant:0.0f]]];

    if (!viewD) {
        [self.contentView addConstraints:@[[NSLayoutConstraint constraintWithItem:viewA
                                                                        attribute:NSLayoutAttributeCenterY
                                                                        relatedBy:NSLayoutRelationEqual
                                                                           toItem:self.contentView
                                                                        attribute:NSLayoutAttributeCenterY multiplier:1.0f constant:0.0f]]];
    } else {
        [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[viewA][viewD]"
                                                                                 options:NSLayoutFormatAlignAllLeft
                                                                                 metrics:nil
                                                                                   views:NSDictionaryOfVariableBindings(viewA, viewD)]];
    }

我的一个想法是将A和它下面的图像放在容器视图中，然后将它们放在该视图中。但这似乎效率低下，我首先要确保在不使用容器视图的情况下无法做到这一点。

Answer 1

因此...

1.
Format
@"|-[_viewA(<=75)]-[viewB]-[viewC(==60)]-|"
Options
NSLayoutFormatAlignAllTop

2.
Format
@"V:|-[viewA]-[imageView(==10)]-|"
Options
NSLayoutFormatAlignCenterX | NSLayoutFormatAlignAllLeft

3.
Add individual constraints to constrain bottom of image view to bottom of viewB and viewC.
[NSLayotuConstraint constraintWithItem:viewB
                             attribute:NSLayoutAttributeBottom
                             relatedBy:NSLayoutRelationEqual
                                toItem:imageView
                             attribute:NSLayoutAttributeBottom
                            multiplier:1.0
                              constant:0];

and other one...

这可以给你你想要的东西。