Edited at

Delphi Community Edition Meet up ! - FireDAC FireMonkey 編

More than 1 year has passed since last update.

これは、2018年8月3日に行なった Delphi Community Edition Meet up ! で行なったデータエクスプローラのデモで、FireDAC 接続を使って、サラッとデータを表示する FireMonkey アプリケーションを作った際の説明です

データエクスプローラは、アプリケーションの作成の時にも効力を発揮します

予め接続する先のデータベースが決まっているのであれば、データエクスプロラー上に接続情報を作成しておくことで、必要なプロパティが設定されたコンポーネントを生成してくれます


デモで行なったこと

FireMonkey アプリケーションを新規に作成して、ノンコーディングでデータを表示するアプリケーションを作り実行しました


デモの手順


1. FireMonkey の新規アプリケーションを作成します

Delphi のメニューから「ファイル|新規作成|マルチデバイスアプリケーション - Delphi」を選択して、その後に表示されるダイアログで「空のアプリケーション」を選択します

firedac02_1.gif


2. データエクスプローラから接続設定をフォーム上にドラックアンドドロップして、接続に必要なコンポーネントを生成します

データエクスプローラ側の設定等については Delphi Community Edition Meet up ! - データエクスプローラ編 を参照してくださいませ

このデモでは、データエクスプローラ上の Local DB (dbdemos.gdb) 内の BIOLIFE テーブルを使用しています

データエクスプローラ上で Local DB に接続して、BIOLIFE テーブルをドラックしてフォーム上にドロップします

firedac02_2.gif

この動作によって、フォーム上に予め接続設定が行なわれている Local Connection (TFDConnection) と、Biolife Table (TFDQuery) が自動生成されます


3. フィールドエディタに、テーブルのフィールドを追加します

Biolife Table コンポーネントをマウスで選択して、マウスの右ボタンをクリックします

ポップアップメニューから「フィールドエディタ」を選択します

表示されたフィールドエディタ上でマウスの右ボタンをクリックします

ポップアップメニューから「すべてのフィールドを追加」を選択します

オブジェクトインスペクタ上で、Biolife Table (TFDQuery) の Active プロパティが True になっていない場合は True にして、データベースのテーブルと接続しておきます

firedac02_3.gif

設計時でも接続できるってスゴイ!


4. データを表示するためのコンポーネントを追加する

ツールパレットから TStringGrid と TEdit を追加します

firedac02_4.gif

時間が無かったので、ざっとデータを確認できる TStringGrid と、カレントのデータが分かるように TEdit を使いました


5. Visual Live Binding を使ってコンポーネントとデータを結びつける

FireMonkey の場合は、VCL とは異なり、データセット上のデータを扱うためのコンポーネントは決まっていません

コンポーネントのプロパティで扱える型と、データ型があっていれば、データを表示できるからです

なので、フィールドエディタからドラッグアンドドロップで、フィールドをフォーム上に配置することはできません

ここでは、コンポーネントとデータの結びつけを行なうため Visual Live Binding の機能を使用しています

Visual Live Binding については、以前ここで書いたので参照してくださいね

オブジェクトインスペクタ上の「ビジュアルにバインド」のリンクをクリックします

LiveBinding デザイナが開きます

Biolife Table の * の箇所と、StringGrid1 の * の箇所をマウスで線を引くように結び付けます

Biolife Table の SPECIES_NO と、Edit1 の Text プロパティの箇所をマウスで線を引くように結び付けます

これでバインドが完了です

firedac02_5.gif

データベースのデータとバインドを行なうと、その情報を保持する TBindSourceDB が自動生成されます


6. ナビゲータを追加して、設定する

カレントのデータだけ見せるだけだと、面白くないので、データを前後に送るためのナビゲータを追加します

Visual Live Binding の際に自動的に生成された BindSourceDB1 フォーム上で選択して、マウスの右ボタンをクリックします

表示されたポップアップから「ナビゲータの追加」を選択すると、データと Bind 済みのナビゲータコンポーネントが追加されます

firedac02_6.gif


7. 実行する

あとは実行するだけ

ナビゲータを操作するとカレントのカーソルが動きます

firedac02_7.gif


あとがき

今回は簡単なデモでしたので、フォームにそのままペタペタ貼りましたが、データモジュールを使って、ロジックと UI を分けた方がベターです(拡張や修正の面からも)