レイアウトの設定

<< Click to Display Table of Contents >>

マニュアル > 監視システム構築ガイド > プロジェクトの作成 > 標準プロジェクトの作成 > 標準プロジェクトのシステム設定 > レイアウトとメニューの編集(スタイル設定) >

レイアウトの設定

標準フレームワークのレイアウトについて

標準フレームワークの画面は、複数の表示エリアで構成されています。

表示エリアの構造は下図のとおりとなっています。

 

(標準フレームワークの表示エリア)

p_prj_0096

 

デフォルトの表示設定では、以下のように設定されています。

 

(標準フレームワークのデフォルトのエリア構成)

p_prj_0095

 

ヘッダーエリア ・・・メニューアイコン、ページ送り、タイトル、時計など

フッターエリア ・・・非表示(未使用)

上部エリア ・・・非表示(未使用)

下部エリア ・・・共通アラームサマリ表示

メインエリア ・・・グラフィック画面、標準機能の画面(トレンドグラフなど)は、このエリアに表示されます。

左側エリア ・・・メインメニュー

右側エリア ・・・非表示(未使用)

 

上記の設定は、レイアウト設定からから変更することができます。

 

 

レイアウトの設定

レイアウトの設定を行うには、システム設定画面からスタイル設定タブを選択し、画面左のメニューから「レイアウト設定」を選択します。

 

p_prj_0112

 

レイアウトの設定は、スタイルおよび適用サイズごとに行うことができます。左記のコンボボックスの選択状態が編集対象のスタイルとなっている事を確認してください。

 

 

 

 

■エリア表示の編集

 

「エリア表示」では、各エリアの表示の有無、サイズ、表示するコンテンツの設定を行います。

 

p_prj_0113

 

設定内容

 

ヘッダーエリア

ヘッダーエリアを表示するか否かを選択します。ヘッダーかフッターのいずれかに「メニューコントロール」を割り当てることができます。標準ではこのエリアにメニューコントロールが割り当てられています。縦幅をピクセル単位で指定することができます。

フッターエリア

フッターエリアを表示するか否かを選択します。標準では非表示となっています。縦幅をピクセル単位で指定することができます。

上部エリア

上部エリアを表示するか否かを選択します。標準では非表示となっています。縦幅をピクセル単位で指定することができます。このエリアは表示幅を左端、右端一杯にするか否かを設定することができます。

下部エリア

下部エリアを表示するか否かを選択します。上部エリアか下部エリアのいずれかに共通の「アラームサマリ」を割り当てることができます。標準ではこのエリアにアラームサマリが割り当てられています。縦幅をピクセル単位で指定することができます。このエリアは表示幅を左端、右端一杯にするか否かを設定することができます。

左側エリア

左側エリアを表示するか否かを選択します。左側エリアか右側エリアのいずれかに「メインメニュー」を割り当てることができます。標準ではこのエリアにメインメニューが割り当てられています。横幅をピクセル単位で指定することができます。

右側エリア

右側エリアを表示するか否かを選択します。標準では非表示となっています。横幅をピクセル単位で指定することができます。

 

 

 

尚、表示するコンテンツの選択は、ボタンのクリックによって行います。

 

例えば、以下の状態は、上部エリア、下部エリアとも表示が有効に設定されており、「アラームサマリ」は下部エリアに割り当てられています。

 

p_prj_0114

 

上部エリアの「アラームサマリ」ボタンをクリックすると、アラームサマリの割り当てが上部エリアに切り替わります。

 

p_prj_0115

 

アラームサマリが上部エリアに切り替わりました。

 

p_prj_0116

 

 

■メインメニューの編集

 

「メインメニュー」では、メインメニューの表示形式の設定を行います。

 

p_prj_0117

 

設定内容

 

メニュー形式

 

「サイドメニュー」か「フルメニュー」のいずれかを選択することができます。

サイドメニューは標準の表示形式であり、画面の左右のいずれかにメインメニューを表示します。フルメニューはボタンのみが配置されたメニュー画面によってメニュー表示を行います。

フルメニュー列数

 

メニュー形式にフルメニューを選択した場合の、メニュー画面のボタン表示の列数を指定します。

最終状態を保持

 

メニューの開閉の最終状態を保持します。

自動で隠す

 

サイドメニューの時、メニューの選択後に自動的に折りたたみます。

 

 

 

(サイドメニュー表示の例)

p_prj_0263

 

(フルメニュー表示の例)

p_prj_0118

 

 

hint

フルメニューでの表示は、クライアント画面をタブレットやスマートフォンなどで表示する場合に適した方式です。スタイルの適用サイズの設定で画面幅を定義しておく事で、通常の画面表示でははサイドメニュー方式で運用し、ある表示幅以下になった場合のみフルメニュー表示となるように設定することもできます。

 

 

■インフォメーションバーの編集

 

「インフォメーションバー」では、インフォメーションバーの表示設定を行います。

 

p_prj_0119

 

設定内容

 

有効/無効

 

インフォメーションバーの有効・無効を選択します。無効にすると、ヘッダーエリア右隅にあるのインフォメーションバーのアイコンが非表示となります。

表示幅

インフォメーションバーの表示幅をピクセル単位で指定します。

 

サイドメニュー連動

 

この設定を有効にすると、インフォメーションバーの開閉時にサイドメニューの開閉を連動させます(インフォメーションバーを開くとサイドメニューを自動的に閉じ、インフォメーションバーを閉じるとサイドメニューを自動的に開きます)。

オーバーラップ

 

この設定を有効にすると、インフォメーションバーの表示時に他の表示エリアの上に被せて表示します(右端がインフォメーションバーの下に隠れます)。無効に設定すると、インフォメーションバーの表示時に他の表示エリアは自動的にリサイズされて表示されます(右端がインフォメーションバーの下に隠れません)。

 

 

 

 

attention

インフォメーションバーにはシステム設定画面の呼び出しのための設定ボタンが配置されています。従って、インフォメーションバーを無効にすると、設定画面を呼び出すことができなくなる場合があります。一方、インフォメーションバーをキー操作で呼び出す方法が用意されています。キー操作によるシステム設定画面の呼び出し方法については、機能解説の「キー操作によるシステム設定画面の表示」に記述されています。