Skip To Content

セクション ウィジェット

セクション ウィジェットは、1 つ以上のビューの動的コンテンツのレイアウト コンテナーです。複数のビューがあるとき、セクション ウィジェットは、ビュー ナビゲーション ウィジェットと連携して動作し、マップ、リスト、画像などの他のウィジェットと組み合わせることもできます。セクション内のコンテンツが変更されると、ページ全体の代わりにセクションだけが更新されるため、アプリのパフォーマンスが向上します。

このウィジェットを使用して、次のようなアプリの設計要件をサポートします。

  • 見出しが類似している複数の大きい画像を表示する一方で、アプリでのスクロールを減らします。セクション内で複数のビューを使用して、ビュー ナビゲーション ウィジェットを含めます。ユーザーはタブをクリックすると、ページをスクロールすることなく各画像にアクセスできるようになります。
  • 異なるフィーチャが同じ場所に焦点を当てるようにして、別々のページやブロックに移動する必要なしで、リストとマップを使って情報を紹介します。さまざまな視点から見られるようにビューを切り替えることができます。たとえば、マップとリストを含む 2 つのビューを持つセクションを作成します。一方のビューにはサンディエゴのレストランのマップを表示し、もう一方のビューには同じエリアでレクリエーション スポットを含んだマップを表示します。

使用上の注意

複数のビューを作成して、1 つのセクションで動的コンテンツを整理できます。セクションはページの任意の場所に配置でき、複数のビューを含めることができます、各ビューに別々のコンテンツを含めることもできます。エンド ユーザーがセクションの異なるビューを参照できるようにするには、ビュー ナビゲーション ウィジェットを追加する必要があります。

対応するビュー ナビゲーション ウィジェットでビュー名が表示されるので、意味のある名前を付けます。構成パネルでのビューの順序は、ビュー ナビゲーション ウィジェットで表示される順序です。

設定

セクション ウィジェットには以下の設定が含まれます。

  • [ビュー] - 複数のビューを一度に 1 つずつ追加するか、既存のビューと同じ背景またはレイアウトになるようにしたい場合は既存のビューを複製します。
  • [名前の変更][複製]、および [削除] オプションを使用してビューを管理します。
  • [背景] - 色または画像を選択して、各ビューの背景を編集します。背景画像を使用する場合、[フィット][塗りつぶし][中央][タイル]、または [ストレッチ] を選択して、ビューでの位置を設定します。
  • ビューをドラッグして、セクション内のナビゲーション順を変更します。

このトピックの内容
  1. 使用上の注意
  2. 設定