GriffonのJavaFXプラグインFxBuilderをスタンドアロンで使ってみる
まずは
12/20の JavaFX & GlassFish 合同勉強会(http://atnd.org/events/10146)で、GroovyのBuilderについて発表させていただきました。
機会をいただいたid:skrbさんをはじめ、開催側・参加者の皆さんありがとうございました。
発表では簡単な紹介だけでスルーしていたFxBuilderの使い方について、以下にまとめておきます。
FxBuilderをスタンドアロンで使う?
http://griffon.codehaus.org/FxBuilder
FxBuilderはGriffonのプラグインとして実装されていますが、スタンドアロンでも使えます。
つまり、FxBuilderとしてのDSLで記述したソースコードに対して、FxBuilderのjarと、JavaFXの各種jarをクラスパスに通して実行すれば、すぐに試すことができるわけです。
なにはともあれJavaFXを用意する
FxBuilderを使う場合は、JavaFXのバージョンは1.2.xでなければなりません。
1.2.1が公式の動作確認バージョンなのですが、試してみたら1.2系最新の1.2.3でもOKでした。
1.3系はcom.sun.*系の内部クラスの構造が変わっているためエラーになってしまいます。ご注意ください。
Groovyを用意する
GriffonなFxBuilderは当然Groovyで実装されています。
というわけで、以下のサイトからGroovyをダウンロードしてインストールしましょう。
展開してbinをPATHに通すだけのいつものやりかたです。
FxBuilderのバイナリをダウンロードする
現時点の正式リリース版はv0.2です。
http://griffon.codehaus.org/FxBuilder のダウンロードリンクからfxbuilder-0.2.jarをダウンロードしましょう。
また、同ページにリンクされている以下のライブラリも入手します。
- JFXtras 0.5
- Miglayout
http://dist.codehaus.org/griffon/builders/fxbuilder/ に入ってるものを持ってくると楽ですね。
ダウンロードしたjarは、実行時にCLASSPATHに通してもいいですし、多少乱暴ですが、$GROOVY_HOME/lib配下に突っ込んでもかまいません。
FxBuilderをソースコードからビルドする
コードを読んだり、JavaFX2.0対応などを試してみたい人には断然こちらをお勧めします。
FxBuilderのソースは以下のSVNリポジトリから入手可能です。
http://svn.codehaus.org/griffon/builders/fxbuilder/
ビルド自体は以下のようにお手軽簡単なんですが、ちょっとだけポイントがあります。
$ svn co http://svn.codehaus.org/griffon/builders/fxbuilder/trunk /tmp/fxbuilder
$ cd /tmp/fxbuilder
$ ant
ビルド時の注意事項
- なぜかそのままではjunit.jarがクラスパス上に不足しているため、antを実行する前に、適当なところからjunit.jarを持ってきてsrc/lib直下にコピーしておきましょう。4.x系でも3.x系でもいけるみたいです(v3.8.2, v4.8.2で確認済み)。Java-erな人ならjunit.jarぐらいその辺のディレクトリに入ってますよね。
- デフォルトではbuild.propertiesでjavafx.home=/usr/local/javafxとなっているので、自分の環境に合わせてbuild.propertiesを編集するか、コマンドラインでシステムプロパティを指定しましょう。
$ ant -Djavafx.home=/Library/Frameworks/JavaFX.framework/Versions/1.2
成功すると、target/fxbuilder-0.3.jarができあがります。
実行時には、src/lib配下にある、以下のjarファイルが必要です。
- JFXtras-0.5.jar
- miglayout-3.6.3-swing.jar
実行してみる
実行時は、FxBuilderとJavaFXがそれぞれ依存している大量のjarファイルをクラスパスに含める必要があります。
JavaFX系のjarは一通りJAVAFX_HOME配下のものを列挙してます。rt15.jarを入れるとエラーになるので外してます。
たぶんもっと絞れると思うんですけど、とりあえずは以下で確認してます。
FXBUILDER_DIR=/tmp/fxbuilder JAVAFX_HOME=/Library/Frameworks/JavaFX.framework/Versions/1.2 CL=$FXBUILDER_DIR/target/fxbuilder-0.3.jar CL=$CL:$FXBUILDER_DIR/src/lib/JFXtras-0.5.jar CL=$CL:$FXBUILDER_DIR/src/lib/miglayout-3.6.3-swing.jar CL=$CL:$JAVAFX_HOME/lib/desktop/decora-j2d-jogl.jar CL=$CL:$JAVAFX_HOME/lib/desktop/decora-ogl.jar CL=$CL:$JAVAFX_HOME/lib/desktop/decora-runtime.jar CL=$CL:$JAVAFX_HOME/lib/desktop/decora-sse.jar CL=$CL:$JAVAFX_HOME/lib/desktop/eula.jar CL=$CL:$JAVAFX_HOME/lib/desktop/fxdloader.jar CL=$CL:$JAVAFX_HOME/lib/desktop/gluegen-rt.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-anim.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-common.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-geom.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-io.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-sg-common.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-sg-swing.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-ui-charts.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-ui-common.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-ui-controls.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-ui-desktop.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafx-ui-swing.jar CL=$CL:$JAVAFX_HOME/lib/desktop/javafxrt-main.jar CL=$CL:$JAVAFX_HOME/lib/desktop/jmc.jar CL=$CL:$JAVAFX_HOME/lib/desktop/jogl.jar CL=$CL:$JAVAFX_HOME/lib/desktop/script-api.jar CL=$CL:$JAVAFX_HOME/lib/desktop/websvc.jar CL=$CL:$JAVAFX_HOME/lib/shared/asm-all-3.1.jar CL=$CL:$JAVAFX_HOME/lib/shared/fxdtools.jar CL=$CL:$JAVAFX_HOME/lib/shared/javafxc.jar CL=$CL:$JAVAFX_HOME/lib/shared/javafxdoc.jar CL=$CL:$JAVAFX_HOME/lib/shared/javafxrt.jar CL=$CL:$JAVAFX_HOME/lib/shared/toolchain.jar groovy -cp $CL sample.groovy
サンプルコード
なんか色の付いた四角を書くだけのサンプルです。微妙ですいません。
id:skrbさんみたくアニメーションぐりぐりできれば良かったんですが余裕が...。
import griffon.builder.fx.FxBuilder import javafx.stage.* import javafx.scene.* import javafx.scene.shape.* import javafx.scene.paint.* new FxBuilder().edt { stage( title: "Sample by FxBuilder of Groovy", width: 600, height: 450, scene: scene(fill: Color.$LIGHTSKYBLUE) { rectangle( x: 25, y: 40, width: 100, height: 50, fill: Color.$RED ) } ) }
というわけで、Happy Builder Life!!!