出典:ArcGIS Experience Builder - Guide - Section and view
このページでは、ArcGIS Experience Builder のセクション コンポーネントとビュー コンポーネントについて説明します。また、セクションが複数のビューのコンテナとしてどのように機能するか、セクション内でビューがページやウィンドウとどのように同じように機能するか、ビュー ナビゲーション ウィジェットを使用してビュー間を移動する方法についても学びます。
セクションは、ページに追加できるレイアウト コンテナーです。セクションは、アプリケーション内のコンテンツを整理し、構造化します。セクションはモジュール レイアウトに便利で、関連するコンテンツをグループ化できます。ヘッダー、フッター、サイドバー、メイン コンテンツ エリアに使用できます。
セクションには、そのセクションの代替レイアウトやコンテンツ領域である複数のビューを含めることができます。これにより、ページを離れることなく異なるコンテンツ セットを切り替えることで、よりダイナミックなユーザー エクスペリエンスを生み出すことができます。
ビューはセクションに追加されるレイアウト コンテナーです。ページやウィンドウの機能に類似しますが、セクションで使用されます。ビューは、ウィジェットとコンテンツのための明確な領域を作成します。
ビューは、タブ、ワークフローのステップ、異なる情報の状態など、同じセクションで別のコンテンツやレイアウトを表示するのに便利です。ビューの切り替えは、ビュー ナビゲーション ウィジェットなどのナビゲーション コントロールを使用するか、トリガーを設定することで行うことができます。
ビューは、関連するコンテンツへのアクセスを維持しながら、ユーザーが一度に 1 つのコンテンツ セットに集中できるようにすることで、アプリケーションを整理するのに役立ちます。これは、ユーザーがページを離れることなく異なる情報やツールの間を移動する、ガイド付きエクスペリエンス、ウィザード、またはダッシュボードに役立ちます。
ビューは異なるレイアウトやウィジェットを持つことができ、切り替え時にトランジション アニメーションを適用できます。
セクションとビューをナビゲーション ウィジェットと一緒に使うことで、インタラクティブで、整理された、モジュール化されたエクスペリエンスを作ることができます。
セクションとビューを使用するには、次の手順に従います。
セクションとビューはどちらもコンテンツを整理するために使用されますが、構造、レンダリング、ユーザー インタラクションが異なります。以下の表は、主な違いをまとめたものです。
観点 | セクション | ビュー |
---|---|---|
定義 | コンテンツをグループ化し、レイアウトを管理するためにページに追加されるコンテナー | 代替コンテンツやレイアウトを表示するためにセクションに追加されるコンテナー |
階層 | ページレベルまたは他のビュー内に存在 | セクション内に存在 |
コンテンツ | 複数のビューを含むことが可能 | そのビューに固有のウィジェットやコンテンツを含むことが可能 |
ナビゲーション | ナビゲーションはセクション内のビュー間で行われる | ビューナビゲーションウィジェットやトリガーを使ってナビゲート可能 |
レンダリング | セクション内のすべてのビューがレンダリングされるが、アクティブなビューだけが表示される | 一度に表示されるのは1つのビューのみで、他のビューは非表示になるがレンダリングはされる |
アニメーション | ビューの切り替えにトランジション アニメーションを設定可能 | セクションのアニメーションを継承 |
ユースケース | ページレイアウトの整理、関連するコンテンツのグループ化、モジュール化されたデザインの作成 | タブ、ワークフローのステップ、代替状態、ガイド付きエクスペリエンス |
セクションとビューの主な違いは以下の通りです。
AppConfig では、セクションは sections
プロパティで定義され、sectionId
がキーとなる。ビューは views
プロパティで定義します。この構造により、アプリケーションを効果的に整理し、セクションとビューを簡単に管理し、アクセスできるようにすることができます。
sections
プロパティには、アプリケーションに追加されたセクションを表すセクション オブジェクトの配列が含まれます。各セクション オブジェクトには、スタイルや含まれるビューのリストなどの構成の詳細が含まれます。views
プロパティには、セクション内の各ビューの定義が含まれます。各ビュー オブジェクトは、固有の ID、保持するウィジェットやコンテンツ、そのビューに適用される特定の設定やスタイルを指定します。