JavaFX TimeTracking with Beagleboard-xm

Post to Twitter

My first JavaFX "embedded" application is ready.

The application is a time tracking tool. It uses RFID cards for user authentication and sends time entries to a remote Redmine project management tool. It works great.... now.

Before I continue, a screenshot of the current application taken via VNC from my Beagleboard:

Time tracking

Time tracking

... I'm not a UI designer ;-)

My first design was a little bit different because I began to develop on my Windows Laptop and used some nice transitions and effects. The first layout was this:

Time tracking (Laptop)

Time tracking (Laptop)

Some problems with this design - on my Beagleboard - were bad peformance of TableView updates, slow transitions, problems with innershadow effect:

Time tracking (1:1)

Time tracking (1:1)

I don't know why the shadow effect worked for the table border, but the UI was not usable. It was too slow and the clock was not shown because of other problems described from Gerrit Grunwald.

After short frustration, I began to tweak:

  • Replaced TableView with ListView
  • Replaced Clock from JFXtras with a styled Label
  • Smaller buttons for better performance
  • Specific stylesheets for embedded environment

It was not a lot of work to change the application, but I thought the performance would be better. It's very important to reduce effects and transitions for applications that should run on an embedded device like Beagleboard-xm. It's a little bit like developing mobile applications (touch instead of mouse, screen size, performance, ...).

The current JavaFX embedded runtime is not perfect and the performance could be better, but if you are careful, you can create very useful applications.

And finally a picture of my hardware:

Hardware

Hardware

Leave a Reply

Spam protection by WP Captcha-Free