<< Click to Display Table of Contents >> マニュアル > 画面作成ガイド > Panel Editorの基本操作 > Panel Editorの編集操作 |
フォームの編集機能
Panel Editorには、オブジェクトを編集するための多くの機能が用意されています。編集機能はPanel Editorの「編集」メニューから選択することもできますが、オブジェクトを右クリックすることで表示されるメニューからも選択することができます。
メニューは「順序」「配置/整列」などのいくつかのグループに分かれており、メニューから目的の機能を選択することにより、オブジェクトの表示階層の変更や(最前面、最背面など)、コピー、切り取り、ペースト、位置合わせなどの編集操作を行うことができます。
|
用意されている編集機能は以下のとおりです。
グループ |
機能名 |
機能の内容 |
編集 |
元に戻す (Ctrl+Z) |
編集した内容を一つ前の状態に戻します(Undo)。
|
やり直す (Ctrl+Y) |
Undoで戻した編集内容を一つ再実行します(Redo)。
|
|
コピー (Ctrl+C) |
選択したオブジェクトをコピーします。
|
|
貼り付け (Ctrl+V) |
選択したオブジェクトを貼り付けます。
|
|
切り取り (Ctrl+X) |
選択したオブジェクトを切り取ります。
|
|
すべて選択 (Ctrl+A) |
フォーム上の全てのコントロールを一括で選択状態にします。
|
|
全てのブレークポイントを削除する |
スクリプトエディタで設定された全てのブレークポイントを削除します。
|
|
イメージを再読み込みする |
イメージファイルを再読み込みし、画像の表示を再描画します。
|
|
グリッドを表示する |
グリッドを表示します。
|
|
ガイドを表示する |
ガイドを表示します。
|
|
コントロールの移動をロックする |
コントロールの移動をロックします。コントロールを選択した際に、間違って移動してしまう事を防ぐことが可能です。
|
|
ミニプロパティボックスを表示する |
ミニプロパティボックスの表示を有効にします。
|
|
順序 |
最前面に移動 |
コントロールを最前面に移動します。
|
最背面に移動 |
コントロールを最背面に移動します。
|
|
前面に移動 |
コントロールを前面に移動します。
|
|
背面に移動 |
コントロールを背面に移動します。
|
|
配置 / 整列 |
左揃え |
選択した複数のコントロールを左位置で揃えます。
|
左右中央揃え |
選択した複数のコントロールを左右中央位置で揃えます。
|
|
右揃え |
選択した複数のコントロールを右位置で揃えます。
|
|
上揃え |
選択した複数のコントロールを上位置で揃えます。
|
|
上下中央揃え |
選択した複数のコントロールを上下中央位置で揃えます。
|
|
下揃え |
選択した複数のコントロールを下位置で揃えます。
|
|
左右に整列 |
選択した複数のコントロールを水平方向で間隔を揃えます。
|
|
上下に整列 |
選択した複数のコントロールを垂直方向で間隔を揃えます。
|
|
サイズ揃え |
幅を揃える |
選択した複数のコントロールの幅を揃えます。
|
高さを揃える |
選択した複数のコントロールの高さを揃えます。
|
|
高さと幅を揃える |
選択した複数のコントロールの高さと幅を揃えます。
|
|
回転 / 反転 |
左90度回転 |
コントロールを左に90度回転します。
|
右90度回転 |
コントロールを右に90度回転します。
|
|
左右反転 |
コントロールを左右反転させる
|
|
上下反転 |
コントロールを上下反転させる
|
|
ビジュアルテーマへ変更する |
全てのプロパティ |
選択されたコントロールの全てのプロパティについて、ビジュアルテーマとして定義されたデフォルト値と異なる値が設定されているものをビジュアルテーマの書式に変換します。 |
Colorプロパティ |
選択されたコントロールのプロパティのうち、FillColorやBorderColorなどのColorに関するプロパティのみを対象として、ビジュアルテーマとして定義されたデフォルト値と異なる値が設定されているものをビジュアルテーマの書式に変換します。 |
|
BorderStyleプロパティ |
選択されたコントロールのプロパティのうち、BorderStyleに関するプロパティのみを対象として、ビジュアルテーマとして定義されたデフォルト値と異なる値が設定されているものをビジュアルテーマの書式に変換します。 |
|
ビジュアルテーマを固定値にする |
全てのプロパティ |
選択されたコントロールの全てのプロパティについて、ビジュアルテーマの書式で定義されたプロパティ値を固定値として置き換えます。例えば@TextColorとして定義されていた色書式は、先頭が#000000などのRGB書式の固定値に置き換えられます。 |
Colorプロパティ |
選択されたコントロールのプロパティのうち、Colorに関するプロパティのみを対象として、ビジュアルテーマの書式で定義されたプロパティ値を固定値として置き換えます。 |
|
BorderStyleプロパティ |
選択されたコントロールのプロパティのうち、BorderStyleに関するプロパティのみを対象として、ビジュアルテーマの書式で定義されたプロパティ値を固定値として置き換えます。 |
|
回転の中心位置 |
コントロールの中心に戻す |
コントロールの回転の中心位置を、コントロールの中心に戻します。 |
ロック |
コントロールをロックする |
コントロールをロックします。ロックしたコントロールはマウスで移動できなくなります。例えば背景イメージなどをロックして、誤って動かなさないようにすることができます。
|
ロックを解除する |
ロックしたコントロールを解除します。
|
|
グループ化 |
グループ化 |
複数のコントロールをグループ化します。
|
グループ化解除 |
グループ化を解除します。
|
Panel Editorの上部には、よく使う機能に簡単にアクセスするための各種アイコンが配置されています。
新規クライアントを作成します。
|
|
プロジェクトファイル、またはクライアント設定ファイルを開きます。
|
|
ファイルの保存を行います。
|
|
切り取り操作を行います。
|
|
コピー操作を行います。 |
|
貼り付け操作を行います。
|
|
Undo操作を行います。
|
|
Redo操作を行います。
|
|
マウスで範囲選択した範囲での拡大表示を行います。
|
|
拡大/縮小を解除し、実際のサイズでの表示を行います。 |
|
フォーム表示エリアにあわせて画面を拡大/縮小します。 |
|
グリッドを表示します。詳細は「グリッドについて」を参照してください。
|
|
ガイドを表示します。詳細は「ガイドについて」を参照してください。 |
|
コントロールの移動をロックします。コントロールを選択した際に、間違って移動してしまう事を防ぐことが可能です。 |
|
ミニプロパティボックスの表示/非表示の切り替えおよび、ミニプロパティボックスの設定を行います。 詳細は「ミニプロパティボックス」を参照してください。 |
|
ヘルプ(リファレンスマニュアル)を開きます。
|
|
Panel Browserを起動します。現在開かれているクライアント設定ファイルでランタイム実行します。
|
|
Panel Serverを起動します。 現在選択中のプロジェクトに登録されているサーバ設定ファイルを開きます。または、PSFilePathルートプロパティに設定されているサーバ設定ファイルを開きます。それらのいずれにも該当しない場合、ブランクの状態でPanel Serverが起動されます。 尚、既にPanel Serverが起動されている場合は、当該Panel Serverを前面に表示します。 |
|
エクスプローラーを開きます。ワークスペースビューで現在選択されているアイテム(クライアント設定ファイルまたはサーバ設定ファイル)が格納されているフォルダを表示します。 |
|
クライアントのセットアップを呼び出します。セットアップに関する詳細は「運用ガイド」を参照してください。 |
|
現在選択中のコントロールのTextプロパティ、TextFontプロパティを直接編集することができます。
|
Panel Editorでフォームを表示した状態で、Ctrlを押しながらマウスホイールを操作すると、表示の拡大/縮小を行うことができます。 |
初期状態でフォームを開くと、フォーム上には小さなドットが均等間隔で表示されています。そして、フォーム上でコントロールを配置する際には、あたかも部品がこのドットに吸い付くような感覚で、ドット単位の大きさにしかコントロールを配置できません。このドットのことを「グリッド」と呼びます。
(グリッドが表示されたフォーム)
グリッド機能はコントロールを均等に表示したい場合などに有効ですが、グラフィック画面などで細かな絵を描きたい時は邪魔になることもあります。そのような場合はグリッドを非表示にすることで、ピクセル単位の細かな作画が行えるようになります。
グリッドの表示/非表示はPanel Editorの上部にある以下のアイコンから切り替えることができます。
又は、メニューから「編集」「グリッドを表示する」を選択することによっても同様に切り替えることができます。
尚、グリッドの表示幅と高さについては、GridHeightルートプロパティ、GridWidthルートプロパティから自由に変更することができます。詳細は「ルートプロパティ」を参照してください。
Panel Editorにはガイド機能が用意されています。ガイド機能を有効にすると、フォーム上に既に配置されているオブジェクトの位置合わせを容易に行う事ができるようになります。ガイド機能を用いると、マウスのドラッグにより移動させている途中のオブジェクトの座標位置に対して、他のオブジェクトの上、下、中央、左、右の各位置と同じ位置になるときにガイド線が表示され、あたかもガイドに吸い付くようにオブジェクトを配置することができます。
(ガイド線が表示された状態)
ガイドの表示/非表示はPanel Editorの上部にある以下のアイコンから切り替えることができます。
又は、メニューから「編集」「ガイドを表示する」を選択することによっても同様に切り替えることができます。
オブジェクトは複数同時に選択することができます。複数のオブジェクトを同時に選択するには、マウスで範囲指定するようにドラッグします。
全てのオブジェクトを囲むように、マウスの左ボタンを押しながら左上から右下に範囲指定するようにドラッグします。
|
3つのオブジェクトが同時選択されました。
尚、Ctrlキーを押しながら対象のオブジェクトを一つずつクリックすることによっても、複数オブジェクトの同時選択を行うことができます。
|
尚、マウスの左ボタンによる範囲選択では、オブジェクトの一部でも選択範囲に含まれていると選択対象となります。
左記の例では、右側の四角形は一部しか選択範囲に含まれていません。 |
左ボタンによる範囲選択では、選択範囲にかかる3つのオブジェクト全てが同時選択されました。
|
マウスの右ボタンを押しながら範囲選択を行うと、オブジェクトの全体が選択範囲に含まれているものだけを選択対象とすることができます。
左記の例では、右側の四角形は全体が選択範囲に含まれていません。 |
右ボタンによる範囲選択では、選択範囲に完全に含まれた2つのオブジェクトのみが同時選択されました。
|
オブジェクトの同時選択では、他のオブジェクトの同時選択への追加や、同時選択されているオブジェクトの解除がおこなえます。
左記は2つのオブジェクトが選択されている状態です。この状態で、さらに他のオブジェクトを追加選択したい場合は、Ctrlキーを押しながら対象のオブジェクトをマウスでクリックします。
ここでは例として、Ctrlキーを押しながら右側の四角形をクリックします。
|
クリックしたオブジェクトが同時選択に追加されました。
尚、複数選択されているオブジェクトから任意のオブジェクトを選択解除したい場合には、Ctrlキーを押しながら解除したいオブジェクトをクリックします。
|
複数のオブジェクトが選択された状態で、プロパティページでプロパティを変更すると、選択されているすべてのオブジェクトに設定を反映することができます。
複数オブジェクトを選択後、FillColorに白色を指定 |
すべてのコントロールが白色になる |
以下は、現在3つのコントロールオブジェクトが選択された状態です。オブジェクトが複数選択されると、選択されていることを示す4つの四角いマークが各オブジェクトに表示されます。その中で、必ず1つだけ、青色のマークになっているものがあり、そのコントロールのことを“基準コントロール”といいます。例えばこの状態で、配置/整列から「上揃え」を実行した場合、各オブジェクトのTopは基準コントロールの上位置に合わせて揃えられます。
中央の円が基準コントロール |
「上揃え」を実行すると、以下のようになる |
尚、複数同時選択した状態で基準コントロールを変更したい場合には、以下の手順で行います。
1.基準コントロールにしたいオブジェクトを、同時選択から一旦解除する(Ctrlを押しながらマウスクリックする)。
2.解除したオブジェクトを、再び同時選択に追加する(同上)。
この操作により、最後に選択したオブジェクトが自動的に基準コントロールになります。
複数のオブジェクトをグループ化することができます。
複数のオブジェクトが選択された状態で右クリックメニューを表示し、「グループ化」を選択します。
|
オブジェクトがグループ化されました。グループ化後は複数のオブジェクトを1つの部品として扱うことができます。
|
グループ化を行うと、「グループコントロール」と呼ばれるオブジェクトが生成され、グループの構成要素はグループコントロールの子オブジェクトとなります。又、グループ化は階層構造とすることもできます。すでにグループ化されたグループコントロールや他のコントロールを、さらにグループ化して束ねることができます。
共通プロパティのカスタムプロパティを設定することで、グループの子オブジェクトの各プロパティを束ねた独自のプロパティを自由に追加することができます。例えばそれぞれの子オブジェクトの各FillCoolorプロパティをグループオブジェクトで「_FillColor」というプロパティとして統括し、_FillColorに対して変更を加えるだけで一括で各子オブジェクトの塗りの色を変更することなどが可能となります。この機能の利用は、独自のグラフィック部品を作成する場面において非常に強力です。
グループ化に関する詳細についてはコントロールリファレンスの「グループコントロール」の記述を参照して下さい。また、カスタムプロパティについては、「共通プロパティ(カスタムプロパティ)」の記述を参照して下さい。
|
グループ化したオブジェクトは、1つのオブジェクトのように編集することができます。例えば、グループオブジェクトのサイズを編集すると、グループを構成する個々のオブジェクトもサイズが変更されます。
グループオブジェクトを選択した状態です(これはポンプを表現したシンボルです)。 ここでは例として、オブジェクトの縦サイズを縮めてみます。 |
編集操作によって全てのオブジェクトの形が変わりました。
|
また、グループ化したオブジェクトは、グループを解除することなく個々のオブジェクトの編集を行うこともできます。個々のオブジェクトを編集状態にするには、Ctrlキーを押しながらグループオブジェクトをダブルクリックします。
ダブルクリックによって、グループオブジェクトの外側が網掛けになりました。この状態がグループの編集可能な状態です。 |
四角形オブジェクトを選択して、縦幅を縮めてみます。 グループの編集状態を解除するには、網掛けになっている画面上の任意の場所でダブルクリックします。 |
ポンプの構成要素のうち、上側の四角形だけ形が変わりました。 |
尚、グループ化を解除するには、編集メニューから「グループ解除」を選択します。
右クリックでメニューを表示し、「グループ解除」を選択します。 |
グループが解除されました。 |
グループ化は、入れ子構造にすることもできます。入れ子とは、グループ化された複数の部品を、さらに束ねてグループ化することです。入れ子のグループであっても、Ctrlキーを押しながらさらにダブルクリックすることで、編集対象のグループ要素を掘り下げていくことができます。これにより、グループ化を解除することなく個々の構成要素を編集できます。 |
グループオブジェクトに対する設定内容は、グループ化を解除すると全て消去されます。グループオブジェクトに対して記述されたスクリプトや、カスタムプロパティの設定などもすべて消えてしまうため、注意してください。尚、もしも誤ってグループを解除してしまった場合には、編集メニューの「元に戻す」によって戻すことができます。 |
Panel Editorで貼り付け操作を繰り返して実行する際に、オブジェクトの位置を均等に貼り付けることができます。
まず、コピー元のオブジェクトを選択してコピーし、1つ貼り付けます。 |
ここで、新たに貼り付けられたオブジェクトを選択し、均等に貼り付けを行いたい位置に移動します。 |
貼り付け操作を繰り返して実行します。すると、オブジェクトが均等間隔で貼り付けられていきます。 |
Panel Editorは同時に複数起動することが可能であり、異なるPanel Editor間で自由にコピー&ペーストすることができます。つまり、作成したフォームやオブジェクトなどを自由にコピーすることができます。
この機能は、例えばこれから開発しようとしている監視設備と類似した過去の成果物から使えそうな部品を取り込みたい場面や、ある程度規模の大きなシステムを複数人のチームで同時に開発する場合などに、複数の設定ファイルを最終成果物としてマージする際などで重宝します。
Panel Editor間でのコピー&ペーストは、以下の手順で行います。
1.Panel Editorを起動し、コピー元となる設定ファイルを開きます。
2.Panel Editorをもう一つ起動し、コピー先となる設定ファイルを開きます。
3.コピー元のPanel Editor側で、コピーしたいオブジェクトを選択し、コピー操作を行います。
4.コピー先のPanel Editor側で、張り付けたい対象に対して貼り付け操作を行います。
Panel Editor間でのコピー&ペーストは、フォームのコピーや、複数フォームが格納されたフォルダをまるごとコピーすることもできます。 |
Panel Editorで作成したフォームは、イメージファイル(bmp/jpg)として保存することができます。この操作は、Panel Editorのファイルメニューから行います。
■フォームを画像ファイルに保存する
フォームを画像ファイルに保存するには、ファイルの「スクリーンショット」メニューから保存したい画像ファイルのフォーマットを選択します。
画像フォーマットを選択すると以下のダイアログが表示されるので、保存したいフォーム、ファイル名等の設定を行い、OKボタンをクリックします。
対象: 保存対象のフォームを指定します。
全て・・・全てのフォームを対象とする 選択中のフォルダ ・・・選択中のフォルダのみを対象とする 選択中のフォーム ・・・選択中のフォームのみを対象とする ページ指定 ・・・対象フォームをページ単位で範囲指定する
ファイル名称 : ファイル名のルールを以下から選択します。
1) Page Number 2)Form Name 3)Folder Name + Form Name
ファイル名称ヘッダ : ファイル名に接頭辞をつけることができます。
保存先フォルダ : 画像ファイルの保存先フォルダを選択します。 |