コンテナビュー内で複数のビューを均等に配置する 質問する

見て、スペーサーがないよ！

私の最初の回答のコメント セクションの提案、特に @Rivera の役立つ提案に基づいて、最初の回答を簡略化しました。

私は GIF を使用して、これがいかに簡単であるかを説明します。GIF が役に立つことを願っています。GIF に問題がある場合に備えて、単純なスクリーンショットを含む以前の回答を以下に記載しました。

説明書：

1)ボタンまたはラベルを追加します。私は 3 つのボタンを使用しています。

2)各ボタンからスーパービューに中心 x 制約を追加します。

3)各ボタンから下部のレイアウト制約に制約を追加します。

4)上記の 3 で追加した制約を次のように調整します。

a)制約を選択し、b)定数を削除し (0 に設定)、c)乗数を次のように変更します。ボタンの数 + 1 を取得し、上から始めて、乗数をbuttonCountPlus1:1に設定し、次にbuttonCountPlus1:2、最後にbuttonCountPlus1:3 に設定します。(興味があれば、この数式の取得元については、以下の古い回答で説明しています)。

5）これがデモを実行しています！

注意: ボタンの高さが大きい場合は、制約がボタンの下部から適用されるため、定数値でこれを補正する必要があります。

古い回答

Apple のドキュメントや Erica Sadun の優れた書籍 ( Auto Layout Demystified ) に書かれていることにもかかわらず、スペーサーなしでビューを均等に配置することは可能です。均等に配置したい要素の数に関係なく、IB とコードでこれを行うのは非常に簡単です。必要なのは、「セクション式」と呼ばれる数式だけです。説明するよりも実行する方が簡単です。IB でデモすることで最善を尽くしますが、コードで実行するのも同じくらい簡単です。

問題の例では、あなたはそうするでしょう

1) まず、各ラベルに中央制約を設定します。これは非常に簡単です。各ラベルから下に向かってコントロール ドラッグするだけです。

2) Shift キーを押したままにします。これは、これから使用するもう 1 つの制約、「下部のスペースから下部のレイアウト ガイド」を追加するためです。

3) 「下部スペースから下部レイアウト ガイド」を選択し、「コンテナー内で水平に中央揃え」します。3 つのラベルすべてに対してこれを実行します。

基本的に、座標を決定したいラベルをラベルの総数に 1 を加えた数で割ると、IB に追加できる数値が得られ、動的な位置を取得できます。式は簡略化していますが、水平方向の間隔、または垂直方向と水平方向の両方を同時に設定するために使用できます。非常に強力です。

これが私たちの乗数です。

ラベル1 = 1/4 = .25、

ラベル2 = 2/4 = .5、

ラベル3 = 3/4 = .75

(編集: @Rivera は、乗数フィールドで比率を直接使用すれば、xCode で計算を実行できるとコメントしました!)

4) Label1 を選択し、下部の制約を選択します。次のようになります。

5) 属性インスペクタで「2 番目の項目」を選択します。

6) ドロップダウンから「最初の項目と 2 番目の項目を逆にする」を選択します。

7) 定数と wC hAny 値をゼロにします。(必要に応じて、ここでオフセットを追加できます)。

8) これは重要な部分です。乗数フィールドに最初の乗数 0.25 を追加します。

9) ついでに、一番上の「最初の項目」を「CenterY」に設定します。これは、ラベルの Y 中心に中央揃えにするためです。設定すると、次のようになります。

10) このプロセスを各ラベルに対して繰り返し、関連する乗数を入力します。Label2 の場合は 0.5、Label3 の場合は 0.75 です。これが、すべてのコンパクト デバイスですべての方向の最終製品です。非常にシンプルです。私は、大量のコードとスペーサーを含む多くのソリューションを検討してきました。これは、この問題に関して私が見た中で最も優れたソリューションです。

更新: @kraftydevil は、下部レイアウト ガイドはストーリーボードにのみ表示され、xibs には表示されないことを付け加えました。xibs では「Bottom Space to Container」を使用してください。よく気づきました!