こんにちは。「Javaを復習する初心者」です。
今回はJavaFXで簡易電卓を作成しました。
JavaにはJavaFXというGUIがあります。以前はSwingで簡易電卓を作りましたが、今回はそれと同じようなものをJavaFXで作ってみました。
ボタン動作にJavaScriptを使った例
この記事に先行してQiitaの方に動作部分をJavaScriptで記述したものを投稿しています。fxmlファイルというXML形式のファイルをJavaFXで使うのですが、そこにJavaScriptを記述することができます。Main.javaとapp.fxmlの2つだけで出来るアプリケーションの例として投稿しました。JavaScriptでボタンクリックのイベントを記述しています。
http://qiita.com/java-beginner/items/ce013c5b7fe8e69be082
ボタンをJavaで実装
今回はボタンクリックのイベントをJavaで実装しました。この場合、AppController.javaといった名前でコントロールを記述するJavaファイルを作ることになります。
ソースはgithubリポジトリにアップロードしてあります。jarファイルもアップロードしました。java8が動く環境なら起動できると思います。
https://github.com/java-beginner/simple-calculator-JavaFX
以下のような画面のアプリケーションです。
アプリケーションは以下のファイルで構成されています。
- Main.java
- AppController.java
- app.fxml
- Constants.java
- Evaluation.java
各ファイルの大まかな役割を記載します。Main.javaは画面を表示する起動クラスです。app.fxmlを読み込んで表示するという部分を記述しています。app.fxmlはコンポーネントの配置を記述するファイルです。このファイルにはコントローラーをAppController.javaに指定するという記述をしています。AppController.javaはボタンクリック時の動作を記述しています。このファイルでEvaluation.javaを使っています。実際の式の評価はJavaScriptの式にして実行しています。Constants.javaは定数をまとめたクラスです。
JavaFXとSwingを比べた場合、個人的な感想としてコンポーネントの配置とアクションイベントの記述が簡単です。コンポーネントについては、fxmlファイルに要素を記述するのですが、実際には後述する開発環境のツールを使っています。要素にfx:id属性を指定し、コントローラー側で@FXMLアノテーションを記述してバインドするという方式で、配置したオブジェクトにアクセスできます。java側には@FXML [要素名] [fx:id]という記述をします。アクションイベントはクリックの場合は、fxml側はonAction属性を記述します。コントローラー側ではメソッドの定義に@FXMLを付与します。
開発環境についてですが、以下を使いました。
- Eclipse Luna + e(fx)clipse – IDEプラグイン
- JavaFX Scene Builder 8.2.0
いつも使っているEclipseはEclipse Marsなのですが、プラグインのインストール中に不具合が発生したため、上記環境を使いました。
前述で「fxmlファイルに要素を記述」と述べましたが、実際には先にJavaFX Scene Builderを使って、コンポーネントを配置しています。位置の微調整で直接fxmlファイルの数値を編集しました。また、onAction属性も直接入力しています。GUI上でこの作業をやるには少し面倒に感じました。