Pages

Friday, September 14, 2012

JFXtras SimpleGauge

Today just a very short post about a nice little gauge I have added to the JFXtras-labs project...the SimpleGauge. I found this simple gauge on the web where someone created it in JavaScript and it looked like this...


Because this gauge is really simple and simple is most of the times good enough I decided to create something like this in JavaFX. 
The result looks as follows...



The interesting thing about this gauge is the visualization, it uses only one single node to visualize the bar...a simple Arc and the with and rounded ends are done by using setStrokeWidth() and setStrokeLineCap(StrokeLineCap.ROUND).
It uses the same model as the other gauges from the JFXtras-labs project but it only uses a few of it's features. You could adjust the following parameters

  • animate value
  • bar background color
  • bar color
  • bar width
  • font size of the label
  • font size of the unit
  • color of the label
  • color of the unit
  • no of decimals
  • unit

In addition one could add sections like in the other gauges which will change the color of the bar related to the color of the current section. For example if you use the gauge to visualize the temperature you could define a section for a critical area. Lets say from 80°C to 100°C the bar should be red. Therefor you need the following code

SimpleGauge gauge = new SimpleGauge();
Section criticalRange = new Section(80, 100, Color.RED);
gauge.setSection(criticalRange);

I really like this simple gauge because it shows the current value in a nice way and is enough for most of the use cases.

And for those of you who like to see it in action I've uploaded a little screenvideo to youtube.

That's it for today so...keep coding...


No comments:

Post a Comment