GroovyFX で GUI アプリケーション開発をはじめよう！！

今年もあとわずかとなりましたが、今年最初となる（しかも 多分 今年最後になるであろう）記念すべきエントリーは 『G* Advent Calendar 2012』の21日目です。
昨年はすっかり出遅れて寂しい思いをしましたが、今年は間に合いましたよ！！

で、早速ですが...
皆さん Gradle 使ってますか？ (GroovyFX の話はちょっとおいといて...)

自分はというと...
Gradle の正式版がリリースされたにも関わらず、今年も本格的に導入することができず、ちょっとしたプロトタイプ プロジェクトのビルドやツールとして利用する程度という残念な結果に...

とは言え 泥臭い現場では ちょっとしたツールというのが結構大事なんですよね。
でも それを周りにも使ってもらおうとすると 『コマンドライン はちょっと...』 ということ よくありますよね？

そこで GroovyFX ですよ！！
GroovyFX なら とっても簡単に GUI ツールが作れちゃうんです。

GroovyFX って何？ という人のために 簡単に言うと

　Groovy で JavaFX 2.x を簡単に扱うための ライブラリ

です。(名前のまんまですが...)
詳細はこちら

もちろん GroovyFX だけでも OK ですが、Gradle で更に快適に... のような画面を表示するだけであれば

  hellofx
  |-- src/main/groovy/
  |   `--  hellofx/Main.groovy
  `-- build.gradle

のような ディレクトリ構成で

Main.groovy

package hellofx

import static groovyx.javafx.GroovyFX.start

start {
    stage(title: 'Hello, GroovyFX', visible: true) {
        scene(fill: BLACK, width: 500, height: 250) {
            hbox(padding: 60) {
                text(text: 'Groovy', font: '80pt sanserif') {
                    fill linearGradient(endX: 0, stops: [PALEGREEN, SEAGREEN])
                }
                text(text: 'FX', font: '80pt sanserif') {
                    fill linearGradient(endX: 0, stops: [CYAN, DODGERBLUE])
                    effect dropShadow(color: DODGERBLUE, radius: 25, spread: 0.25)
                }
            }
        }
    }
}

build.gradle

apply plugin: 'groovy'
apply from:   'http://repository-javafx-gradle-plugin.forge.cloudbees.com/snapshot/javafx.plugin'

repositories { mavenCentral() }

dependencies {
    groovy 'org.codehaus.groovy:groovy-all:2.0.5'
    groovy 'org.codehaus.groovyfx:groovyfx:0.3.1'
}

のような２つのファイルを用意して

gradle run

と実行するだけです！！
たったこれだけで GUI アプリケーションが作れるなんていい時代になったものです。
これを使わない手はないですよね。

# もちろん、皆さん JDK 7u10 はインストールしてますよね！！ JRE ではダメですよ。
# もしインストールしていないという方は まずは JDK をインストールしましょう！！
# あっ、それともちろん Gradle も...

更に

gradle build

と実行すれば build/distributions 配下に

• JAR 形式
• JNLP形式
• 開発環境により Windows の場合 hellofx.exe、Mac OS X の場合 hellofx.app

のような配布ファイルまで生成できちゃいます。

これらは Gradle JavaFX Plugin により実現されています。
残念ながら 今のところ 公式な JavaFX 2.x 用の プラグインはないようですが、このプラグインはかなりいいですね。
早く 公式プラグインとして採用されるとよいのですが...
このプラグインは

apply from:   'http://repository-javafx-gradle-plugin.forge.cloudbees.com/snapshot/javafx.plugin'

を追加するだけで適用され、JavaFX のビルド、実行に必要な設定やタスクが追加されます。
このプラグインを適用した際のタスクはこんな感じ...

Build tasks
-----------
assemble - Assembles the outputs of this project.
build - Assembles and tests this project.
buildDependents - Assembles and tests this project and all projects that depend on it.
buildNeeded - Assembles and tests this project and all projects it depends on.
classes - Assembles the main classes.
clean - Deletes the build directory.
cssToBin - Converts CSS to Binary CSS.
generateDebugKey - Generates the JAvaFX Debug Key.
jar - Assembles a jar archive containing the main classes.
jfxDeploy - Processes the JavaFX jars and generates webstart and native packages.
jfxJar - Jars up the classes and adds JavaFX specific packaging.
jfxSignJar - Signs the JavaFX jars the JavaFX way.
packageClasses - Assembles the package classes.
testClasses - Assembles the test classes.

