[All]
C++Builder 2009 ファーストガイド 第八回 「コンポーネント」
By: Chikako Yonezawa
Abstract: C++Builder 2009 のコンポーネントの概要とその操作について説明します。
このファーストガイドは、これから C++Builder 2009を使い始める初心者の方を対象に 10回に分けて基本的な事項を説明していきます。
第八回は、コンポーネントの概要とその操作について説明します。
1.コンポーネントとは
TComponentから派生したクラスを「コンポーネント」といい、フォームやデータモジュールにコンポーネントを配置して設計時に操作することが可能です。コンポーネントは、主にビジュアルコンポーネントと非ビジュアルコンポーネントに分類されます。
1.1ビジュアルコンポーネント（コントロール）
実行時のフォーム上に表示されるコンポーネント。例えば TButtonや TMemoがこれに該当します。
TControlから派生したコントロールは、GUIアプリケーションで使用され、その実行時に目に見える形で表示されます。
1.2非ビジュアルコンポーネント
実行時に表示されないコンポーネント。例えば TDataSourceなどのデータベース関連のコンポーネントがこれに該当します。
設計時にはアイコンの形で表示されます。
2.グループ化(コンテナコンポーネント)
コンポーネントは、フォームなどの親となるコンポーネント上に配置します。関連のあるコントロールをグループに分けて親となるコンポーネント上に配置すると、使いやすさが向上します。
グループ化を行う親となるコンポーネントをコンテナコンポーネントと呼びます。
例えば、フォーム上にコンテナコンポーネントである TPanelを貼り、TPanelの上に TButtonをいくつか配置します。TPanelを移動すると、子コンポーネントである TPanel上の TButtonも、親である TPanel内の相対位置を保持したまま一緒に移動します。
このようなコンテナコンポーネントには、他に、TGroupBox TPanel TRadioGroup TScrollBox TTabControl TPageControl THeaderControlなどがあります。
3.プロパティ
第四回「プログラミング手順」で触れましたが、プロパティとは、コンポーネントの外観や性質を設定できる属性のことを示します。たとえば、フォームの上部に表示される文字列は、フォームの Captionプロパティ、文字のフォントについては Colorプロパティで設定することができます。
3.1プロパティの設定
設計時にコンポーネントのプロパティを設定するには、オブジェクトインスペクタを使用します。
使用者は、オブジェクトインスペクタに表示されたプロパティを選択し、
- 参照符ボタン[…]を押してプロパティエディタを使用する
などの方法でプロパティの値を変更します。
オブジェクトインスペクタ上で変更された内容は、すぐにデザイナ上に反映されるので、使用者は、変更された状態の画面を逐次確認することができます。
また、プロパティは設計時だけではなく、コードを記述することで実行時にも設定できます。
以下はフォームのキャプションを変更する場合のコード例となります。
Form1->Caption = “キャプションを変更”;
3.2 主なプロパティ
各コンポーネントには多くの共通のプロパティがあります。主なものについて以下の表に記します。
プロパティ名 |
説明 |
Action |
アクションをコンポーネントに関連付けます |
Align |
親(コンテナ)コンポーネント内でコンポーネントを揃える方法を指定します |
Alignment |
コンポーネント内のテキストの横方向の配置を制御します |
AlignWithMargins |
コンポーネントをマージンで制約するかを示します |
Anchors |
コンポーネントがその親に対してどのようにアンカー設定されるかを指定します |
BiDiMode |
コンポーネントの双方向モードを指定します |
Caption |
コンポーネントのラベルとして表示される文字列を指定します |
Color |
コンポーネントの色を指定します |
Constraints |
コンポーネントのサイズ制約を指定します |
Cursor |
コンポーネントの対象座標上にマウスがあるときにマウスポインタの表示に使用するイメージを指定します |
CustomHint |
コンポーネントのカスタムヒント |
Enabled |
コンポーネントが、マウス・キーボード・タイマーのいずれかのイベントに応答するかどうかを制御します |
Font |
コンポーネントに表示するフォントの属性を制御します |
Height |
コンポーネントの縦方向のサイズをピクセル数で指定します |
HelpContext |
状況感知型ヘルプトピックに対するコンポーネントの数値IDです |
HelpKeyword |
状況感知型ヘルプトピックに対するコンポーネントのキーワードです |
HelpType |
コンポーネントの状況感知型ヘルプトピックをコンテキストIDで識別するか、キーワードで指定するかを示します |
Hint |
マウスがコンポーネント上を移動するときに表示されるテキスト文字列を保持します |
Left |
コンポーネントの左端の水平座標を親に対する相対距離で指定します |
Margins |
コンポーネントのマージンを指定します |
Name |
コンポーネントを参照するときの名前を指定します |
Parent |
コンポーネントの親を設定します |
ParentBiDiMode |
コンポーネントが親の BiDiModeを使用するかどうかを指定します |
ParentFont |
コンポーネントが親のコンポーネントと同じフォントを使用するかどうかを指定します |
PopupMenu |
コンポーネントに関連付けられているポップアップメニューを表示します |
ShowHint |
マウスポインタをコンポーネント上に置いたときに、コンポーネントのヒントを表示するかどうかを制御します |
Text |
コンポーネントに関連付けられているテキスト文字列を保持します |
Top |
コンポーネントの左隅の垂直座標を親に対する相対距離で指定します |
Visible |
コンポーネントを画面上に表示するかを制御します |
Width |
コンポーネントの水平サイズをピクセル単位で指定します |
|
|
注意: 上記のプロパティがすべてのコンポーネントに存在する訳ではありません。また、それぞれのプロパティについての詳細は、製品付属のヘルプ、および弊社ドキュメントセンターからダウンロード可能なヘルプドキュメントをご利用下さい。
3.3プロパティの設定例
実際にフォーム上にコンポーネントを配置し、上記のそれぞれの方法にてプロパティを変更してみましょう。
- IDEのメニューから [ファイル | 新規作成 | VCLフォームアプリケーション – C++Builder]を選択します。デザイナが開き、何もコンポーネントが追加されていない状態のフォームが表示されます。
- ツールパレットの Standardの横の +ボタンをクリックし、Standardカテゴリを開きます。
- TMemoをマウスでダブルクリックします。フォーム側に Memoコンポーネントが置かれます。
- Memoコンポーネントをマウスで左上の方に移動させ、フォームの幅に合わせて幅を広げます。
- ツールパレットの TButtonをマウスでダブルクリックします。するとフォーム側に Buttonコンポーネントが置かれます。
- Buttonコンポーネントをマウスで Memoコンポーネントの下の適当な位置に移動します。
- Buttonコンポーネントに表示されている文字を変更します。マウスで Buttonコンポーネントを選択し、オブジェクトインスペクタの Captionプロパティをマウスで選択すると、「Button1」と表示されている部分の色が反転し、変更可能となりますので、キーボードから「色変更」と入力します。フォーム上の Buttonコンポーネントの文字が「Button1」から「色変更」に変わります。
- Memoコンポーネントの色を変えます。マウスで Memoコンポーネントを選択し、オブジェクトインスペクタ上の Colorプロパティをマウスで選択すると▼ボタンが表示されます。この▼ボタンを押すとドロップダウンリストが表示されるので、表示されたドロップダウンリストから clSkyBlueを選択します。フォーム上の Memoコンポーネントの色が選択した色に変わります。
- Memoコンポーネントに表示されている文字を変更します。マウスで Memoコンポーネントを選択し、オブジェクトインスペクタの Linesプロパティをマウスで選択すると (TStrings)と反転表示された文字の横に参照符ボタン[…]が表示されます。この[…]ボタンを押すと、文字列リストの設定のプロパティエディタが表示されます。
- 表示された文字列リストのプロパティエディタ内の「Memo1」の文字列を、「自由に入力できます」に変えて [OK]ボタンを押します。フォーム上の Memoコンポーネント内に表示されている文字列が「Memo1」から「自由に入力できます」に変わります。
このように設計時にコンポーネントのプロパティの値を変更する場合は、コンポーネントを選択して、オブジェクトインスペクタ上のプロパティを変更するという手順で行います。
この段階で IDEのメニューから [プロジェクト | すべてのプロジェクトをビルド]を選択して、この作成したフォーム(VCLアプリケーション)を実行することができます(実行したアプリケーションはフォームの右上にある×ボタンを押すことで終了し、設計画面に戻ります)。ただし、ボタンをクリックしても何の動作も発生しませんし、Memoコンポーネントの中に入力した文字列は、アプリケーションの終了とともにクリアされます。
フォーム上のボタンをクリックした際に、何か動作をさせたい場合には、「イベント」を設定する必要があります。
4.イベントとイベントハンドラ
何らかの動作によって発生する事象をイベントといい、イベントに直接応答するコードをイベントハンドラと呼びます。
例えば、「ボタンをクリックする」はイベントであり「ボタンをクリックしたときに実行されるコード」がイベントハンドラとなります。
多くのコンポーネントにはイベントが定義されており、そのイベントは、オブジェクトインスペクタの[イベント]タブをクリックすることで表示されます。また、一部のコンポーネントはデフォルトのイベントを持っており、デザイナ上でコンポーネントをダブルクリックすることで、デフォルトのイベントハンドラが生成されます。
4.1 主なイベント
各コンポーネントには多くの共通のイベントがあります。主なものについて以下の表に記します。
イベント名 |
説明 |
OnClick |
コンポーネントをクリックしたときに発生します |
OnDblClick |
マウスポインタがコンポーネント上にある時点で、マウスの左ボタンをダブルクリックしたときに発生します |
OnEnter |
コンポーネントがフォーカスを受け取ったときに発生します |
OnExit |
コンポーネントがフォーカスを失ったときに発生します |
OnKeyDown |
コンポーネントがフォーカスを持っている状態で、キーボードが押されたときに発生します |
OnKeyPress |
コンポーネントがフォーカスを持っている状態で、文字として表せるキーが押されたときに発生します |
OnKeyUp |
コンポーネントがフォーカスを持っている状態で、押されていたキーが放されると発生します |
OnMouseDown |
マウスボタンを押したときに発生します |
OnMouseEnter |
コンポーネント上にマウスを移動したときに発生します |
OnMouseLeave |
コンポーネント外にマウスが移動したときに発生します |
OnMouseMove |
マウスポインタをコンポーネント上に置いて、マウスポインタを移動したときに発生します |
OnMouseUp |
押したマウスボタンから指を離したときに発生します |
OnMouseWheel |
マウスホイールが回転したときに発生します |
OnMouseWheelDown |
マウスホイールが下に回転したときに発生します |
OnMouseWheelUp |
マウスホイールが上に回転したときに発生します |
OnResize |
コンポーネントのサイズが変更された直後に発生します |
WindowProc |
コンポーネントに送られたメッセージに応答するウィンドウプロシージャを示します |
|
|
注意: 上記のイベントがすべてのコンポーネントに存在する訳ではありません。また、それぞれのイベントについての詳細は、製品付属のヘルプ、および弊社ドキュメントセンターからダウンロード可能なヘルプドキュメントをご利用下さい。
4.2イベントハンドラの設定例 – デフォルトのイベント
プロパティの設定例で作成したフォームを使用して、ボタンを押した際に発生するイベントに、プロパティを変更するコードを記載して、その動作を確認します。
- デザイナ上で[色変更]と書かれているボタンをマウスでダブルクリックします。TButtonコンポーネントはデフォルトのイベントとしてクリックのイベントを持っています。そのため、デザイナ上でダブルクリックすると自動的にクリックイベント(OnClick)のイベントハンドラが生成され、コードエディタが表示されます。
- 表示されたイベントハンドラ内に、TMemoコンポーネントの色を変更するコードを記述していきます。まず、Memoと記述したところで [Ctrl + Space]キーを押すと、コード補完の機能が働き、候補のリストが表示されます。補完リストより Memo1を選択して、Enterキーを押すと、選択されたコードがコード内に代入されます。
- Memoコンポーネントのプロパティを設定するため ->を記述するとコード補完のリストが表示されますので、Colorプロパティを選択します。
- Colorプロパティに、色を設定するため = を入力後、clと入力し、再度 [Ctrl + Space]キーを押します。
- 色の一覧が表示されますので clWhiteを選択して Enterキーを押し、コードに代入します。最後にコードの終端を表す ; を入力します。
- この作業でイベントハンドラ内に記載されたコードは以下となります。
Memo1->Color = clWrite;
- 実行し動作を確認してみましょう。メニューから [実行|実行]を選択します。
- プロジェクトがコンパイルビルドされ、作成したフォームが表示されます。
- 表示されたフォーム上の [色変更]のボタンをマウスでクリックします。
- Memoコンポーネントの色が変更されます。
4.3イベントハンドラの設定例 – オブジェクトインスペクタから設定する
では、次に、オブジェクトインスペクタを使用してイベントを設定してみましょう。
- 実行しているアプリケーションをフォームの右上にある×ボタンを押して終了します。
- 設計画面に戻りますので、ツールパレットから別のボタンをフォーム上に貼り付けます。
- 新しく追加したボタンを選択し、オブジェクトインスペクタの [イベント]タブをクリックします。
- TButtonコンポーネントに設定されているイベントがいくつか表示されているのが確認できます。
- OnClickをマウスで選択し、その右側の空白部分をマウスでダブルクリックすると、自動的にイベントハンドラが生成され、コードエディタに画面が切り替わります。
- 先程と同様に、Memoコンポーネントの色を変えるコードを記述します。今度は色を Aquaに設定した以下のコードを記述します。
Memo1->Color = clAqua;
- 実行し動作を確認してみましょう。メニューから[実行|実行]を選択し、表示されたフォーム上の追加したボタンをマウスでクリックします。
- Memoコンポーネントの色が変更されます。
4.4イベントハンドラの設定例 – 既に定義されているイベントを利用する
別のコンポーネントで、既に設定したイベントハンドラと同じ動作を実行する場合、同じ内容をいくつも記述するのは大変です。既に設定したイベントハンドラを割り当てることにより、同じコードをいくつも記載する必要がなくなります。
では、新しいボタンのイベントハンドラに最初のボタンに設定したイベントハンドラを設定してみましょう。
- 実行しているアプリケーションをフォームの右上にある×ボタンを押して終了します。
- 設計画面に戻りますので、ツールパレットから別のボタンをフォーム上に貼り付けます。
- 新しく追加したボタンを選択し、オブジェクトインスペクタの [イベント]タブをクリックします。
- TButtonコンポーネントに設定されているイベントの OnClickをマウスで選択し、その右側の▼印をマウスでクリックすると、既に設定されているイベントハンドラの名前がリスト表示されます。
- リスト表示されているイベントハンドラから Button1Clickを選択します。この操作により、新しく追加したボタンを Clickすると、Button1コンポーネントの Clickイベントが実行されます。
- 実行し動作を確認してみましょう。メニューから[実行|実行]を選択し、表示されたフォーム上の追加したボタンをマウスでクリックします。
- Memoコンポーネントの色が変更されます。
あとがき
第八回は、コンポーネントの概要と、コンポーネントの操作について説明いたしました。
第九回は「コンポーネントの作成」。C++Builderでは既存のコンポーネントの機能拡張や、新たなコンポーネントの作成を行うことができます。次回は既存のコンポーネントをベースにして新たなコンポーネントを作成し、その作成したコンポーネントを使用する方法について説明する予定です。
Connect with Us