JavaFX – Pong

This time I decided to go a little backwards and do a small re-implementation of the Pong in Java language by using the JavaFX API. This idea came into my mind after I decided to refresh my Swing API skills and then hit some articles which demonstrated how JavaFX would become the successor to Swing. As I did not have any previous experience from the JavaFX, I thought that it would be an interesting journey to see how it suits for a small and simple game development.

At the beginning…

The starting point was quite clear. I would do a small Pong game implementation and mostly try to use the logical structures that were created in HTML5-Pong and SDL2-Pong. I created the Java project as a simple Maven project which would compile as a Java 8 application. Now thinking this afterwards, I think that this was a bit overkill as the project structure became having too deep folder nesting and unnecessary elements. Perhaps it could’ve been sufficient to have a normal and simple Java project structure as the project did not require external library attachments or other Maven functionality.

I decided to use Eclipse IDE as it’s mine preferred choice of IDE for Java development. After I created the project structure, I noticed that I get odd error messages about the unauthorized API usage when I tried to use the JavaFX API (jfxrt.jar) from the project. See the following snapshot from my Eclipse log about these problems.

javafx_restrictions

After a bit of searching and head scratching I noted that Eclipse was not correctly using and linking the jfxrt.jar file from the JDK. This can be solved by explicitly assigning the target JDK runtime from the Project -> Properties -> Project Facets -> Runtimes page. All warnings went away after selecting the correct JDK and applying the changes.

Game structure

 I decided to use the same split for the application that I used in the previous versions. I created a root application structure into the PongApplication class. This class extends the JavaFX Application class which seems to be the root for all JavaFX applications. It seems to require each application to implement at least the start function that constructs the primary Stage structure, which is used as the top level container for all JavaFX items.

In addition to start function, the Application also provides a support for overriding initial and stop functions to perform some additional operations when performing the application initialization or stopping. I decided to use the latter to ensure that the application main loop is being stopped when the application is closing. The actual main loop was implemented with the AnimationTimer class, which was one solution that seemed to be a quite common way to get the system to tick the game logic with 60 fps. Perhaps this was a bit lazy solution, but it seemed to be enough for a small Pong game.

I decided to build a general interface for providing ticks for the active scene by extending the JavaFX Scene class with own AbstractScene class that has an abstract tick function. Each of the three scenes (Welcome-, Court- and EndGameScene) extend this class and in this way allow the game loop to throw ticks for the scene logic. I’m not sure whether JavaFX would have some more sophisticated inbuilt mechanism for this already?

Game entities

JavaFX uses scene graph as the way to organize the items in the scene. This seemed a bit similar than what I used when we had some school projects that used OpenSceneGraph. The idea about a tree-hierarchy is quite easy to adapt as it has a quite clear parent-child relationship and inherited (and accumulated) properties from top-to-down. JavaFX also provided a nice set of rendering items (e.g. Text and Rectangle) that allowed to build the scene contents in a quite agile way.

There was actually some interesting features that made me scratch my head a bit. The way how JavaFX handles coordinates is quite interesting. I first started to create and place visual objects by setting their x- and y-coordinates with setX and setY functions. This completely messed up the way how objects were placed and moved in the scene. After a bit of wondering I found out that each node should be placed into layout with the setLayoutX and setLayoutY functions. After changing the object construction to use these, the objects started to move in the correct places in the scene. I also decided to use these functions to also move objects in the court scene. Perhaps a more elegant way would be to use the translation component definitions that seemed to be supported by the framework as well. It seems that JavaFX has multiple ways to perform object translation.

The framework has also an inbuilt support for the bounding volumes that allowed to skip manually writing the AABB collision detection structures and mechanisms. This saved a lot of boilerplate and seemed to work efficiently enough.

Summary

I’m quite surprised how well JavaFX seems to work in game development. While this project was only a scratch on the JavaFX, I’m still quite convinced that the library could be used even with some bigger games. JavaFX is also big. I’m also quite sure that some parts of my code can be considered as a unnecessary boilerplate that could be left out and use some JavaFX specific implementations instead. One superb thing in JavaFX is that it also has a support inbuilt user interface components which allows a quite easy and rapid development for a game along with the game editor with the same library.

Thanks for reading!

Game source code in GitHub: https://github.com/toivjon/javafx-pong

Advertisements

3 thoughts on “JavaFX – Pong

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s