Documentation tasks
-------------------
groovydoc - Generates Groovydoc API documentation for the main source code.
javadoc - Generates Javadoc API documentation for the main source code.

Execution tasks
---------------
debug - Runs the applicaiton and sets up debugging on port 5005.
run - Runs the application.

Tools tasks
-----------
scenicview - Adds the ScenicView agent to all Execution Tasks.

Verification tasks
------------------
check - Runs all checks.
test - Runs the unit tests.

ちなみに このプラグインでは 命名規約が決まっていて デフォルトでは

<プロジェクト名>.Main

が メインクラスになるようです。今回の場合

  hellofx.Main

ですね。

今回作成したサンプルプロジェクトは こちら です。 興味のある方はどうぞ！！
もし ZIP 形式でダウンロードする場合は 解凍後のディレクトリ名を hellofx に変更してください。

手っ取り早く、GroovyFX を試してみたものの、これだと GroovyFX & JavaFX のよさがわかりづらいので、もうちょっと それらしいものを！！
ということで、GitHub からサンプルプロジェクトをダウンロードして実行する GUI ツールを作成してみました。

こんな感じ...

で 今回 GroovyFX を試してみてわかったことは 簡単な GUI ツールを作成する程度であれば、GroovyFX の (と言うより Groovy のかな？) 強力なビルダー機能を使って地道に画面を作成するよりも JavaFX 2.x の JavaFX Scene Builder を使った方が楽ってことですね。

今回初めて JavaFX Scene Builder を使ってみたのですが、これ かなりいいですね。
簡単なツールの開発ぐらいなら、これで 十分ではないかな...

このツールを使うメリットは もちろん『GUI 画面で 画面のデザインができる』ということもありますが、 それよりもむしろ『画面のデザインとコントロールが完全に分離できる』ということではないでしょうか？
実際はこのツールというより FXML を使うメリットと言った方が正しいのかもしれませんが...

JavaFX Scene Builder を使えば

• FXML （JavaFX Scene Builder で作成されるXMLファイル）
• CSS （リファレンスは こちら）
• Groovy(FX)

といった 皆さんおなじみの HTML + CSS + JavaScript みたいな感じで開発できるようになるんですよ。
これって結構すごくないですか？これでかなり敷居が下がると思うんですよね。

で 今回作ったものはこんな感じの構成になります。

gradlefx
|-- build.gradle
`-- src
      `-- main
            |-- groovy
            |    `-- gradlefx
            |          |-- Controller.groovy
            |          `-- Main.groovy
            `-- resources
                   |-- gradlefx.css
                   `-- gradlefx.fxml

詳しい話はまたの機会にするとして...
たった ４(+1) ファイルで GUI ツールが作成できるので皆さんも ぜひ 何か作ってみてください。

今回作成したサンプルプロジェクトは こちら です。 興味のある方はどうぞ！！
もし ZIP 形式でダウンロードする場合は 解凍後のディレクトリ名を gradlefx に変更してください。

G* Advent Calendar 2012 も もう終盤に差し掛かったこの時期に 今更ではありますが G* Advent Calendar 2012 をカレンダー形式で参照できる GUI アプリケーションも作成してみました。
興味のある方は こちら もどうぞ！！
もし ZIP 形式でダウンロードする場合は 解凍後のディレクトリ名を groovyfx に変更してください。

各日付の参加者のリンクをクリックすると ATND のコメントが表示されます。コメントのリンクを押すとブラウザでブログがみれちゃいます。
時間がなくてかなり中途半端なデキですが、GroovyFX の勉強（WEB サービス連携、非同期処理、ブラウザ連携 等々）にはかなり役に立ったので まぁ ヨシとしとこうかな。
それなりに苦労したので、また、時間があるときに ブログにまとめていこうと思います。

明日は いよいよ [twitter:@kimukou_26] さんですよ！！
では、みなさん よいクリスマスを！！