ボックス
ボックスは、論理的に関連する情報とコンポーネントの視覚的に異なるグループを作成します。
デフォルトでは、ボックスは目に見える境界または背景色を使用して、その内容をインターフェースの残りの部分から分離します。ボックスにはタイトルを含めることもできます。
ベストプラクティス
含まれているビューと比較して、ボックスを比較的小さく保つことを勧めます。 ボックスのサイズがそれを含むウィンドウまたはスクリーンのサイズに近づくと、グループ化されたコンテンツの分離を伝える効果が低下し、他のコンテンツが密集する可能性があります。
ボックス内で追加のグループ化を伝えるために、パディングと配置を使用することを検討してください。 ボックスの境界は明確な視覚的要素です。入れ子になったボックスを追加してサブグループを定義すると、インターフェイスが集中して制約されているように感じる可能性があります。
コンテンツ
ボックスの内容を明確にするのに役立つ場合は、簡潔な紹介タイトルを付けます。 ボックスの外観は、その内容が関連していることを人々が理解するのに役立ちますが、関係についてさらに詳細を提供することが理にかなっている場合があります。また、タイトルは、VoiceOver ユーザーがボックス内で遭遇するコンテンツを予測するのにも役立ちます。
タイトルが必要な場合は、内容を説明する短いフレーズを書きます。 文章スタイルの先頭の大文字化を使用します。タイトルにコロンを追加する設定ペインでボックスを使用しない限り、句読点で終了しないでください。
プラットフォームの考慮事項
tvOS または watchOS ではサポートされていません。
iOS、iPadOS
デフォルトでは、iOS および iPadOS はボックス内で 2 番目と 3 番目の背景の 色 を使用します。
macOS
デフォルトでは、macOS はボックスの上にそのタイトルを表示します。
リソース
関連
開発者用文書
GroupBox — SwiftUI (GroupBox)
NSBox — AppKit (NSBox)