javafx를 사용하여 for 루프를 사용하여 장면의 모양 업데이트

Question

다음은 코드 조각입니다. 단추를 누를 때 for 루프를 사용하여 사각형을 업데이트하고 있습니다. 이것은 for 루프 내에서 많은 시간을 변경함에 따라 데이터 모델의 시각화를 보여주는 궁극적 인 목표를위한 모델입니다. 그것은 효과가 있지만 단 하나의 변화 만 보입니다. 이제 무작위로 너비를 변경하고 있기 때문에 많은 변화가 있어야합니다. 내가 뭔가 근본적인 것에 대해 잘못된 가정을하고있는 것처럼 보입니다.

은 아래 코드는 간다 :

그것은 어떤 일이 일어나고하면 변경 사항이 장면 그래프 업데이트를 유지할 수 없습니다 너무 빨리 일이 방금까지 그들을 볼 수 없다는 것입니다처럼 보이는

 
7 var rec: Rectangle = Rectangle { 

8    x: 10, y: 10 
9    width: 140, height: 90 
10    fill: Color.BLACK 
11   } 
12 
13 Stage { 

14  title: "MyApp" 
15  scene: Scene { 
16   width: 200 
17   height: 200 
18   content: [ 

19    rec, 
20    Button { 
21     text: "Button" 
22     action: function() { 

23      for (i in [1..999]) { 
24       rec.width = 25 + java.lang.Math.random()*50; 
25      } 
26     } 

27    } 
28   ] 
29  } 
30 }

Answer 1

마지막 업데이트

리팩토링은 다음과 같이 약간 더 제어 할 수 있습니다 (원하는대로 새로 고침 빈도를 업데이트하고 원하는대로 애니메이션을 시작 및 중지 할 수 있음).

var rec: Rectangle = Rectangle { 
      x: 10, y: 10 
      width: 140, height: 90 
      fill: Color.BLACK 
     } 


var timeline = Timeline { 
    repeatCount: 20 
    keyFrames : [ 
     KeyFrame { 
      time : 100ms 
      canSkip : true 
      action: function(): Void { 
       rec.width = 25 + java.lang.Math.random()*50; 
      } 
     } 
    ] 
} 

Stage { 
    title: "MyApp" 
    scene: Scene { 
     width: 200 
     height: 200 
     content: [ 
      rec, 
      Button { 
       text: "Button" 
       action: function() { 
        timeline.playFromStart(); 
       } 
      } 
     ] 
    } 
}