Delphi Programming / Object Pascal
サイトのトップページへ リンクのページへ ロゴマーク
[掲載 2020年12月18日] [更新 2020年12月18日]
FireMonkey の TEdit の背景色を設定する方法
動作確認等 Windows 7 U64(SP1) + Delphi 10.3.3 Community FMX-32



VCL の TEdit は Windows の Edit のラッパークラスです。Color プロパティがあり TEdit コントロールの背景色が変更できます。
FireMonkey フレームワークはマルチデバイス用のアプリ開発用です。そのため、より柔軟な設定ができるようになっています。その 1 つが TLayout を使用したスタイルの設定です。この Layout の機能は、設定時に設定する場合は、TLayout そのものを意識する必要はありません。以下は TEdit の背景色を変更する例です。

FireMonkey のコントロールは、どのコントロールでも親子関係を設定できます。TRectangel (矩形描画用コントロール - Shapes タブ) を配置して、TEdit の親とすることはできますが、TEdit の背景色は白てす。したがって、TEdit と重なった領域の TRectangle は見えなくなってしまいます。
そこで、TRectangle を TEdit の background オブジェクト、あるいは content オブジェクトの子コントロールにする方法を利用します。VCL の TEdit でこのような機能を実現するには複雑なコーディングが必要でしたが、FirerMonkey では次のようにして設計時に設定できます。


  • [ファイル] [新規作成] [マルチデバイスアプリケーション] を選択
  • [空のアプリケーション] を選択
  • フォームに TEdit を配置
  • その TEdit を選択した状態でマウスの右ボタンクリックで [カスタムスタイルの編集] を選択

すると、下図の [スタイルデザイナ] の画面になります。




構造ペインの [Edit1Style1] をダブルクリックして展開します。コンポーネントパレットの Shapes タブにある TRectangle を [background] までドラッグしてドロップします。
削除する時は、追加したオブジェクトを選択して、左上の削除アイコンをクリックします。



構造ペインの [Rectangle1Style] を選択してオブジェクト・インスペクタで以下の設定をします。

  • Align を Client に
  • HitTest を False に
  • Fill.Color を適当な色に

TRectangle を TEdit の background オブジェクトの子コントロールに設定したので、Aiign でサイズを親と同じにします。HitTest を False にして、キー操作やマウス操作を透過して background オブジェクトが受け取れるようにします。後は必要に応じてオブジェクト・インスペクタで設定します。
コンパイルして実行する前に、設定したスタイルを適用することを忘れないでください。適用しないと、設定内容が反映されません。
この [スタイルの適用] は、設計時の適用です。保存はしません。




下図は実行例です。
TRectangle の枠線は、Stroke.Kind の値を None にすれば描画しません。TEdit の枠線を見えるようにするには TRectangle の Margin の値を上下左右共に 1 以上にします。




TRectangle を content オブジェクトの子コントロールにすると下図のようになります。content は、TEdit の編集領域のことです。




上の手順で背景色を設定した TEdit の背景色を、実行時に変更する例です。FindStyleResource メソッドで対象のオブジェクトを取得して、そのオブジェクトのプロパティを設定します。
下図がその結果ですが、このサンプルでは、TEdit の枠線を表示するようにしています。また、比較のために、背景色を変更しないデフォルトの TEdit を配置しています。 




procedure TForm1.Button1Click(Sender: TObject);
var
  LEditRectangle : TFmxObject;
begin
  // 対象のオブジェクトを取得する
  LEditRectangle := Edit1.FindStyleResource('Rectangle1Style');

  if Assigned(LEditRectangle) then begin
    // オブジェクトのプロパティを設定する
    // TRectangle の使用には uses に FMX.Objects が必要
    TRectangle(LEditRectangle).Fill.Color := TAlphaColorRec.Burlywood;
  end;
end;