Office UI Fabric のピボット コンポーネント

ピボットはアクセス頻度の高いコンテンツへの迅速な移動を提供します。 ピボットを使用すると、2 つ以上のコンテンツ ビューの間を移動できます。 テキストのヘッダーは、ピボットの各セクションに含まれるコンテンツを指定します。 ピボットの各セクションのコンテンツは、異なるコンテンツ カテゴリに属する場合があります。 Office アドインでは、ピボット コントロールをタブ スタイルで使用します。 タブではアイコンとテキストの組み合わせを使用して、タブに含まれるコンテンツのタイプを表現します。

例:作業ウィンドウ内のピボット


ピボットが表示された画像


ベスト プラクティス

するべきこと 使用不可
ナビゲーション ラベルは簡潔にする必要があります。理想的には、フレーズではなく 1 から 2 個の単語のみを使用します。 完全な文章や、コロンやセミコロンなど複雑な区切り文字は使用しないでください。
別のタブが選択されている場合でも、画面上にピボットのヘッダーを保持します。
ピボット コントロールは 3 タブから 5 タブに制限します。
ピボットは、ページの上部付近でナビゲーション要素として使用します。 ピボットをページのコンテンツと混在させないでください。
ピボットは、大量のスクロールが必要になるコンテンツの多いページで使用します。

バリアント

バリエーション 説明
基本的な例 既定のピボット オプションとして使用します。 基本的な例の画像
タブ スタイルのリンク タブ スタイルのピボット ボタンが推奨される場合に使用します。 タブ スタイルのリンクの画像

実装

詳細については、「ピボット」と「Fabric React のコード サンプルの使用にあたって」を参照してください。

その他のリソース