Java etc...


help RSS The JavaFX Properties binding(3)

<<   作成日時 : 2013/01/31 00:29   >>

ブログ気持玉 0 / トラックバック 0 / コメント 0

The JavaFX Properties binding for computing the area of triangle(3)

This article is a continuation of The JavaFX Properties binding for computing the area of triangle(2).

The goals of this part are that
  1. make it possible to input the values of the both x-coordinates and y-coordinates of three vertices of triangle into the TextFields which were introduced at the previous part,
  2. reflect the location the circles and lines for three vertices and sides to the inputted values.

The current code is the property binding is unidirectional, the centerX and centerY properties for the vertices is bound to the text properties of the TextFields. Now, It is nice way for the goals to make the bindings direction changes to bidirectional.

Here is the code fragments for the change to the bidirectional binding.

First of all, two import statements as follows are added on the current code.

import javafx.util.StringConverter;
import javafx.beans.binding.Bindings;

Then, two StringConverter instances are created. They convert the type and value representing the vertices. One is for x-coordinates and, the other is for y-coordinates.

The converter has two methods, which are fromString() and toString().

The fromString() method is perform the type and value conversions the String value in TextField to double value of the pixel position on the scene. The toString() method is perform the type and value conversion the double value of the pixel position on the scene to String value in the TextField.

Here is the implementation code.

  StringConverter<Number> sc_x =
   new StringConverter<Number>() {
    @Override public Number fromString(String from) {
      double map_x = Double.parseDouble(from);
      double org_x = 10 + (map_x*96/2.54);
      return new Double(org_x);
    @Override public String toString(Number org_x) {
      double map_x = (org_x.doubleValue()-10)*2.54/96;
      return String.format("%2.1f", map_x);

  StringConverter<Number> sc_y =
   new StringConverter<Number>() {
    @Override public Number fromString(String from) {
      double map_y = Double.parseDouble(from);
      double org_y = 490 - (map_y*96/2.54);
      return new Double(org_y);
    @Override public String toString(Number org_y) {
      double map_y = (490 - org_y.doubleValue())*2.54/96;
      return String.format("%2.1f", map_y);

  // change the class name to TriangleArea2
  public TriangleArea2() {

    for(int i = 0; i < 3; i++) {
      int j = (i == 2) ? 0 : i+1;


      // bind bidirectional
      // between the clicked position and
      // the center[X|Y]Property of Circle
        c[i].centerXProperty(), org_x[i]);
        c[i].centerYProperty(), org_y[i]);

      // bind bidirectional
      // between the center[X|Y]Property of Circle and
      // textProperty of TextField with StringConverter
        tx[i].textProperty(), c[i].centerXProperty(), sc_x);
        ty[i].textProperty(), c[i].centerYProperty(), sc_y);

    // ...

be able to specify the vertices by both mouse click and input the value in TextField

Inputing the value in TextField, such as shown by the yellow circle in above figure, then the position of Circle and Line is reflected by the input value.

Even with intention of clicking on the intersection point of vertical and horizontal lines, the clicked position might be off the exact point of the intersection. In such situation, the TextField for inputs are useful to the adjust the positions.

Now, we reach the goal of this part.

What shall we do next part ?

The new idea is that it allow you to make touch three points on the screen at the same time. The multi touch gesture events might be suitable for it.

To be continued.


注目テーマ 一覧





タイトル (本文) ブログ名/日時

トラックバック用URL help

自分のブログにトラックバック記事作成(会員用) help

本 文


内 容 ニックネーム/日時

コメントする help

本 文
The JavaFX Properties binding(3) Java etc.../BIGLOBEウェブリブログ