0

最新のプロジェクトで自動レイアウトの使用を開始したばかりで、次のテーブル セルをレイアウトする最も効率的な方法は何だろうと考えていました。

UITableCell: 必要なさまざまなビューが黒で表示されます

ビュー A と B はどちらも UILabels です。C は固定サイズの画像で、A の下のビューは存在する場合と存在しない場合がある画像です。A、B、C を簡単にレイアウトできます。ただし、A の下に画像が存在する場合、A の高さは比例して縮小する必要があり、画像はその下に収まるようにして、両方が contentView の水平方向の中央に配置されるようにする必要があります。

コードと Visual Format 言語を使用してセル全体をレイアウトしようとしていますが、これまでのところかなり近づいています。唯一の問題は、A とそれに付随する画像がコンテナーの垂直方向の中央に配置されていないことです。下の画像で、私がどこまで到達したかを確認できます。

Visual Format Language といくつかの追加の制約の組み合わせを使用したレイアウト

そして、これが私の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)]];
    }

私のアイデアの 1 つは、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 に答える