UIStackView内に追加されたビューに先行パディングを追加する方法


125

これは私のセットアップです。私は、UIScrollViewリーディング、トップ、トライアルエッジが0に設定されUIStackViewています。この内部に、次の制約を持つを追加します。

stackView.centerYAnchor.constraintEqualToAnchor(selectedContactsScrollView.centerYAnchor).active = true  
stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

スタックビュー内にいくつかのビューを追加します。
私の問題は、制約のために、スタックビューに追加された最初のビューにもリーディングエッジ= 0があることです。

最初のビューにパディングを追加する方法は何ですか?スクロールビューの制約を調整せずに。


2
受け入れられた答えを変更してくれますか?トルガの答えははるかに良いようです。
ハニー、

回答:


26

あなたが提供したソリューションは、UIStackView内のビューにパディングを追加しませんが(質問で望んだように)、UIStackViewのリードを追加します。

解決策は、元のUIStackView内に別のUIStackViewを追加して、この新しいUIStackVIewを導くことです。次に、ビューをこの新しいUIStackViewに追加します。

ヒント、それはInterface Builderを使用して完全に実行できます。つまり、そのためのコードを記述する必要はありません。


373

場合isLayoutMarginsRelativeArrangementプロパティが真である、スタックビューは、そのレイアウトマージンに対して、その配置されたビューを配置します。

stackView.layoutMargins = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
stackView.isLayoutMarginsRelativeArrangement = true

ただし、スタックビューに配置されたすべてのビューに影響します。配置された1つのビューのみにこのパディングが必要な場合は、ネストされたビューを使用する必要がありますUIStackView


2
isLayoutMarginsRelativeArrangementはゲッター、セッターはlayoutMarginsRelativeArrangementです。答えを編集することはできません
maross

5
@maross Swiftのゲッター関数とセッター関数の間に違いはありません。しかし、あなたが正しい、Objective-Cで開発する人はlayoutMarginsRelativeArrangement代わりに使うべきです。公式ドキュメント:developer.apple.com/reference/uikit/uistackview/...
トルガOkur

3
Objective-Cの場合:stackView.layoutMargins = UIEdgeInsetsMake(0, 20, 0, 20); [stackView setLayoutMarginsRelativeArrangement:YES];
スヌート2017年

4
2019年2月、オフィスで真夜中に座って -これらのような答えは私に前進する力を与えます。ありがとう@tolpp
nefarianblack

155

スタックビュー内では制約が機能しないか、やや奇妙に見えます。

(画像スタックビューの選択に先行/後退制約を追加すると、コレクションビューにも先行が追加されますが、後行は追加されません。確実に競合します)。

スタックビュー内のスタックビュー

stackview内のすべてのビューのレイアウトマージンを設定するには、次を選択します。

Stack View > Size Inspector > Layout Margins > Fixed

注:"Fixed"オプションは"Explicit"、スクリーンショットにあるように、以前はと呼ばれていました。

次に、パディングを追加します。

絵コンテ


23
アップルが隠しているものの一つ。私はXcodeが良い、フレンドリーで簡単なものの反対であることを嫌います。ありがとう
ダック

これらの明示的なレイアウトマージンを変更すると、Xcodeがクラッシュし続けます。バグを報告しましたが、重複していると回答しました。
mvandillen 2017

UIにはそれがありませんでした。レイアウトマージンを明示に変更して、スタックビューマージンのフィールドを表示します。
pkamb 2017年

13
FYI XCode 9は、これを「明示」ではなく「固定」と呼びます。
Mel

また、Xcode 9では、ファイルインスペクタの[セーフエリアレイアウトガイドを使用する]チェックボックスをオフにします。これは、現時点でIBで多くの問題を引き起こしているため、制約については通常のレイアウトガイドを使用してください。
PJ_Finnegan 2017年

16

私にとってうまくいったのは、単なるスペーサーである別のUIViewをスタックビューに追加することです(少なくともstackView.distribution = .Fillで機能します)。

let spacerView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 10))
stackView.addArrangedSubview(spacerView)
stackView.addArrangedSubview(viewThatNeedsSpaceBeforeIt)
stackView.addArrangedSubview(NextView)...

6

swift 3:次のようにオフセットを設定するだけです:

firstView.leadingAnchor.constraint(equalTo: parentView.leadingAnchor, constant: 200).isActive = true

この制約が設定されていることを確認してください parentView.addArrangdSubView(firstView)


4

先行パディングのみが必要な場合は、スタックビューのAlignmentを "Trailing"に設定でき、含まれる各サブビューに一意の先行制約を自由に指定できます。

おまけとして、スタックビューの配置を "Center"に設定してから、Leading制約またはTrailing制約、あるいはその両方を使用して、各項目に両側に独自のパディングを与えることもできます。


1

この質問にはすでに良い回答spacingがあります。提案の1つとして、プロパティを使用してビュー間の間隔を設定します。最初と最後のビューには、@ tolppの提案に従ってインセットを設定するか、パディングを追加する定数を使用して親(stackview)に接続する制約を追加するかの2つのオプションがあります。


0

UIStackViewの最初と最後の子として透明コンポーネント(UIButton / UIViewなど)を追加しました。次に、これらの非表示の子の幅を設定して、パディングを調整します。


0

解決策は、制約を追加したいビューを保持するためにスタックビューに通常のビューを用意し、スタックビューのビューに関連するアイテムに制約を追加することです。このようにして、元のビューはスタックビュー内で先行制約と後続制約を持つことができます。

これは、インターフェイスビルダーおよびプログラムで実行できます。


-3

解決策はかなりシンプルだったようです。の代わりに:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

私は書きました:

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor, constant: 15).active = true

1
実際には、コードはurscrollview内にuistackviewの先頭を追加しますが、uistackview内にビューのパディングを追加しません(質問の
とおり

ええ、でもパディングを追加できるかどうかわからないので、これでうまくいきます。
エイドリアン

最初の考えとして、別のuistackviewを使用して元のuistackviewを組み込み、それにパディングを与えることができます。次に、この新しいuistackviewにビューを追加します(インターフェイスビルダーで完全に実行できます。コードを記述する必要はありません)
William Kinaan

はい、うまくいきます。回答として追加していただければ受け付けます。
Adrian
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.