このチュートリアルに必要なソフトウェアとファイル

このチュートリアルでは、コンピュータに次のソフトウェアをインストールしておく必要があります。

• NetBeans IDE 6.0 ( ダウンロード )
• Java Standard Development Kit (JDK) version 5.0 または 6.0 (ダウンロード)
• Java DB データベースサーバー (Java DB は JDK 6 に含まれます)
• SQL スクリプト (http://usersguide.netbeans.org/files/documents/40/1423/car.sql)
• CarPreview プロジェクト (http://usersguide.netbeans.org/files/documents/40/1433/CarPreview.zip)

データベースの設定

IDE でデスクトップの CRUD (作成、読み取り、更新、削除) アプリケーションの作成を開始する前に、アプリケーションで使用するデータベースに IDE を接続する必要があります。事前に接続を設定しておくと、データベースをアプリケーションに自動的にバインドする IDE の機能を利用できます。

このチュートリアルでは、Java DB データベースを使用します。これは、IDE から Java DB データベースサーバーの起動や停止ができるインタフェースが用意されているからです。ただし、ほかのデータベースサーバーも簡単に使用できます。

まず、Java DB が IDE に登録されているかどうかを確認します。Java DB は自動的に IDE に登録されている可能性があります。たとえば、IDE に Sun Java System Application Server が登録してある場合や、JDK 6 を使用している場合です。

Java DB が IDE に登録されているかどうかを確認する

• 「ツール」メニューを開き、「Java DB データベース」サブメニュー項目を開きます。

  「設定」以外のメニュー項目がすべてグレー表示される場合は、Java DB を手作業で IDE に登録する必要があります。

Java DB を手作業で IDE に登録する

1. 「ツール」>「Java DB データベース」>「設定」を選択します。
2. 「Java DB インストール」フィールドにデータベースサーバーのパスを入力します。
3. 「データベースの場所」プロパティーに、データベースを保存するフォルダを入力します。
4. 「閉じる」をクリックします。

サーバーの起動とデータベースの作成

Java DB が IDE に登録されたら、簡単にデータベースサーバーを起動または停止したり、新しいデータベースを作成したりできます。

データベースサーバーを起動する

• 「ツール」>「Java DB データベース」>「サーバーを起動」を選択します。

  データベースの場所を設定していない場合は、「データベースの場所の設定」ダイアログが表示されます。データベースサーバーでデータベースを保存する場所を入力します。必要な場合はフォルダを新規に作成できます。

  サーバーが起動したら、「出力」ウィンドウで「Java DB データベースプロセス」タブが開き、次のようなメッセージが表示されます。

  Apache Derby Network Server - 2007-09-05 10:26:25.424 GMT に 10.2.2.0 - (485682) が開始され、ポート 1527 で接続を受け入れる準備ができました。
  

データベースを作成する

1. 「ツール」>「Java DB データベース」>「データベースを作成」を選択します。「Java DB データベースを作成」ダイアログが開きます。
2. 「データベース名」テキストフィールドに「car_database」と入力します。またユーザー名とパスワードを「nbuser」に設定します。
3. 「閉じる」をクリックします。

データベースへの接続

ここまでで、データベースサーバーを起動し、データベースを作成できました。この新しいデータベースを IDE で使用するには、このデータベースに接続する必要があります。car_database データベースに接続するには、次の手順に従います。

1. 「サービス」ウィンドウに切り替え (Ctrl+5)、「データベース」ノードを展開して新しいデータベースを表示します。
2. データベース接続ノード (jdbc:derby://localhost:1527/car_database[nbuser on NBUSER]) を右クリックし、「接続」を選択します。

   接続ノードのアイコンがつながって表示され ()、正常に接続されたことを示します。

   
3. 接続ノードを展開し、「表」サブノードを右クリックし、「コマンドを実行」を選択します。
4. car.sql ファイルの内容をコピーし、ソースエディタの「SQL コマンド 1」タブにペーストします。

   これは、車に関するデータをデータベースに挿入する SQL スクリプトです。

5. ソースエディタのツールバーにある「SQL を実行」ボタン () をクリックしてスクリプトを実行します。

アプリケーションの作成

1. 「プロジェクト」>「新規プロジェクト」を選択します。
2. ウィザードの最初のパネルで「Java」カテゴリを展開し、「Java デスクトップアプリケーション」テンプレートを選択します。「次へ」をクリックします。

   「Java デスクトップアプリケーション」テンプレートには、基本的なメニュー項目やコマンドを含む、視覚的なアプリケーションの基本要素が含まれます。

3. ウィザードの「名前と場所」ページで、次の操作を行います。
   1. 「プロジェクト名」フィールドに「CarsApp」と入力します。このフィールドの値は、「プロジェクト」ウィンドウでのプロジェクトの表示名になります。
   2. 必要な場合は「プロジェクトの場所」フィールドを編集し、プロジェクトのメタデータの場所を変更します。
   3. 「アプリケーションシェルを選択」フィールドで「データベースアプリケーション」を選択します。
   4. 「次へ」をクリックします。
4. ウィザードの「マスター表」ページで CAR データベースのデータベース接続を選択します。データベースは jdbc:derby://localhost:1527/car_database[NBUSER の nbuser] のように表示されます。
5. データベースのパスワード (nbuser) を入力し、「セッション中はパスワードを保存」チェックボックスを選択します。

   データベースへの接続が確率されたら、「データベース表」フィールドに CAR と表示され、「取り込む列」リストに CAR データベースの 10 列の名前が表示されます。現時点では、このうち 5 つだけをアプリケーションで使用します。

6. 最後の 5 つの列名 (SUN_ROOF から MODERNNESS まで) を選択し、「<」ボタンをクリックして左側の列に移動します。「次へ」をクリックします。
7. 「詳細オプション」パネルで「完了」をクリックします。

   ウィザードによって、表とデータベース接続を含む基本のユーザーインタフェースが生成されます。IDE によるプロジェクトとコードの生成には数秒かかる場合があります。

生成されたアプリケーションの実行

ここまでで、次のグラフィカルユーザーインタフェース (GUI) 機能を備えた基本のアプリケーションが完成しました。

• CAR データベースの 5 つの列の値を表示および変更する機能。
• 基本のメニュー項目。
• セッション間でのウィンドウの状態の維持。アプリケーションを終了するときに、ウィンドウの位置とサイズが記憶されます。したがって、アプリケーションを再び起動したときに、最後にウィンドウを閉じたときと同じ位置にウィンドウが開きます。
• 簡単にカスタマイズできる「About」ダイアログ。
• ユーザーインタフェースのラベルが含まれる .properties ファイル。.properties ファイルを使用すると、コードのロジックと、アプリケーションのユーザーインタフェースに表示するテキストを分離できます。このような分離には、プログラムのローカライズが簡単であるなどの利点があります。

アプリケーションにすでに組み込まれている機能を確認する

1. プロジェクトのノードを右クリックし、「実行」を選択します。

   数秒後にアプリケーションが起動し、「Database Application Example」というウィンドウが表示されます。このウィンドウには、表と、CARS データベースを編集できるコントロールがいくつか含まれます。

2. 表内の最初のレコード (Acura) を選択します。
3. 「Price」テキストフィールドを選択し、既存の値を 46999 に置き換えます。次に Enter キーを押します。

   表で値が更新されます。ただし、「Save」をクリックするまでデータベースに値は反映されません。

   同様に、表内のほかの任意の値を更新できます。

4. 新しいレコードを作成するには、「New」をクリックし、各フィールドに値を入力します (Make、Model、Price、Body Style、Color)。たとえば、「Trabant」、「Classic」、「1000」、「wagon」、および「blue」と入力できます。「Save」をクリックしてエントリをデータベースに保存します。
5. 「Database Application Example」タイトルバーをクリックし、アプリケーションを画面上の別の場所までドラッグします。
6. 「Database Application Example」ウィンドウの左の境界をクリックして左方向にドラッグし、ウィンドウを拡大します。
7. 「Database Application Example」のメニューバーで、「File」>「Exit」を選択します。
8. IDE でプロジェクトノードを右クリックし、コンテキストメニューから「プロジェクトを実行」を選択します。

   「Database Application Example」ウィンドウが、アプリケーションを終了したときと同じ位置に、同じサイズで表示されます。

アプリケーションの生成された部分の確認

マスター表 (JTable コンポーネント) とデータベースの接続は、次のメカニズムの組み合わせで処理されます。これらはすべて IDE によって生成されています。

• Car.java エンティティークラス。CAR データベース表のデータの読み取りと書き込みに使用します。エンティティークラスは、Java コードを使用したデータベースとの対話を可能にする特殊な種類のクラスです。エンティティークラスでは Java の注釈を使用して、クラスのフィールドがデータベースの列にマッピングされます。
• META-INF/persistence.xml ファイル。データベースとエンティティークラスの間の接続を定義します。このファイルは持続性ユニットとも呼ばれます。
• Beans Binding を使用した、エンティティークラスのプロパティーと、JTable コンポーネントのプロパティーの接続。Beans Binding は JSR 295 に基づく新技術であり、Java SE の今後のリリースに含まれる予定です。
• entityManager、query、および list の各オブジェクト。CarsAppFrame クラスで定義され、「インスペクタ」ウィンドウに表示されます。
  • エンティティーマネージャーオブジェクトは、定義された持続性ユニットの範囲内でのデータの取得とコミットに使用します。
  • クエリーオブジェクトは、特定のデータコレクションをエンティティーマネージャーから取得する方法を定義します。クエリーオブジェクトの動作は変更できます。変更するには、「インスペクタ」ウィンドウでクエリーオブジェクトを選択し、プロパティーシートで「query」プロパティーを変更します。「query」プロパティーには JPA クエリー言語を使用します。
  • list オブジェクトは、クエリーからのデータを保持する監視可能なコレクションです。監視可能なコレクションは、特殊なコレクションであり、コレクションの変更を検出するリスナーを設定できます。

「インスペクタ」ウィンドウとプロパティーシートを使用して、次の手順で JTable からデータへのバインドを確認できます。

1. 「インスペクタ」ウィンドウで「mainPanel[JPanel]」>「masterScrollPane [ScrollPane]」>「masterTable [JTable]」ノードを選択します。次に「プロパティー」ウィンドウで「バインド」タブをクリックします。
2. 「elements」プロパティーが list にバインドされていることを確認します。
3. 省略符号ボタン (...) をクリックすると、「バインド masterTable.elements」カスタマイザが開き、表とデータベースの間のバインドをさらにカスタマイズできます。たとえば、カスタマイザでは、バインドする表の列を指定できます。

プロパティーシートの「バインド」カテゴリのほかに、コンテキストメニューの「バインド」項目を使用することもできます。

コントロールの追加

ここで、最初に除いた属性用のコントロールをフォームに追加します。表は使用せずに、JSlider コンポーネント (タイヤのサイズと最新性の属性) と JCheckbox コンポーネント (サンルーフとスポイラ) を使用します。

コンポーネントを追加する

1. 「パレット」ウィンドウの「スライダ」ボタンをクリックし、フォーム内で「New」ボタンのすぐ上をクリックすることで、最初のスライダを追加します。フォーム内をクリックしてスライダを挿入する前に、横方向に点線のガイドラインが表示されていないことを確認します。この線は、スライダがフィールドやボタンと同じ行に挿入されることを示します。フォーム内でスライダをドロップする位置は、次の図を参照してください。

   注: 意図していなかった位置にコンポーネントをドロップし、その結果、レイアウトが変更された場合は、「元に戻す」コマンドを使用して変更を取り消すことができます。「編集」>「元に戻す」を選択するか、Ctrl-Z キーを押します。

2. 必要な場合は、スライダを左方向に伸ばし、テキストフィールドコンポーネントの左端に合わせます。
3. スライダを右方向に、フォームの端まで伸ばします。
4. スライダの左側にラベルを追加し、そのテキストを「Tire Size」に設定します。ラベルを編集するにはクリックします。
5. 最初のスライダの下にさらに別のスライダを追加し、必要に応じてその幅と配置を調整します。
6. 「Tire Size」ラベルの下にさらにラベルを追加し、テキストを「Modernness」に設定します。
7. スライダの下にチェックボックスを 2 つ追加します。そのテキストを「Spoiler」と「Sun Roof」に設定します。表示テキストを編集するには、チェックボックスを 1 回クリックし、しばらくしてからもう一度チェックボックスをクリックします。チェックボックスを右クリックして「テキストを編集」を選択することもできます。

フォームは次のスクリーンショットのようになります。

"

表内の値へのコントロールのバインド

ここで、Beans Binding 機能を使用して表のセルに表示されている値を、追加したコントロールの状態に関連付けます。このようにすると、スライダやチェックボックスを使用して表内のセルの値を変更できるようになります。

スライダを、対応する表要素にバインドする

1. フォーム内で「Tire Size」スライダを右クリックし、「バインド」>「value」を選択します。
2. 「バインド」ダイアログの「ソースをバインド」ドロップダウンリストで「masterTable」を選択します。
3. 「式をバインド」ドロップダウンリストで「selectedElement」>「tiresize」ノードを選択します。
"
4. フォーム内で「Modernness」スライダを右クリックし、「バインド」>「value」を選択します。
5. 「バインド」ダイアログの「ソースをバインド」ドロップダウンリストで「masterTable」を選択します。
6. 「式をバインド」ドロップダウンリストで「selectedElement」>「modernness」を選択します。

チェックボックスを、対応する表要素にバインドする

1. フォーム内で「Spoiler」チェックボックスを右クリックし、「バインド」>「selected」を選択します。
2. 「バインド」ダイアログの「ソースをバインド」ドロップダウンリストで「masterTable」を選択します。
3. 「式をバインド」ドロップダウンリストで「selectedElement」>「spoiler」を選択します。
4. 「了解」をクリックして「バインド」ダイアログを終了します。
5. フォーム内で「Sun Roof」チェックボックスを右クリックし、「バインド」>「selected」を選択します。
6. 「バインド」ダイアログの「ソースをバインド」ドロップダウンリストで「masterTable」を選択します。
7. 「式をバインド」ドロップダウンリストで「selectedRow」>「sunRoof」を選択します。
8. 「閉じる」をクリックします。

これで、スライダとチェックボックスを使用してデータベースのエントリを変更できるようになります。

スライダとチェックボックスが機能することを確認する

1. 「サービス」ウィンドウを開きます。
2. 「データベース」>「jdbc:derby;//localhost:1527/car_database」を右クリックして「接続」を選択し、IDE をデータベースに接続します。
3. 「データベース」>「jdbc:derby;//localhost:1527/car_database」>「表」> ノードを右クリックし、「データを表示」を選択します。
4. 最初のレコードの SUN_ROOF、SPOILER、TIRE_SIZE、および MODERNNESS の値を確認します。
5. 「実行」>「主プロジェクトを実行」を選択して、アプリケーションを実行します。

   実行中のアプリケーションは次のスクリーンショットのようになります。

   "
6. 実行中のアプリケーションで、最初のレコードを選択します。
7. スライダを動かし、チェックボックスの選択を変更します。
8. 「Save」をクリックして変更内容をデータベースに保存します。
9. 「サービス」ウィンドウで、「データを表示」コマンドをまた使用します。

   データベース内のデータに変更内容が反映されているはずです。

カスタムコンポーネントの設定

Beans Binding のよりグラフィカルなデモとして、選択した車のプレビューを表示するカスタムコンポーネントを追加します。このコンポーネントのプロパティーを、対応する表要素にバインドします。すると、アプリケーションを再び実行したときに、選択した行を変更し、各フィールドの値を変更すると、車のプレビューが変更されます。

CarPreview コンポーネントを CarsApp プロジェクトで使用可能にする

1. CarPreview.zip ファイルをまだダウンロードしていない場合はダウンロードします。
2. 標準の zip ツールを使用して zip ファイルのアーカイブを展開します。
3. 「ファイル」>「プロジェクトを開く」を選択し、zip ファイルから展開した内容の中から CarPreview プロジェクトを選択します。
4. 「プロジェクトを開く」をクリックします。

   IDE でプロジェクトが開きます。

5. 「CarPreview」ノードを右クリックし、「構築」を選択します。

   プロジェクト内のファイルがコンパイルされ、CarPreview クラスを Bean として使用し、フォームに直接ドラッグ＆ドロップできるようになります。

このコンポーネントは JavaBeans コンポーネントとして作成されているので、パレットに追加することもできます。コンポーネントを複数のアプリケーションに追加する場合はパレットへの追加が便利です。このチュートリアルでは、「プロジェクト」ウィンドウからコンポーネントをアプリケーションに直接ドラッグします。

CarPreview コンポーネントをアプリケーションに追加する

1. 「プロジェクト」ウィンドウで「Car Preview」>「ソースパッケージ」>「carpreview」ノードを展開します。
2. CarPreview.java クラスをフォームまでドラッグします。メニューのすぐ下の適切な位置に挿入するには、次の図に示すように、ほかのコントロールと左揃えでテーブルの上に重ね、メニューバーの下端にスナップして配置します。
3. プレビューコンポーネントの幅をフォームの端まで広げます。
4. スライダとチェックボックスを masterTable コンポーネントの要素にバインドしたのと同じ方法で、CarPreview コンポーネントのすべてのバインドプロパティーを masterTable の対応する selectedElement 属性にバインドします。「バインド」ポップアップメニューまたはプロパティーシートの「バインド」タブを使用します。
5. CarApp アプリケーションを再び実行します。

   実行中のアプリケーションで、表内で別の行を選択したり、表内の値を変更したり、スライダを動かしたり、チェックボックスの選択と選択解除を切り替えたりすると CarPreview コンポーネントが変化することを確認できます。

次の画像は、最終的なアプリケーションを実行しているところを示します。

次の手順

このチュートリアルでは、IDE での Swing Application Framework と Beans Binding のサポートの概要を示しました。

IDE の GUI ビルダーの使用方法の概要については、NetBeans IDE における GUI 構築を参照してください。

IDE での Beans Binding の使用の詳細については、デスクトップアプリケーションでの Beans とデータのバインドを参照してください。

関連項目

• java.net にある Beans Binding プロジェクトのページ
• java.net にある Swing Application Framework プロジェクトのページ
• GUI エディタの FAQ
• NetBeans IDE での Swing 開発についての Patrick Keegan のブログ
• Java EE チュートリアル: Java Persistence API の概要