JavaFX 2解説の2回目となる今回は、JavaFXを語る上で外すことのできないシーングラフについて解説していきます。

 その前に、今回使用するJavaFXのバージョンについて触れておきます。

 先月、Java SE 7u6のリリースされました。それに伴い、JavaFX 2.2も同時にリリースされました。JavaFX 2.2はJava SE 7u6にバンドルされているので、JDK 7u6をインストールすると、JavaFX SDKも一緒にインストールされます。

 JavaFX 2.2では、Windows、Mac OS Xに加え、やっとLinuxに正式対応しました。また、マルチタッチやビットマップのサポートなどの新機能も導入されています。

 また、JavaFX 2.2と同時にリリースされたのが、FXMLの編集ツールであるScene Builder 1.0です。

 Scene BuilderはJDKとは別途インストールが必要です。インストールの方法は前回説明した通りですが、正式リリースに伴いダウンロードページがGeneral Availability Downloadページに変更されています。

 本解説でも、今回からJavaFX 2.2とScene Builder 1.0を使用していきます。なお、NetBeansは前回同様7.2を使用していきます。

シーングラフ

 シーングラフとは、コンピュータで描画する要素をグラフで表したものです。グラフといっても、棒グラフや線グラフのグラフではなくグラフ理論のグラフです。

 グラフ理論というと難しそうに聞こえますが、実際にはグラフの一種であるツリー構造で表しているだけです。

 もともと、シーングラフは3D CGで使用されていた言葉で、CGのシーンを構成するすべての要素を表すことからシーングラフと呼ばれます。

 JavaFXでも同じように、描画する要素をツリー構造で表すためシーングラフという言葉を使用しています。このため、ツリーのルートを表すためにjavafx.scene.Sceneクラスを使用します。

 たとえば、図1のようなログイン画面があったとします。

図1●ログイン画面の例
図1●ログイン画面の例

 図1ではラベル(Label)と文字入力を行うテキストフィールド(TextField)、パスワード入力を行うパスワードフィールド(PasswordField)、ボタン(Button)で画面を構成しています。

 また、これらの部品を貼るために、コンテナと呼ばれるクラスを使用します。図1ではコンテナとしてAnchorPaneクラスとVBoxクラス、HBoxクラスを使用しています。

 図2にログイン画面のコンテナの配置を示しました。

図2●コンテナの構成
図2●コンテナの構成

 一番ルートにあるのがAnchorPaneで、そこにVBoxを貼っています。VBoxには2つのAnchorPaneとHBoxを貼ります。上段のAnchorPaneにはラベルとテキストフィールド、真ん中のAnchorPaneにはラベルとパスワードフィールド、下段のHBoxにはボタンを2つ貼っています。

 これらのクラスの詳しい使用法は次回以降説明することにして、ここではこういうクラスを使うものだということにしておいてください。

 このGUI部品をオブジェクト図で表したものが図3です。このツリーがログイン画面のシーングラフになります。

図3●ログイン画面のシーングラフ
[画像のクリックで拡大表示]

 このような構造は、GUIではごくごく普通に使われます。たとえば、SwingでもAWTでもクラス名などは異なりますが、同じような構造をとります。

 つまり、シーングラフは新しい手法というわけではなく、既存の手法に対して新たに名前をつけただけにすぎません。重要なのは、GUIの構造がツリーで表せるということです。

この先は会員の登録が必要です。有料会員(月額プラン)は初月無料!

日経 xTECHには有料記事(有料会員向けまたは定期購読者向け)、無料記事(登録会員向け)、フリー記事(誰でも閲覧可能)があります。有料記事でも、登録会員向け配信期間は登録会員への登録が必要な場合があります。有料会員と登録会員に関するFAQはこちら