第8章 プログラミングテクニック
8.7 ツールバーを使ったアプリケーションを作成する
ツールバーとは、メニューバーやポップアップメニュー中のメニュー項目に対応するボタンなどを配置し、メニュー項目を選択すること なく、いろいろな操作をできるようにするものです。通常、ツールバーはメニューバーの下に配置されます。本節では、ツールバーを 使ったアプリケーションの作成方法について説明します。
本節では、「第4章 アプリケーションを作成しよう」で作成したアプリケーションをもとに、メニューバーからだけではなく、ツールバー上 のボタンによる操作もできるように変更します。
このアプリケーションは、以下の手順で作成します。
1. ツールバーのボタン上に表示するイメージを作成します。
2. フォームにツールバーコントロールを配置します。
3. ツールバーコントロールにボタンを追加します。
4. ツールバーのボタンがクリックされたときの手続きを記述します。
ポイント
本節で作成するサンプルプログラムは、"Toolbar\Table5.ppj"に格納されています。必要に応じて参照してください。
8.7.1 ツールバーのボタン上に表示するイメージを作成する
ツールバーのボタン上に表示するイメージは、イメージリストを使用します。イメージリストは、複数のイメージを等しい間隔で横に並べ たビットマップです。Windowsでは、1つのイメージの幅が16ピクセル、高さが15ピクセルになるよう推奨されています。このサンプルプ ログラムでは、3つのボタンを作成しますので、幅が48ピクセルのビットマップを作成します。以下の手順で、イメージリストを作成し、モ ジュールに登録します。
1. Windowsのアクセサリ内にある「ペイント」を起動します。
2. [変形]メニューの[キャンパスの色とサイズ]コマンドを選択します。
3. [キャンパスの色とサイズ]ダイアログボックスの[幅]に48、[高さ]に15を設定し、[単位]を[ピクセル]に変更します。
4. OKボタンをクリックします。
5. 開く、保存および印刷に対応するイメージを16ピクセル幅で横に並べて作成します。
作成例として、Table5.ppjと同じフォルダにあるToolButton.bmpを参照してください。
6. ビットマップを保存します。
ここでは、ToolButton.bmpというファイル名で保存します。
7. プロジェクトウィンドウのデザインツリーウィンドウでモジュールを選択します。
8. ポップアップメニューの[ファイルの挿入...]コマンドを選択します。
9. [ファイルの挿入]ダイアログボックスで、[ファイルの種類]を"イメージリスト(*.bmp)"に変更します。
10. 先ほど保存したToolButton.bmpを選択します。
11. [開く]ボタンをクリックします。
12. デザインツリーウィンドウ上で追加したイメージリスト名を設定します。
サンプルプログラムでは、そのままの名前(ImageList1)を使用します。
ポイント
イメージリストのプロパティ設定ダイアログボックスを参照すると、イメージ幅が16になっていることが確認できます。PowerCOBOLでは、
イメージリストのイメージ幅の初期値として16を設定しています。個々のイメージを16ピクセル以外の幅で作成した場合は、このダイア ログボックスを使ってイメージ幅を変更してください。
注意
モジュールのイメージリストを追加する場合には、ファイルの種類として"イメージリスト(*.bmp)"を選択してください。イメージリストのファ イル拡張子は"bmp"ですが、"ビットマップファイル(*.bmp)"として追加すると、イメージリストとして使用できません。
8.7.2 フォームにツールバーを配置する
以下の手順で、フォームにツールバーを配置します。
1. フォーム編集ウィンドウを開きます。
2. フォームの上端にツールバーを作成するので、フォームの高さを少し広げます。
3. フォーム上のコントロールすべてをまとめて選択します。コントロールをまとめて選択する方法は、「5.2.4 コントロールをまとめて 編集する」を参照してください。
4. まとめて選択したコントロール全体を下方に少し移動します。
5. ツールボックスから"ツールバーコントロール"を選択し、フォーム上に配置します。
ポイント
上記のような作業を省くため、ツールバーを使用するフォームを設計する場合は、最初にツールバーコントロールを配置しておくことを お勧めします。
8.7.3 ツールバーにボタンを追加する
以下の手順で、ツールバーにボタンを追加していきます。
1. ツールバーコントロールを選択し、プロパティ設定ダイアログボックスを開きます。
2. [ツールバー]タブの[イメージリスト]から、"ImageList1"を選択します。
3. [ボタン]タブを選択します。
4. [後ろに挿入]ボタンをクリックします。
5. [イメージインデックス]に1を設定します。
6. [後ろに挿入]ボタンをクリックします。
7. [イメージインデックス]に2を設定します。
8. [後ろに挿入]ボタンをクリックします。
9. [イメージインデックス]に3を設定します。
10. OKボタンをクリックします。
上記の作業の結果、以下のようなフォームが作成されます。
ポイント
・ ツールバー]タブの[イメージリスト]には、モジュールに追加されているイメージリストに対応するリソース名の一覧が表示されます。
・ [ボタン]タブでボタンのプロパティを設定するとき、[ツールチップ]にボタンの説明文字列を設定しておくと、実行時にマウスポイ ンタをボタン上に移動したとき、各ボタンに対応する説明をツールチップとして表示することができます。
8.7.4 ツールバーのボタンがクリックされたときの手続きを記述する
ツールバーのボタンがクリックされたときの手続きは、ツールバーコントロールのButtonClickイベントに記述します。このサンプルプログ ラムでは、ボタンのインデックスが1から順に、メニュー項目の"MN-OPEN-Click"、"MN-SAVE-Click"および"MN-PRINT-Click"の手 続きと同様の手続きを実行します。ButtonClickイベントでは、クリックされたボタンのインデックスが引数に設定されているため、その値 を判別して処理を切り分けます。
MainForm-MouseUp
ENVIRONMENT DIVISION.
DATA DIVISION.
WORKING-STORAGE SECTION.
01 GET-STYLE PIC S9(4) COMP-5.
01 BUTTON-STATE PIC S9(4) COMP-5.
LINKAGE SECTION.
01 POW-BUTTONINDEX PIC S9(9) COMP-5.
PROCEDURE DIVISION USING POW-BUTTONINDEX.
EVALUATE POW-BUTTONINDEX WHEN 1
* ツールバーの開くボタンがクリックされた場合です。
MOVE POW-CDOPEN TO GET-STYLE
CALL "GET-FILE-NAME" USING GET-STYLE BUTTON-STATE IF BUTTON-STATE = POW-FALSE THEN
EXIT PROGRAM END-IF
CALL "LOAD-DATA"
WHEN 2
* ツールバーの保存ボタンがクリックされた場合です。
IF FILE-NAME = SPACE THEN
IF BUTTON-STATE = POW-FALSE THEN EXIT PROGRAM
END-IF END-IF
CALL "SAVE-DATA"
WHEN 3
* ツールバーの印刷ボタンがクリックされた場合です。
INVOKE CmPrint1 "PrintForm"
END-EVALUATE
ポイント
ツールバーコントロールには、テキストボックスコントロールやコンボボックスコントロールなど他のコントロールを配置して利用すること もできます。コンボボックスコントロールを使用した例は、サンプルプログラム"Toolbar\Toolbar.ppj"を参照してください。