web-dev-qa-db-ja.com

相対配置を使用するための自動レイアウトの乗数について

自動レイアウトを使用して、アイテムを他のビューと相対的に相対的に配置する方法を理解しようとしています。

たとえば、最近、次を使用して、ビューの下部をスーパービューの下部よりも4%高い位置に指定できることを学びました。

self.view.addConstraint(NSLayoutConstraint(item: label, attribute: .Bottom, relatedBy: .Equal, toItem: self.view, attribute: .Bottom, multiplier: 0.96, constant: 0))

これは私にとって理にかなっています。乗数を1にするとビューの一番下に配置されるため、乗数を0.96に変更することでその量を4パーセント減らすことができます。

しかし、他の方向でも同じことができますか?ラベルの上部を指定するには、スーパービューの上部から4%の位置から開始する必要があります。同じ行を使用し、属性を.Topに変更すると、スーパービューの上部より4%高くなります(ただし、実際には画面外に移動しません)。私が思うに負の乗数を持つことはできません。また、定数が0の場合、1より大きい値は何もしないと思います。

先頭と末尾の実装についても同じ質問があります。トレーリングは簡単です。右側から10%を望む場合:

self.view.addConstraint(NSLayoutConstraint(item: label, attribute: .Trailing, relatedBy: .Equal, toItem: self.view, attribute: .Trailing, multiplier: 0.9, constant: 0))

1.0に完全に揃えるのではなく、0.1または10%ダイヤルバックするので理にかなっています。しかし、どのようにリードするために同じことをしますか?ビューの末尾に対してラベルの先頭を設定してから、乗数を0.1に設定できると思いました。私の考えでは、ラベルは右端から始まり、その後90%に戻されるので、左から10%を取得することになります。しかし、そうではありません。理由はわかりません。

これがどのように機能するか、乗数を適切に使用してこれらの相対的なレイアウトを取得する方法を説明できますか?

簡単にするために、スーパービューの高さの上部と下部が10%で、スーパービューの幅の末尾と先頭が10%のラベルを作成するとします。縦向きのiPhoneでは、ラベルの上下に余白があります。そのように、左右に余白があります(そう、縮尺どおりに描画されます)。
enter image description here

しかし、iPadでは完全な正方形のビューに表示されるとしましょう。そのため、パディングは次のようにすべての周りで同じ量になります。
enter image description here

問題は、定数に固定値を設定するのではなく、そのような制約をどのように動的に値を定義するかです。ボトムとトレーリングの方法はすでに知っていますが、トップとリーディングには困惑しています。乗数を使用してより高度なレイアウトを行う方法を理解したいと考えています。たとえば、ラベルの上部を固定定数に設定するのではなく、ラベルの上部を別のラベルの下部の10%に指定する必要があります。

29
Jordan H

これを行うにはいくつかの方法があります。最も単純なケースでは、すでにほぼ手に入れています。水平境界を10%と90%にしたい場合は、bothのトレーリングエッジに関する制約を指定する必要があります。スーパービュー-だから_Subview.Trailing_は_Superview.Trailing_の乗数で_0.9_にロックしますが、それから_Subview.Leading_は乗数だけで_Superview.Trailing_にもロックします_0.1_の:

enter image description here

(および同様に上部/下部)

一方、最後に言及するケースはもう少し複雑です。「ラベルの上部を指定すると、別のラベルの下部の10%に位置するはずです。」そのため、おそらく前の例のような固定の割合のインセットを使用することはできません。代わりに、それらの間に非表示のスペーサービューを作成できます。_Spacer.Height = 0.1 * Superview.Height_を使用して制約を追加し、2つのラベルの間に添付します。 (これらのスペーサービューを使用して前のケースを処理することもできますが、その場合は実際には必要ありません。)

27
Archaeopterasa

私の意見では、「あなたは私が考えていない負の乗数を持つことはできず、定数が0のときに1より大きい値は何もしないと信じています」とあなたの理解している偏差を暴露しました。

フードの下の規則は、単なる線形方程式です。

FirstItem.Attribute1 = (SecondItem.Attribute2 * Multiplier) + Constant

すべてポイントで測定。ご覧のように、multiplier(NSLayoutConstraintのプロパティ)は定数の乗数ではありません。方程式に従ってください、あなたが理解していないことは明らかです。

あなたの特定の例に関して、@ Archaeopterasaは素晴らしい解決策を提示しました。別の例を以下に示します。

あなたがボトムとトレーリングを行う方法を知っているという事実に基づいて、私はあなたがこれら2つをやったと思う。次に、別の2つの制約を追加します。効果は望みのものになります。 set label's width to 80% superview's widthset label's height to 80% superview's height

最後に、ラベルの一番上にあるラベルを別のラベルの一番下に10%指定したい場合、コードを書かずにそれを実装することはできないようです。スーパービューの高さが実行時にわかった後、FirstItemとSecondItemを接続するNSLayoutConstraintオブジェクトの定数を設定するには、コードを使用する必要があります。

まず、1つのラベルから別のラベルへのドラッグを制御し、「垂直間隔」を選択します(または、他の方法でこれを行うことができます)。

次に、参照アウトレットが必要です。

@IBOutlet weak var tenPercentOfSuperview: NSLayoutConstraint!

次に、これを適切な場所で実行します(たとえば、viewDidLoad())

let heightOfSuperview = self.view.bounds.height
tenPercentOfSuperview.constant = heightOfSuperview * 0.1

すべては今大丈夫です。

このトピックについて詳しく知りたい場合は、Appleのドキュメントをお勧めします: https://developer.Apple.com/library/ios/recipes/xcode_help-IB_auto_layout/chapters/EditingConstraintAttributesintheAttributesInspector.html

8
fujianjin6471

これが

信じられないほどシンプル

それを行う方法。

「ヘルパー」または「メジャー」ビューを追加するだけです。

この例では、「計算ヘルパー」ビューは黄色です。

一般的な手法は非常にシンプルで明白です-それは説明を必要とせず、画像から取得できます。

これは、iOSで「教えてくれない」「部屋の中の象」の1つです。ただし、すべてのレイアウトで常に使用されます。

(実際、Appleはまさにこの目的のために特別なUIViewサブクラスを「測定」する必要がありました-実際、多くの大規模なチームは明白な機能でそれを行います。)

enter image description here

通知アイコン#1は、「View 1/4」ヘルパービューの右端の中央にあります。

通知アイコン#3は、「View 3/4」ヘルパービューの左端の中央にあります。

シャルドネができました。

便利なことに、ヘルパービューで、必要な感触に応じて、乗数を任意の値に設定するだけです。コード内のそれらを変更し、IBInspectable、animateなどを使用するのは非常に簡単です...

enter image description here

4
Fattie