FireMonkey コンポーネントのコンポーネントエディタおよびプロパティエディタを作成する

このチュートリアルでは、FireMonkey コンポーネント用のプロパティエディタとコンポーネントエディタを作成します。

これらのエディタの親コンポーネントは、関連チュートリアル「既存のコンポーネントを拡張してスタイル付きの FireMonkey コンポーネントを作成する」のコンポーネント TClockLabel です。ここでは、TClockLabel が作成済みだと想定して説明を始めます。

TClockLabel コンポーネント：

コンポーネントエディタは、コンポーネントをダブルクリックするか、コンポーネントを右クリックしてコンテキストメニューで［Show Editor］を選択すると開くことができる、IDE の機能です。

カスタムコンポーネントからコンポーネントエディタを開く：

ダイアログとして開くコンポーネントエディタの例：

1 ステップ 1：設計時パッケージを作成する
2 ステップ 2：プロパティを編集するための FireMonkey HD フォームを追加する
3 ステップ 3：コンテキストメニューからダイアログボックスを開くためのコンポーネントエディタを作成する
4 ステップ 4：［オブジェクトインスペクタ］からダイアログボックスを開くためのプロパティエディタを作成する
- 4.1 プロパティエディタの属性を設定する
5 関連項目

プロパティエディタは、［オブジェクトインスペクタ］から別のダイアログとして開いてプロパティ（またはプロパティ群）を編集するために提供できる、IDE の機能です。

［オブジェクトインスペクタ］からプロパティエディタを開くには、プロパティの値の列にある参照（［...］）ボタンをクリックします。

［オブジェクトインスペクタ］からプロパティエディタを開く：

このチュートリアルのコンポーネントエディタとプロパティエディタでは、同じダイアログボックスを開いて TClockLabel コンポーネントの Format プロパティを編集します。

ステップ 1：設計時パッケージを作成する

プロパティエディタやコンポーネントエディタを作成するには、そのプロパティエディタを含む設計時パッケージが必要です。

［プロジェクトマネージャ］で ClockLabelProjectGroup を右クリックし、コンテキストメニューから［新規プロジェクトを追加...］を選択します。
［ファイル｜新規作成｜その他...｜Delphi プロジェクト］を選択します。
その後、［新規作成］ダイアログボックスで［パッケージ］を選択します。
このパッケージを dclClockLabel という名前で保存します。
dclClockLabel に対して［プロジェクト｜オプション...｜説明］を選択します。
ここで、作成するパッケージの種類を選択することができます。［用途に関するオプション］で［設計時のみ使用可能］を選択します。

ステップ 2：プロパティを編集するための FireMonkey HD フォームを追加する

ダイアログボックスで TClockLabel コンポーネントのプロパティを編集するには、プロパティを編集できるフォームを追加する必要があります。

dclClockLabel プロジェクトがアクティブであることを確認します。アクティブでなければ、dclClockLabelproject プロジェクトをダブルクリックしてアクティブプロジェクトにします。
［ファイル｜新規作成｜その他...｜Delphi ファイル｜マルチデバイスフォーム］を選択します。
このフォームが FireMonkey 用かを確認する画面が開くので、［はい］を選択します。
新しく作成したフォームを ClockLabelDialog という名前で保存します。
［オブジェクトインスペクタ］で、フォームの Name を ClockLabelDlg に変更します。
FireMonkey コントロールをいくつか追加して構成し、ダイアログのルックアンドフィールを変更して、次の画像のようにします。

フォームを右クリックしてコンテキストメニューから［エディタで表示］を選択すると、.FMX ファイルのコードは次のようになっています。

 object ClockLabelDlg: TClockLabelDlg
  Left = 0
  Top = 0
  Caption = 'Designer for Clock Label'
 ClientHeight = 136
 ClientWidth = 383
  Visible = False
 StyleLookup = 'backgroundstyle'
 object ClockLabel1: TClockLabel
 Position.Point = '(104,96)'
    Width = 257.000000000000000000
    Height = 15.000000000000000000
 TabOrder = 0
    Text = '5/8/2012 1:50:42 PM'
    Format = 'c'
 end
 object EditFormat: TEdit
 Position.Point = '(16,52)'
    Width = 233.000000000000000000
    Height = 22.000000000000000000
 TabOrder = 1
 KeyboardType = Default
    Password = False
 end
 object Label1: TLabel
 Position.Point = '(16,32)'
    Width = 177.000000000000000000
    Height = 15.000000000000000000
 TabOrder = 2
    Text = 'DateTime Format for ClockLabel:'
 end
 object btnOK: TButton
 Position.Point = '(280,24)'
    Width = 80.000000000000000000
    Height = 22.000000000000000000
 TabOrder = 3
 ModalResult = 1
    Text = 'OK'
    Default = True
 end
 object btnCancel: TButton
 Position.Point = '(280,56)'
    Width = 80.000000000000000000
    Height = 22.000000000000000000
 TabOrder = 4
 ModalResult = 2
    Text = 'Cancel'
    Cancel = True
 end
 object btnPreview: TButton
 Position.Point = '(16,92)'
    Width = 80.000000000000000000
    Height = 22.000000000000000000
 TabOrder = 5
    Text = 'Preview'
 end
 end

