Java プロコンゲーム 〜見た目の作成(SceneBuilderの使用)〜

イントロダクション

前回作成した、設計をもとに進めます。
今回からは、プロコンゲーム(プログラミングコンテスト向けゲーム)の作成を始めようと思います。

前回作成した、設計(UMLのユースケース図)より順番に作成して行きます。

1.バッチをダブルクリックする

Javaで作成したプログラムは実行するときにコマンドもしくは実行可能JARファイルで実行する必要があります。IDE(開発ツール)からの実行方法以外のアプリケーションの起動方法として、最も標準的な手段としてバッチファイル(シェル(*.sh))を使用する方法があります。
Widnowsでは「バッチファイル」を使用します。

コマンドプロンプトでのコマンド実行をダブルクリックのみで実行する事ができます。

「1.バッチをダブルクリックする」の部分に関しては、作成したプログラムを起動するためのバッチ。。。

Windowsの場合は、「〜.bat」、MacやLinuxの場合は「〜.sh」というファイルで作成したプログラム(JARファイル)を起動することができます。なので作成するのは
最後になりますので今は「こんなのがあるよ~」程度に理解しておいてください。

プレーヤ受付画面

早速、プレーヤ受付画面の作成を始めます。
そして、設計するのにはUMLの「クラス図」を使用します。
細かい書き方などは下のリンク先に記載しています。

  1. UML 世界を作る 〜RPGでの世界を作る場合〜
  2. UMLの書き方(読み方)〜概要とクラス図〜
  3. UMLツール Star UML〜ユースケース図を書いて見た〜
  4. UMLツール 〜Star UMLを使う〜

そして、作成したクラス図は下のようなものです。

起動するメインクラスは、ProconServerクラスです。
そして、このクラスはJavaFXのパッケージにあるjavafx.application.Applicationを継承して作成します。
ここで、上のクラスを継承して実装することにより、画面表示を行うための細かい処理(Xサーバーへのアクセス及び、描画処理)を自分で作成しなくてよくなります。

つまり、作成するアプリに集中できるわけです。
その代わり、このフレームワークの使用方法を理解する必要があります。「JavaFXの〜」にあるリンクからOracleのドキュメントページに遷移できます。

自分の作成した記事は以下になります。
初心者でもわかる。。。というより作って動かして。。。とやってみるのが一番なのでその手順と実装サンプル、動かしてみたときのイメージを記載しています。

  1. JavaFX チュートリアル〜今度こそ、初めてでも大丈夫:Label〜
  2. JavaFX チュートリアル〜今度こそ、初めてでも大丈夫2:Label〜
  3. JavaFX チュートリアル〜今度こそ、初めてでも大丈夫3:Button〜

本題: 受付画面作成

本題に入ります。今回作成するのは、プロコンゲーム(プロコンサーバー)のはじめの画面、プレーヤ受付画面を作成します。
と言っても、順序立ててやって行きます。

とりあえずの見た目を作る

兎にも角にも、入力する部品(ボタンなど)がないと動かすのも、受け付けるのも設計の通りにはいかないので、ここから始めます。
俗にいうモックの作成です。

そして、作成するのに使用するのはEclipseを使用しますのでプロジェクトの作成から入ります。

  1. プロジェクトエクスプローラーを右クリックします。
  2. JavaFXプロジェクトを作成します。
  3. プロジェクト名をつけます。使用するJDKは1.8です。JShellとか使用する予定がないので。。。

作成したプロジェクトは下のような感じです。

以前追加した、シーンビルダーというプラグインが入っているので、使用します。下は操作したときの動画です。今回作成するものではありませんので。。。

そして、作成したものは、下のような見た目です。

作成したときの動画は以下になります。途中で落ちましたが(笑)とりあえずは、使用するPCのスペックでメモリ不足(だと思う)により落ちる可能性があるので、File -> Save Asなどで時々保存すると良いと思います。

今回作成したのは、プレーヤーの受付部分を1行だけ作成しました。とりあえずはプレーヤー1人の受付を実装し、うまくいくのなら他ものもの同様に作成する。。。そんな感じで行こうと思います。

しかし、色々と考えた結果変更する事にしました。
具体的なイメージは下のようなものです。

この部分に関しては、こちらの記事に記載しています。※JavaFX SceneBuilder 使い方~インストールからCSS指定方法など~

ボタンアクションの作成

参考サイト(OracleDoc)

SceneBuilderの右側にある、「Code: Button」にあるController部分を開きます。

そして、OnActionの部分にアクション時に起動するメソッド名を定義します。

