ついにベールを脱いだJavaFX
第6回 Swingのコンポーネント
第4回でシェイプを扱いましたが,シェイプだけでGUIを作るのは片手落ちです。やはり,ボタンやメニュー,テーブルなどといったコンポーネントがないとGUIを構築するのは難しいですね。
第1回でJavaFXはSwingとJava2Dをベースに作られているということを述べました。そのため,このSwingのUIコンポーネントをJavaFXからでも使用できるのです。
とはいうものの,現状ではすべてのSwingコンポーネントを使えるわけではありません。特にメニューやテーブルが使えないのが痛いところです。すでにJavaFXはアップデートリリースされ,JavaFX 1.0 update 1になっています。update 1ではSwingコンポーネントの拡充は行われませんでしたが,今後拡充されていくと筆者は予想しています。
ということで,今回はJavaFXでSwingのコンポーネントを使用する方法について紹介していきます。なお,今回紹介するサンプルコードは以下よりダウンロードできます。
Swingのコンポーネントを使用する
まず,Swingのコンポーネントを単体で使用してみましょう。Swingのコンポーネントだからといって構える必要はありません。第4回のシェイプとほとんど変わりなく使用することができます。
まず,サンプルのためのプロジェクトをNetBeansで作成しましょう。NetBeansでJavaFXのプロジェクトを作成する方法は第4回を参照してください。ここでは,ボタンを例にしていくので,プロジェクト名をbuttonsampleとし,メインファイルは作成しないことにします。
プロジェクトが作成できたら,メインとなるスクリプトファイルを作成します。プロジェクトの一覧が表示されているペインで,buttonsampleを右クリックし,ポップアップメニューを表示させます。そして,メニューの中から[新規]→[Empty JavaFX File]を選択します。すると,ファイルを作成するダイアログが表示されるので,ファイル名を入力します。ここでは,プロジェクト名と同じbuttonsample.fxとしましょう。
空っぽのファイルが作成されたので,第4回と同じようにエディタの右側にあるコードパレットからStageをドラッグし,エディタ領域にドロップします。するとリスト1のようなコードが作成されます(コメントは省略してあります)。
リスト1
import javafx.stage.Stage;
import javafx.scene.Scene;
Stage {
title: "MyApp"
scene: Scene {
width: 200
height: 200
content: [ ]
}
}
さあ,これで準備完了です。さっそくSwingのコンポーネントをここに貼っていきましょう。この場合も,コードパレットを使用することができます。Swingのコンポーネントは図1に示したようにSwing Componentsカテゴリにあります。
ここではButtonをドラッグし,content: [ ]の括弧の中にドロップします(図2)。
Buttonをドロップすると,コードはリスト2のようになります(整形してあります)。
リスト2
import javafx.ext.swing.SwingButton;
import javafx.scene.Scene;
import javafx.stage.Stage;
Stage {
title: "MyApp"
scene: Scene {
width: 200
height: 200
content: [
SwingButton {
text: "Button"
action: function() {
}
}
]
}
}
ここからわかることは,SwingのボタンはSwingButtonというクラスで表されるということ,またSwingButtonクラスはjavafx.ext.swingパッケージで定義されていることです。
JavaFX ScriptのAPIドキュメントを見るとわかりますが,他のSwingコンポーネントもjavafx.ext.swingパッケージで定義されており,それぞれSwingで始まる名前になっています。
それでは,この状態で実行してみましょう。もちろん,プレビューでもかまいません。実行結果を図3に示しました。
JavaFXをJava SE 6u10以降のバージョンで動作させると,Java SE 6u10で導入された新しいルック&フィールのNimbusが使用されます。そのため,見た目が今までのSwingコンポーネントとはちょっと違っています。最近の傾向であるグラデーションを多用したルック&フィールになっています。
それでは,このスクリプトを進化させていきましょう。デフォルトではtextアトリビュートとactionアトリビュートしか初期化されていないので,その他のアトリビュートを付け加えてみました。SwingButtonクラスのアトリビュートはSwingButtonクラスのAPIドキュメントを参照してください。
第3回で触れたシェイプも,ここで使用しているSwingButtonクラスもjavafx.scene.Nodeクラスのサブクラスです。そのため,シェイプで使用したアトリビュートの多くはSwingButtonクラスでも使用することができます。
リスト3のコードではwidth,height,translateX,translateY,fontの各アトリビュートに値を代入するようにしました。
リスト3
Stage {
title: "Button Sample"
scene: Scene {
width: 140
height: 100
content: [
SwingButton {
text: "Click!"
width: 100
height: 60
translateX: 20
translateY: 20
font: Font {
size: 24
}
action: function() {
}
}
]
}
}
widthアトリビュートはコンポーネントの幅,heightアトリビュートは高さを表します。また,translateXはx軸方向のコンポーネントの移動量,同じくtranslateYはy軸方向の移動量になります。fontはボタンの文字を描画するフォントを指定します。また,ボタンに表示される文字列も変更しました。では,この状態で再び実行させてみましょう(図4)。


