今月から久しぶりにGUIを取り上げていきます。もちろん、ここで紹介するのはJavaFXです。しかし、JavaFX以外にもJavaでGUIを作成する方法があります。標準で提供されているGUIフレームワークは以下の3種類です。

  • AWT
  • Swing
  • JavaFX

 AWT(Abstract Window Toolkit)はJava 1.0のころから使用されているGUIフレームワークです。AWTではボタンなどの部品をWinowsやX11のようなウインドウシステムのネイティブの部品を使用します。このため、パフォーマンスはいいのですが、同じアプリケーションでもウインドウシステムによって見栄えが変化してしまうという欠点がありました。

 これに対し、Swingではボタンなどの要素を自前で全て描画しています。このため、どのウインドウシステムで動かしても、同じ見栄えにできます。しかし、初期のJavaでは全てを描画するためのパフォーマンスが欠けており、Swingは遅いという汚名を着せられることになってしまいました。

 なお、現在ではGPUアクセラレーションなどを駆使しているため、Swingも十分なパフォーマンスを得ています。

 しかし、SwingはAWTの上に構築されたGUIフレームワークで、AWTに起因する限界もあります。例えば、標準ではアニメーションを行うためのAPIが提供されていません。

 そこで、登場したのがJavaFXです。もともとJavaFXはJavaFX Scriptというスクリプト言語によって記述するGUIフレームワークでした。JVM上で動作するとはいえ、Javaとは一線を画していました。

 しかし、2011年にリリースされたJavaFX 2.0でJavaFX Scriptが廃止され、Java SEのGUIフレームワークに生まれかわっています。JavaFX 2.2からはOracleのJava SE 7に標準バンドルされるようになりました。

 現在はOpenJDK 8にも含まれており、Java SEの標準GUIフレームワークとなっています。3種類のGUIフレームワークはそれぞれ特色がありますが、基本的な部分はとても似ています。というか、GUIフレームワークの多くは、基本的な部分が共通しているのです。

 共通している基本部分は次のようなものです。

  • ツリー構造によるGUIの構成
  • イベント駆動による処理

 そこで、今回はこのGUIの基本的な部分を紹介します。JavaFXに特有な部分もあるので、共通な部分とJavaFXに特有な部分は分けて記述します。

ツリー構造によるGUIの構成

 GUIを構成するのは、ボタンやテキストフィールドなどの描画要素です。これらの要素をウインドウに配置していくことでGUIを組み立てていきます。しかし、全ての要素を直接ウインドウに配置するのは非効率です。例えば、ウインドウがリサイズされた場合、全ての要素を配置し直すのは意外に大変です。

 では、どうするかというと、要素を貼ることができるコンテナを使用して階層的にGUIを構成していきます。GUIの使いやすさやデザインなどを考慮して、描画要素を複数のグループに分け、それぞれをコンテナに貼っていきます。

 ウインドウの直下にはルートコンテナを貼り、そこにさらにコンテナを貼っていきます。コンテナも描画要素の1つなので、コンテナを入れ子に配置することも可能です。

 また、コンテナは子供となる要素を画面中のどこに配置するか、つまりレイアウトの機能を持っています。

 例えば、図1のようなGUIを考えてみましょう。右側にツリー、左側にタブ付きのエディタがあるようなGUIです。また、ウィンドウ上部にはメニューバーもあります。

図1●GUIの例
図1●GUIの例

 このGUIを構成する際、例えばメニューバー、ツリー部分、エディタ部分をグループ化することができます。図2に図1のGUIをツリー構造で表した例を示します。

図2●GUIのツリー構造の例
図2●GUIのツリー構造の例