注意事項としては、FXMLにボタンActionを定義したのにコントローラークラス(Javaファイル)に対象のメソッドを定義していない場合は、下のようなエラーメッセージが出ます。

Run FxServerjavafx.fxml.LoadException: Error resolving onAction='#startAction', either the event handler is not in the Namespace or there is an error in the script.
/D:/github/ObjectOrientedPrograming/target/classes/views/ProConTitleView.fxml:80

    at javafx.fxml.FXMLLoader.constructLoadException(FXMLLoader.java:2597)
    at javafx.fxml.FXMLLoader.access$100(FXMLLoader.java:103)
    at javafx.fxml.FXMLLoader$Element.processEventHandlerAttributes(FXMLLoader.java:610)
    at javafx.fxml.FXMLLoader$ValueElement.processEndElement(FXMLLoader.java:770)
    at javafx.fxml.FXMLLoader.processEndElement(FXMLLoader.java:2823)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2532)
    at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2441)
    at javafx.fxml.FXMLLoader.load(FXMLLoader.java:2409)
    at jp.zenryoku.procon.ProConRPGLogic.start(ProConRPGLogic.java:102)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$8(LauncherImpl.java:863)
    at com.sun.javafx.application.PlatformImpl.lambda$runAndWait$7(PlatformImpl.java:326)
    at com.sun.javafx.application.PlatformImpl.lambda$null$5(PlatformImpl.java:295)
    at java.security.AccessController.doPrivileged(Native Method)
    at com.sun.javafx.application.PlatformImpl.lambda$runLater$6(PlatformImpl.java:294)
    at com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:95)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.lambda$null$3(WinApplication.java:177)
    at java.lang.Thread.run(Thread.java:748)
Exception in Application start method
Exception in thread "Thread-0" java.lang.RuntimeException: Exception in Application start method
    at com.sun.javafx.application.LauncherImpl.launchApplication1(LauncherImpl.java:917)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication$1(LauncherImpl.java:182)
    at java.lang.Thread.run(Thread.java:748)
Caused by: java.lang.NullPointerException: Root cannot be null
    at javafx.scene.Scene.<init>(Scene.java:336)
    at javafx.scene.Scene.<init>(Scene.java:194)
    at jp.zenryoku.procon.ProConRPGLogic.start(ProConRPGLogic.java:112)
    at com.sun.javafx.application.LauncherImpl.lambda$launchApplication1$8(LauncherImpl.java:863)
    at com.sun.javafx.application.PlatformImpl.lambda$runAndWait$7(PlatformImpl.java:326)
    at com.sun.javafx.application.PlatformImpl.lambda$null$5(PlatformImpl.java:295)
    at java.security.AccessController.doPrivileged(Native Method)
    at com.sun.javafx.application.PlatformImpl.lambda$runLater$6(PlatformImpl.java:294)
    at com.sun.glass.ui.InvokeLaterDispatcher$Future.run(InvokeLaterDispatcher.java:95)
    at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)
    at com.sun.glass.ui.win.WinApplication.lambda$null$3(WinApplication.java:177)
    ... 1 more

今回はここら辺で。。。
でわでわ。。。

次回:Java プロコンゲーム 〜FXMLを読み込んで表示する〜

関連ページ

Java Basic

  1. Java Basic Level 1 Hello Java
  2. Java Basic Level2 Arithmetic Calculate
  3. Java Basic Level3 About String class
  4. Java Basic Level 4Boolean
  5. Java Basic Level 5If Statement
  6. Java Basic Summary from Level1 to 5
  7. Java Basic Level 6 Traning of If statement
  8. Java Basic Level8 How to use for statement
  9. Java Basic Level 8.5 Array
  10. Java Basic Level 9Training of for statement
  11. Java Basic Level 10 While statement 
  12. Java Basic Swing〜オブジェクト指向〜
  13. Java Basic Swing Level 2〜オブジェクト指向2
  14. サンプル実装〜コンソールゲーム〜
  15. Java Basic インターフェース・抽象クラスの作り方
  16. Java Basic クラスとは〜Step2_1
  17. Java Basic JUnit 〜テストスイートの作り方〜


投稿者:

takunoji

音響、イベント会場設営業界からIT業界へ転身。現在はJava屋としてサラリーマンをやっている。自称ガテン系プログラマー(笑) Javaプログラミングを布教したい、ラスパイとJavaの相性が良いことに気が付く。 Spring framework, Struts, Seaser, Hibernate, Playframework, JavaEE6, JavaEE7などの現場経験あり。 SQL, VBA, PL/SQL, コマンドプロント, Shellなどもやります。

コメントを残す