7. 編集ボックス（EditFormat）を選択し、その OnChange イベントハンドラを EditFormatChange という名前で作成します。

  procedure TClockLabelDlg.EditFormatChange(Sender: TObject);
  begin
    ClockLabel1.Format := EditFormat.Text;
  end;

8. このパッケージのコンパイルを成功させるには、［Requires］セクションに以下のパッケージを追加する必要があります。

fmx
ClockLabel
designide

9. パッケージをコンパイルします。

ステップ 3：コンテキストメニューからダイアログボックスを開くためのコンポーネントエディタを作成する

コンポーネントエディタは TComponentEditor を継承したクラスです。

以下のようにして、新しいユニットを作成し、その中にクラスを作成します。

新しいユニットを作成し、ClockLabelEditors.pas という名前で保存します。
以下の 2 つのユニットの参照を uses 句に追加します。

uses
  DesignEditors, DesignIntf;

3. 新しいクラスを TComponentEditor のサブクラスとして作成します。

type
  TClockLabelComponentEditor = class(TComponentEditor)
  end;

コンテキストメニューを追加する

先ほど説明したように、コンポーネントエディタでは、ターゲットであるコンポーネントのコンテキストメニューを表示することができます。ユーザーがコンポーネントを右クリックすると、コンポーネントエディタの GetVerbCount メソッドと GetVerb メソッドが呼び出されて、コンテキストメニューが作成されます。

この 2 つのメソッドを次のようにオーバーライドして、コンテキストメニューにコマンド（Verb）を追加することができます。

type
  TClockLabelComponentEditor = class(TComponentEditor)
  public
    function GetVerbCount: Integer; override;
    function GetVerb(Index: Integer): string; override;
  end;

function TClockLabelComponentEditor.GetVerbCount: Integer;
begin
  Result := 1;
end;

function TClockLabelComponentEditor.GetVerb(Index: Integer): string;
begin
  case Index of
    0: Result := '&Show Editor';
  else
    raise ENotImplemented.Create('TClockLabelEditor has only one verb (index = 0) supported.');
  end;
end;

コマンドを実装する

GetVerb に記述したコマンドをデザイナで選択すると、ExecuteVerb メソッドが呼び出されます。GetVerb メソッドに記述したコマンドそれぞれについて、ExecuteVerb メソッド内でアクションを実装しなければなりません。編集対象のコンポーネントには、エディタの Component プロパティを使ってアクセスすることができます。先ほど定義したダイアログを開くには、ClockLabelDIalog ユニットへの参照を追加する必要があります。

type
  TClockLabelComponentEditor = class(TComponentEditor)
  private
    procedure ShowDesigner;
  public
    procedure ExecuteVerb(Index: Integer); override;
  end;


procedure TClockLabelComponentEditor.ShowDesigner;
var
  DesignerForm: TClockLabelDlg;
begin
  DesignerForm := TClockLabelDlg.Create(nil);
  try
    // Set curent value to designer form
    DesignerForm.ClockLabel1.Format := (Component as TClockLabel).Format;
    DesignerForm.EditFormat.Text    := (Component as TClockLabel).Format;

    // Show ModalForm, and then take result
    if DesignerForm.ShowModal = mrOK then
      (Component as TClockLabel).Format := DesignerForm.ClockLabel1.Format;

    Designer.Modified;
  finally
    DesignerForm.Free;
  end;
end;

procedure TClockLabelComponentEditor.ExecuteVerb(Index: Integer);
begin
  case Index of
    0: ShowDesigner;
  else
    raise ENotImplemented.Create('TClockLabelEditor has only one verb (index = 0) supported.');
  end;
end;

コンポーネントエディタを IDE に登録する

コンポーネントエディタを IDE に登録するには、次のようにして Register 手続きから RegisterComponentEditor ルーチンを呼び出す必要があります。

procedure Register;
begin
  RegisterComponentEditor(TClockLabel, TClockLabelComponentEditor);
end;

パッケージをビルドしてインストールすると、新しいコンポーネントエディタを使用できるようになります。

TestClockLabelUnit に戻って TClockLabel でコンテキストメニューを開きます。［Show Editor］コマンドが表示されるはずです。

