出典:ArcGIS Experience Builder - Guide - page
ArcGIS Experience Builder では、ページはレイアウトの表現であり、物理的な HTML の Web ページではありませんが、そのように動作します。ページは、エクスペリエンス内でコンテンツを整理するための基盤です。
エクスペリエンスには最低 1 ページが必要で、複数ページも可能です。ページは 2 つのレイアウト タイプでデザインできます。
ウィジェット、セクション、スクリーンなどのページ コンテンツは、固定レイアウトやフロー レイアウトなどのレイアウト ルールに基づいて配置されます。さまざまな画面サイズに対応できるよう、レイアウトは3つのサイズ モード大画面
、中画面
、小画面
)に設定できます。この構成により、さまざまな機器に対応したカスタマイズ設計が可能になります。
アプリの設定では、ページは pages
プロパティで定義され、その構造は pageStructure
プロパティで概説されます。
ArcGIS Experience Builder でページを使用する一般的な手順は次のとおりです。
ページの追加 エクスペリエンスにページを追加してください。
ページにコンテンツを追加 ページにウィジェット、セクション、またはスクリーンを追加します。
ページ レイアウトの設定 ページのレイアウト タイプとサイズ モードを設定します。
エクスペリエンスにページを追加するには、以下の手順に従ってください。
ページにコンテンツを追加するには、以下の手順に従ってください。
ページ レイアウトを設定するには、以下の手順に従ってください。
Experience Builder には、それぞれ異なるユーザー エクスペリエンスを提供するように設計された、ページ用の 2 つの主要なレイアウト タイプ(フルスクリーン アプリとスクロール ページ)があります。
フルスクリーン アプリのページレイアウトは、アプリケーションのインターフェイスに似せてデザインされています。より没入感のあるエクスペリエンスを提供し、ユーザーは気が散ることなくコンテンツに接することができます。レイアウトは、さまざまな画面サイズや向きに合わせてカスタマイズできます。
フルスクリーン アプリのページ レイアウトは、2つのレイアウト タイプをサポートしています。
レイアウト タイプ | 説明 |
---|---|
固定 | 幅と高さが固定されているため、さまざまなデバイスでコンテンツの一貫性が保たれます。特定のデザインとレイアウトを必要とするアプリケーションに適しています。 |
グリッド | コンテンツをより柔軟に配置することができます。さまざまな画面サイズや向きに対応できるため、レスポンシブ デザインを必要とするアプリケーションに適しています。グリッド レイアウトは、さまざまなコンテンツ タイプや配置に合わせてカスタマイズできます。 |
スクロールページ レイアウトは、従来の Web ページに似せてデザインされています。標準的な Web サイトと同じように、ユーザーがコンテンツを縦にスクロールできるようになっています。このレイアウトは、ストーリーテ リングやステップ バイ ステップのガイド、長編コンテンツなど、より直線的な情報の流れを必要とするエクスペリエンスに適しています。
ArcGIS Experience Builder では、ページの 3 つのサイズ モードがサポートされているため、開発者はさまざまな画面サイズや向きに適応するレスポンシブ デザインを作成できます。3 つのサイズ モードは次のとおりです。
モード | 説明 |
---|---|
大画面 | このモードは、デスクトップやラップトップなどの大画面用に設計されています。より多くのコンテンツやウィジェットを収容できるレイアウトを提供します。 |
中画面 | このモードは、タブレットなどの中型スクリーン向けにデザインされています。タッチ インタラクションにコンテンツを最適化するレイアウトを提供します。 |
小画面 | このモードは、スマートフォンなどの小さな画面向けに設計されています。コンパクトなレイアウトで、モバイル端末でもコンテンツにアクセスしやすく、ナビゲートしやすくなっています。 |
Experience Builderは、選択したサイズ モードに基づいてレイアウトとコンテンツを自動的に調整します。開発者は、各モードのデザインと動作をカスタマイズして、すべてのデバイスで一貫したユーザー エクスペリエンスを実現できます。
Experience Builder では、ヘッダーとフッターは、追加のコンテキストまたはナビゲーション オプションを提供するためにページに追加できるオプションのコンポーネントです。ロゴ、タイトル、ナビゲーションリンク、その他の関連情報などの要素を含めることができます。
ヘッダーとフッターはページ設定でオン/オフでき、内容はすべてのページで同じになります。ヘッダーとフッターは、すべてのページに表示されるように設定することも、エクスペリエンス内の特定のページにのみ表示されるように設定することもできます。また、エクスペリエンスの全体的なデザインに合わせてスタイルやカスタマイズも可能です。ヘッダーとフッターは、ページ設定でオンまたはオフにできます。
ページ構成とその設定方法については、ページの追加と管理のドキュメントをご覧ください。