# Theory matters

Notes from a student of Computer Science at the University of Pisa

## JavaFX Crayon Physics

I definitely overestimated my free time :)

In these months, while studying for exams, I’ve started programming a JavaFX clone of Crayon Physics, an impressive game based on the 2D physical engine Box2D made by Erin Catto. The goal was to have a final project for the Graphical Interfaces course, and to participate the latest JavaFX contest.

## Try Pastello!

I’ve uploaded the preview version of the game with some playable levels that I’ve submitted to the contest. I called it “Pastello” (the italian for crayon).

## The physics engine

I tried two different Java physics engines: JBox2d and Phys2D but, in the end, I used Phys2d because it’s more Java-like (JBox2d maintains the same Box2d C++ structure), and because have better convex polygon support (but it’s quite slower, as shown here: http://ciardhubh.de/node/15).

I toke inspiration from the JavaFX-Phys2D interaction shown in this post, but I extended the original idea of PhysicalObject/PhysicalScene, making it a bit more flexible with an object hierarchy of different physical shapes, which I think can be easily reused as it is. But the fundamental idea is just the same: there is a JavaFX timeline that periodically calls the step() function of the physical world model and updates the graphical rapresentation of all the objects.

## The level editor

Yes, there is a level editor that lets you create levels and load/store them as JSON files (I’m nauseated by XML -_- ), for example this is the first level generated by the editor:

```[{"name":"Text","x":220,"y":120,"content":"text..."},
{"w":588,"isStatic":true,"name":"Box","h":67,"y":373.5,"x":392},
{"name":"Flag","y":304,"x":621}]```

To do that I used the json.org java library because it’s very easy to use (also from JavaFX) and I was not very satisfied by JavaFX PullParser.

I’ve found some difficulties, but I’ve been also very surprised by elegant solution you can acheive with functional programming applied to graphics. An example:

```var visualPolygon = Polygon {
points: bind [
firstPick.x, firstPick.y,
curPick.x, curPick.y,
if(curPick.y > firstPick.y) [firstPick.x, curPick.y]
else [curPick.x, firstPick.y]
]
}```

This means that visualPolygon is a Polygon (JavaFX graphical node) whose points are defined by a Sequence (a sort of JavaFX mutable list) made like this: $s = (x_0, y_0, x_1, y_1, ..., x_n, y_n)$. The funny fact is that the third couple of points is defined by an if…else statement (a function). The funniest fact is that the points are bound with the Sequence expression: every time any of the involved variables are changed (firstPick and curPick), the vertices of the polygon change. Binding is not efficent, and should be used as less as possible, maybe because it has not yet been improved in JavaFX, but it is extremely practical.

## Credits

Written by C.Santini

May 28, 2009 at 4:14 pm

Posted in JavaFX

Tagged with , ,