ステップ 4：［オブジェクトインスペクタ］からダイアログボックスを開くためのプロパティエディタを作成する

プロパティエディタを作成するステップは、コンポーネントエディタを作成するステップとほとんど同じです。

プロパティエディタは TPropertyEditor のサブクラスです。標準の TPropertyEditor クラスの他に、designide ユニットではいくつかの便利なクラスが定義されています。Format プロパティは文字列値なので、このサンプルでは TPropertyEditor のサブクラスである TStringProperty を基底クラスに使用します。

プロパティエディタの属性を設定する

プロパティエディタでは、どのツールを表示するかを［オブジェクトインスペクタ］が判断できるよう情報を提供しなければなりません。たとえば、［オブジェクトインスペクタ］には、プロパティにサブプロパティがあるかどうかや、取り得る値のリストを表示できるかどうかなどの情報が必要です。

エディタの属性を指定するには、プロパティエディタの GetAttributes メソッドをオーバーライドする必要があります。 GetAttributes は、値の集合（TPropertyAttributes 型）を返すメソッドです。このチュートリアルでは、GetAttributes から [paDialog] を返して、ダイアログボックスを使用できることを IDE に伝えます（使用可能な値の一覧は「エディタの属性を指定する」を参照）。

IDE では、ダイアログボックスを開くためにプロパティエディタの Edit メソッドを呼び出します。そのため、コードは次のようになります。

TClockLabelPropertyEditor = class(TStringProperty)
private
  procedure ShowDesigner;
public
  function GetAttributes: TPropertyAttributes; override;
  procedure Edit; override;
end;

{ TClockLabelPropertyEditor }

function TClockLabelPropertyEditor.GetAttributes: TPropertyAttributes;
begin
  Result := [paDialog];
end;

procedure TClockLabelPropertyEditor.Edit;
begin
  ShowDesigner;
end;

procedure TClockLabelPropertyEditor.ShowDesigner;
var
  DesignerForm: TClockLabelDlg;
begin
  DesignerForm :=TClockLabelDlg.Create(nil);
  try
    // Set curent value to designer form
    DesignerForm.ClockLabel1.Format := GetStrValue;
    DesignerForm.EditFormat.Text    := GetStrValue;

    // Show MordalForm, and then take result
    if DesignerForm.ShowModal = mrOK then
      SetStrValue(DesignerForm.ClockLabel1.Format);
  finally
    DesignerForm.Free;
  end;
end;

最後に、先ほど新しいコンポーネントエディタを登録したように、新しいプロパティエディタを登録する必要があります。それには、Register 手続きに RegisterPropertyEditor の呼び出しを追加します。

  RegisterPropertyEditor(TypeInfo(string), TClockLabel, 'Format', TClockLabelPropertyEditor);

FireMonkey コンポーネントのコンポーネントエディタおよびプロパティエディタを作成する

目次

ステップ 1：設計時パッケージを作成する

ステップ 2：プロパティを編集するための FireMonkey HD フォームを追加する

ステップ 3：コンテキストメニューからダイアログボックスを開くためのコンポーネントエディタを作成する

コンテキストメニューを追加する

コマンドを実装する

コンポーネントエディタを IDE に登録する

ステップ 4：［オブジェクトインスペクタ］からダイアログボックスを開くためのプロパティエディタを作成する

プロパティエディタの属性を設定する

関連項目

案内メニュー

個人用ツール

名前空間

変種

表示

その他

検索

RAD Studio 11 Alexandria

RAD Studio 11 トピック

他言語版

以前のバージョン

Assistance

ツール

FireMonkey コンポーネントのコンポーネント エディタおよびプロパティ エディタを作成する

目次

ステップ 1：設計時パッケージを作成する

ステップ 2：プロパティを編集するための FireMonkey HD フォームを追加する

ステップ 3：コンテキスト メニューからダイアログ ボックスを開くためのコンポーネント エディタを作成する

コンテキスト メニューを追加する

コマンドを実装する

コンポーネント エディタを IDE に登録する

ステップ 4：［オブジェクト インスペクタ］からダイアログ ボックスを開くためのプロパティ エディタを作成する

プロパティ エディタの属性を設定する

関連項目

案内メニュー

検索

FireMonkey コンポーネントのコンポーネントエディタおよびプロパティエディタを作成する

ステップ 3：コンテキストメニューからダイアログボックスを開くためのコンポーネントエディタを作成する

コンテキストメニューを追加する

コンポーネントエディタを IDE に登録する

ステップ 4：［オブジェクトインスペクタ］からダイアログボックスを開くためのプロパティエディタを作成する

プロパティエディタの属性を設定する