選択した項目のレイアウト問題の解決
ユーザーインターフェイスをレイアウトしながら、項目のための制約問題を修正します。
手順
- Interface Builder で、アウトラインビューまたはキャンバス上でそれらをクリックすることで、レイアウトの問題と１つ以上の項目を選択します。
- キャンバスの下部のレイアウトバーで[自動レイアウトの問題を解決(Resolve Auto Layout Issues)] ツールをクリックします。
- メニューの上半分から操作を選択します。
- フレーム更新。見当違いの項目を解決するため、この操作は属性インスペクタで制約の値と一致するように選択した項目のフレームを更新します。
- 制約の更新。見当違いの項目を解決するため、この操作は、キャンバス上に表示されるフレームを照合するための属性インスペクタでの制約の値を変更します。
- 行方不明の制約を追加します。制約の数の不足に起因する曖昧さを解決するため、この操作は、選択した項目に必要な制約を追加します。
- 提案された制約にリセットします。この操作は、選択した項目の制約を自動レイアウトシステムによって提案された新しいものに置き換えます。
- 制約をクリア。この操作は、選択した項目のすべてのレイアウト制約を削除します。その後、あなたはすべての新規制約を定義します。
見当違いの項目や欠けている制約の項目のいずれかを識別するために、上で示したボタンのように Interface Builder は、オレンジ色の線を使用します。Interface Builder は競合する制約を識別するために、下のボタンで示したように、制約に赤の線を使用します。
複数の項目を選択するには、アウトラインビュー内の項目の範囲を、Shift - クリックして、アウトラインビューで個々の項目を Command - クリックするか、キャンバス上の個々の項目を Shift - クリックするか、 Command - クリックします。
操作は、選択した項目の問題のみで有効です。行方不明の制約がない場合、例えば、[行方不明の制約を追加(Add Missing Constraints)] は薄暗く表示されます。
また、メニューの下半分は、ビューコントローラまたはウィンドウに含まれるすべての項目のレイアウトの問題を解決するのに使用できます。メニューの半分の両方からの操作は、[エディタ(Editor)] > [自動レイアウトを解決(Resolve Auto Layout)] メニューからアクセスできます。
曖昧な、または競合する制約を作成した時に自動レイアウトの問題が発生します。
項目の置き場所を間違えて、不足した数の制約を指定する、または項目のコンテンツのサイズを未定義のままにすることにより、曖昧な制約を作成します。曖昧な制約は、項目のサイズと配置の複数の可能なレイアウトになります。Interface Builder はオレンジ色え制約の線や枠線を描くことで、曖昧さを示します。
キャンバス上のフレームの位置とフレームの実行時の位置間の不整合から項目の置き間違えは起こり、それは属性インスペクタでその制約によって定義されます。例えば、項目の制約を指定し、その後 Interface Builder が、もはやその制約を満たすことができないように、キャンバス上の項目を移動する場合、項目の置き間違いを作成します。Interface Builder はオレンジ色で制約の線を描くことで置き間違いの項目を表示します。数字は現在のキャンバスの位置と属性インスペクタで指定された制約値との差分を示しています。Interface Builder は置き間違えた項目の実行時の位置を示すために、オレンジ色の破線を描画します。
例えば、項目の垂直方向の位置を制約するが、水平方向の位置の制約を追加しない時、制約は、曖昧さも引き起こします。Interface Builder は制約が欠けているフレームの境界線をオレンジ色に描画します。例えば、下のボタンのリーディング (または左) の端は、水平方向のスペースの制約がないので、フレームの左側は、オレンジ色で描かれています。
一部のコンテナビューは、スタックビューなどのように、実行時に、それらのサイズを決定するために、コンテンツのサイズに、依存しています。そのため、サイズは設計時には不明です。項目のコンテンツサイズが未定義だと、制約が曖昧である結果となります。この問題に対処するために、(自動レイアウト制約の編集 で説明したように) 属性インスペクタの項目のプレースホルダチェックボックスを選択することで、設計プレースホルダーとして、このようなビューの最小幅として、制約を設定します。
定義していない本来のコンテンツのサイズでカスタムビューは、制約が曖昧である結果になります。これを修正する方法は２つあります。
- カスタムビュー用プレースホルダの固有サイズの設定 で説明したように、項目のコンテンツのサイズを示すために、プレースホルダの固有のコンテンツサイズを設定するサイズインスペクタを使用します。
- Interface Builder でレンダリングするカスタムビューを作成します。関連記事は以下のリンクを参照してください。
Interface Builder が満足するあまりにも多くの制約を指定することで、競合する制約を作成する事になります。たとえば、スーパービューと第２ボタンのトレーリングエッジに関連する他の制約のリーディングエッジに関連する一つの制約と、ボタンのリーディングエッジと競合する水平空間の制約を作成するかも知れません。競合する制約は赤い線で描かれます。
他の選択： また、ビューコントローラまたはウィンドウを選択し、自動レイアウトの問題解決ツールをクリックすることもできます。操作は、メニューの下半分でのみ有効になりますが、それらは項目のサブビューのすべてに適用されます。レイアウトの問題を解決するための別のアプローチは、全体のルートビューの問題のリストでの作業から構成されます。これらの選択肢の詳細については、以下にリストした最初の２つの関連記事を参照してください。
関連記事
ビューコントローラ、ウィンドウ、またはルートビューのレイアウト問題の解決
自動レイアウトとレイアウト制約について
Interface Builder でレンダリングするカスタムビューの作成
決定済みの議論
自動レイアウトガイド