Tweet

JavaFX＋NetBeansでWidgetFXアプリを作るには

　前編の「Java Storeや携帯でも使われる？ WidgetFXとは」では、JavaFX Scriptで開発されたデスクトップ・ウィジェット・プラットフォーム「WidgetFX」の概要や使い方、将来について紹介しました。

　今回は、ウィジェットの簡単な作り方を紹介するので、ぜひ読者の皆さんも一緒に作ってみてください。

WidgetFXの開発環境を整えよう

■ Java SE 6 Update 17

　WidgetFXのウィジェットを作るには、前回の「なにはともあれ、WidgetFXを試してみよう」でも説明した、Java SE 6 Update 10以上のJavaが必要です。2009年11月時点の最新バージョンはJava SE 6 Update 17です。まだ入手していない方は、こちらからダウンロードしてインストールしてください。

■ JavaFX SDK 1.2＋NetBeans IDE 6.7.1

　WidgetFXは、JavaFX Scriptで開発するので、JavaFXのSDKも必要です。また、開発とデバッグを簡単・便利にしてくれるIDEもあった方がよいです。

　本稿では、JavaFX SDKとJavaFXプラグインが元から組み込まれた「NetBeans IDE 6.7.1 for JavaFX 1.2」を使用します。NetBeans IDE 6.7.1 for JavaFX 1.2は、JavaFXのWebサイトから入手できます。

図1　右上のオレンジ色のボタンをクリックしてNetBeans IDE 6.7.1 for JavaFX 1.2を入手する

　NetBeans IDE 6.7.1のシステム要件などを確認し、ダウンロードしたファイルをダブル・クリックして、インストーラの指示に従えばインストールは完了します。

■ WidgetFX SDK 1.2.1

　最後の1つ、WidgetFXのSDKを入手しましょう。WidgetFX SDKは、ダウンロードサイトから入手できます。2009年9月の原稿執筆時点のWidgetFXの最新バージョンは1.2.1です。WidgetFX SDK 1.2.1.zipを選択してダウンロードし、適当な場所に解凍してください。

　解凍したら「lib」フォルダにWidgetFX-API.jar、jnlp.jar、JFXtras-0.5.jarが入っています。ウィジェットの開発には、これら3つのJARファイルが必要となります。

NetBeansで作るJavaFXアプリの初歩

　最初に、とても簡単な「Hello, World」ウィジェットを作成しましょう。

■ JavaFX Scriptプロジェクトの作成

　まずは、NetBeansを起動します。起動したら、メニューから［ファイル］→［新規プロジェクト］を選択します。［新規プロジェクト］ダイアログのカテゴリのリストから［JavaFX］を選択し、右に表示されるプロジェクトから［JavaFX Script アプリケーション］を選択して、［次へ］ボタンを押します。

図2　［新規プロジェクト］ダイアログで［JavaFX Script アプリケーション］を選択

　［プロジェクト名］は、「HelloWorldWidget」としました。プロジェクトの場所は、好みの場所に設定してください。それから、［空のプロジェクト］のラジオボタンを選択しておきます。そして、［完了］ボタンを押してウィザードを終了します。

図3　［プロジェクト名］を「HelloWorldWidget」にして、［空のプロジェクト］を選択して［完了］

　これで、「HelloWorldWidget」プロジェクトと「helloworldwidget.Main.fx」ファイルが生成されました。

図4　生成されたHelloWorldWidgetプロジェクト

　以下は、生成されたhelloworldwidget.Main.fxファイルです。

package helloworldwidget;
 
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.text.Text;
import javafx.scene.text.Font;
 
Stage {
    title: "Application title"
    width: 250
    height: 80
    scene: Scene {
        content: [
            Text {
                font : Font {
                    size : 16
                }
                x: 10
                y: 30
                content: "Application content"
            }
        ]
    }
}

■ ソースを書き換えて1度実行してみよう

　このソースを、ほんの少しだけ修正します。Stage {……}の中の記述を少し変えます。変更したソースは、次のようになります。

package helloworldwidget;
 
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.text.Text;
import javafx.scene.text.Font;
import javafx.scene.paint.Color;
 
Stage {
    title: "My First Widget"
    width: 250
    height: 80
    scene: Scene {
        content: [
            Text {
                font : Font {
                    size : 16
                }
                fill: Color.RED
                x: 10
                y: 30
                content: "Hello, World!"
            }
        ]
    }
}

　ここで、このプロジェクトを標準のJavaFXアプリケーションとして一度実行してみましょう。実行するには、［プロジェクト］ウィンドウでHelloWorldWidgetプロジェクトを右クリックし、［プロジェクトを実行］をクリックします。

図5　プロジェクトを実行

図6　JavaFXアプリケーションとして実行

　JavaFXアプリケーションとして実行すると、図6のようなウィンドウが表示されるはずです。

　次ページでは、作ったJavaFXアプリケーションをWidgetFXのウィジェットにする方法を紹介します。

1-2-3

INDEX 「JavaFXでデスクトップを遊ぶ「WidgetFX」（後編）」
	Page1
	WidgetFXの開発環境を整えよう NetBeansで作るJavaFXアプリの初歩
	Page2
	JavaFXアプリをWidgetFXウィジェットにする 作ったWidgetFXを動かしてみよう
	Page3
	キッチン･タイマ・ウィジェットもあるよ 自分で作ったウィジェットを公開するには コラム　「良いウィジェットを作るコツ」 WidgetFXがビジネスチャンスに？

Java Solution全記事一覧

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

RSSフィード