0

我刚刚开始为我的最新项目使用自动布局,我想知道布局下表单元格的最有效方法是什么:

UITableCell:各种必要的视图以黑色显示

视图 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 及其下方的图像放在容器视图中,然后将它们放置在该视图中。但这似乎效率低下,我首先要确保如果不使用容器视图,这是不可能的。

4

1 回答 1

2

在此处输入图像描述

所以...

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...

这应该给你你想要的。

于 2013-09-16T09:57:53.410 回答