第2章 ページのオーサリング
ページは、パースペクティブとしても知られていますが、以下のコンポーネントの集まりです。
- コアコンポーネント
- ナビゲーションコンポーネント
- レポーティングコンポーネント
ページには、コンポーネントをいくつでも追加できますが、必ずしも追加する必要はありません。Page Editor ツールを使用してページを編集します。
ページには、Fluid スタイルまたは Page スタイルのいずれかがあります。Fluid スタイルは標準的な Web ページで、ページの縦の長さが表示できる長さを超えた場合は垂直スクロールバーが使用されます。Page スタイルの Web ページは、縦の長さが常にウィンドウの長さに一致します。
2.1. ページの作成
Pages パースペクティブを使用して、異なる種類のコンポーネントで構成されるページを作成できます。ページを作成し、すべてのコンポーネントをページに定義したら、Page Editor を使用して、必要に応じてページの保存、削除、名前変更、またはコピーを行います。
以下の手順は、ページの作成方法と、必要なコンポーネントをページに追加する方法を説明します。
手順
- Business Central で、Menu → Design → Pages に移動します。
- Pages パネルで、New をクリックします。または、Page Editor ペインで New Page をクリックします。
- New Page ダイアログボックスでの Name フィールドに値を入力し、必要なスタイルを選択します。
- OK をクリックすると、Page Editor に新しいページが開きます。
- Components ペインで、コンポーネントを展開し、必要なコンポーネントタイプをエディターのキャンバスにドラッグします。
- ページにコンポーネントを配置したら、Properties ペインからプロパティーを編集します。
- Save をクリックし、再度 Save をクリックします。
2.2. ページの保存中、削除中、名前の変更中、またはコピー中
ページを作成して定義したら、必要に応じて Page Editor を使用してページの保存、削除、名前変更、またはコピーします。
手順
- Business Central で、Menu → Design → Pages に移動します。
- Pages パネルからページを選択します。Page Editor にページが開きます。
- 必要な操作を実行し、Page Editor の右上から Save、Delete、Rename、または Copy を選択します。
図2.1 ページの保存、削除、名前変更、またはコピー
2.3. ナビゲーションツリー
Workbench ナビゲーションツリーには、Business Central の Main メニューに表示されるエントリーが含まれます。このナビゲーションツリー構造への変更は、ホームページの Main メニューに反映されます。このメカニズムを使用して、たとえば新しいページを公開できます。
また、追加のナビゲーションツリーを作成できます。このカスタムツリーを使用して、ページ内にナビゲーションコンポーネントを設定できます。Navigation パネルから Workbench ツリーを削除することはできませんが、要件を満たすために Workbench ツリー階層を編集することはできます。この機能を使用すれば、新しいページを使用して Business Central の Main メニューをカスタマイズできます。
Navigation パネルにデフォルトで表示される Workbench ツリーは、Business Central のメイン メニュー です。
2.4. コンポーネント
ページには、さまざまなコンポーネントが含まれます。ページには、以下のコンポーネントタイプを使用できます。
- Core コンポーネント: カスタムの HTML 情報を指定、または既存ページを表示するのに使用します。コアコンポーネントは 2 種類があります。
表2.1 Core コンポーネントのサブタイプ
| Core コンポーネントのサブタイプ | 説明 |
|---|---|
|
HTML |
このコンポーネントは、HTML エディターウィジェットを開きます。テキスト、イメージ、テーブル、リンク、色などを使用して HTML ページを作成します。要件に応じてページをカスタマイズできます。 |
|
Page |
このコンポーネントを使用すると、新しいダッシュボードに以前作成したページを追加できます。このコンポーネントを使用して、ダッシュボードに作成してあるカスタムページをネストできます。 |
コアコンポーネントは必須ではありません。
- Navigation コンポーネント: ページ間を移動するのに使用します。ナビゲーションコンポーネントの種類は 6 つあります。
表2.2 ナビゲーションコンポーネントのサブタイプ
| ナビゲーションコンポーネントのサブタイプ | 説明 |
|---|---|
|
Target Div |
このコンポーネントは、タブリスト、メニューバー、ツリーナビゲーターコンポーネントが、エントリーを表示し、クリックした最後の項目を追跡するのに使用します。 |
|
Menu Bar |
このコンポーネントは、メニューバーの形でナビゲーションツリーのエントリーを表示します。Business Central でサポートされるレベルの数には制限がありません。 |
|
Tile Navigator |
このコンポーネントは、タイルの形でナビゲーショングループを表示します。グループはフォルダーとして表示されますが、選択する代わりにコンテンツが表示されます。 |
|
Tree |
このコンポーネントは、垂直のツリー構造フォーマットでエントリーを表示します。 |
|
Carousel |
円形やスライドショーなどで選択したページを表示するか、循環させます。 |
|
Tab List |
このコンポーネントは、コンポーネントの上部に、選択したメニューページをタブとして表示します。 |
ターゲット Div 設定は、円形、タイルナビゲーターなどの非ターゲット Div には必要ありません。
Reporting コンポーネント: グラフ、テーブル、マップなどの形でデータセットのデータの表示に使用されます (「データセットのオーサリング」セクションを参照)。レポーティングコンポーネントのタイプは 10 種類あります。レポーティングコンポーネントは New Displayer ウィジェットを使用して設定できますが、ウィジェットには以下の 3 つのタブが含まれます。
- Type: カスタムデータをグラフィカルに表示する方法を選択します。
- Data: Settings メニューで利用可能な Data Sets セクションから作成したカスタムのデータセットの一覧から、データセットを選択します。
- Display: タイトルを追加し、色、サイズなどを変更することでコンテンツを表示する方法を編集してカスタマイズします。
2.4.1. ページエディターにコンポーネントを配置してページの作成
ページを作成するには、Pages パースペクティブの Editor キャンバスにコンポーネントをドラッグする必要があります。ページに必要なコンポーネントをすべて配置したら、Save をクリックします。
2.4.2. Preview タブを使用してページのプレビュー
ページの作成または編集時に、Page Editor の Preview タブをクリックして、保存する前にページをプレビューします。
2.4.3. コンポーネントのプロパティー
ページに使用されるコンポーネントには、コンポーネントに関連するさまざまなプロパティーが含まれます。Properties パネルで以下のプロパティーを編集して、コンポーネントをカスタマイズできます。
- Panel プロパティー: Width、Height、Background Color など、コンポーネントパネルプロパティーをカスタマイズします。
- Margin プロパティー: Top、Bottom、Left、Right など、コンポーネントのマージンプロパティーをカスタマイズします。
- Padding プロパティー: Top、Bottom、Left、Right などのコンポーネントパディングプロパティーをカスタマイズします。
また、HTML コンポーネントには、コンポーネントの Alignment、Decoration、Color、Size、および Weight プロパティーをカスタマイズする追加テキストプロパティーもあります。
