(Add Swing prefix) |
|||
Line 6: | Line 6: | ||
<code><pre> |
<code><pre> |
||
+ | /* |
||
⚫ | |||
+ | * AnimationSimple.fx |
||
⚫ | |||
+ | * JavaFX version 1.0 |
||
⚫ | |||
+ | * Created on Dec 20, 2008, 9:25:19 PM |
||
+ | */ |
||
import javafx.animation.*; |
import javafx.animation.*; |
||
− | import |
+ | import javafx.ext.swing.SwingButton; |
⚫ | |||
⚫ | |||
⚫ | |||
+ | import javafx.stage.Stage; |
||
+ | var stageX = 0; |
||
+ | var stageY = 0; |
||
+ | def sceneWidth = 500; |
||
+ | def sceneHeight = 250; |
||
+ | def buttonFromBottom = 70; |
||
var x = 0; |
var x = 0; |
||
Line 18: | Line 29: | ||
repeatCount: 3 |
repeatCount: 3 |
||
autoReverse: true |
autoReverse: true |
||
− | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
+ | time: 0s |
||
⚫ | |||
+ | KeyFrame{ |
||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
− | SwingFrame { |
||
− | closeAction: function(): Void {System.exit(0);} |
||
− | |||
⚫ | |||
− | background : Color.WHITE; |
||
⚫ | |||
− | visible : true |
||
+ | var startButton: SwingButton = SwingButton{ |
||
⚫ | |||
− | + | text: "Start" |
|
− | + | translateX: 75 |
|
− | + | translateY: sceneHeight - buttonFromBottom |
|
− | + | action: function(): Void{ |
|
− | + | t.playFromStart(); |
|
− | + | } |
|
+ | }; |
||
+ | var pauseButton: SwingButton = SwingButton{ |
||
+ | translateX: startButton.translateX + startButton.width + 5 |
||
+ | translateY: sceneHeight - buttonFromBottom |
||
+ | text: "Pause" |
||
⚫ | |||
+ | t.pause(); |
||
+ | } |
||
+ | }; |
||
+ | var resumeButton: SwingButton = SwingButton{ |
||
+ | translateX: pauseButton.translateX + pauseButton.width + 5 |
||
+ | translateY: sceneHeight - buttonFromBottom |
||
+ | text: "Resume" |
||
⚫ | |||
⚫ | |||
+ | } |
||
+ | }; |
||
+ | var stopButton: SwingButton = SwingButton{ |
||
+ | translateX: resumeButton.translateX + resumeButton.width + 5 |
||
+ | translateY: sceneHeight - buttonFromBottom |
||
⚫ | |||
⚫ | |||
⚫ | |||
+ | } |
||
+ | }; |
||
+ | Stage { |
||
⚫ | |||
+ | scene: Scene{ |
||
+ | width: sceneWidth |
||
+ | height: sceneHeight |
||
⚫ | |||
+ | Rectangle { // the moving blue square |
||
+ | x: bind x |
||
+ | y: 0 |
||
+ | width: 100 |
||
+ | height: 100 |
||
+ | fill: Color.BLUE |
||
} |
} |
||
⚫ | |||
+ | startButton, |
||
− | + | pauseButton, |
|
− | SwingButton{text : "Start" |
||
⚫ | |||
− | + | resumeButton, |
|
⚫ | |||
− | + | stopButton |
|
⚫ | |||
⚫ | |||
⚫ | |||
+ | } // Scene |
||
⚫ | |||
+ | }//Stage |
||
⚫ | |||
⚫ | |||
− | }//BorderPanel |
||
− | }//SwingFrame |
||
⚫ | |||
⚫ | |||
== AnimationTwoValues.fx == |
== AnimationTwoValues.fx == |
Revision as of 05:40, 21 December 2008
Simple animation examples with Timeline{}/KeyFrame{} for the JavaFX Script Compiler.
AnimationSimple.fx
/*
* AnimationSimple.fx
* JavaFX version 1.0
* Created on Dec 20, 2008, 9:25:19 PM
*/
import javafx.animation.*;
import javafx.ext.swing.SwingButton;
import javafx.scene.paint.*;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
var stageX = 0;
var stageY = 0;
def sceneWidth = 500;
def sceneHeight = 250;
def buttonFromBottom = 70;
var x = 0;
var t = Timeline {
repeatCount: 3
autoReverse: true
keyFrames: [KeyFrame{
time: 0s
values: x => 0},
KeyFrame{
time: 2s
values: x => 400 tween Interpolator.LINEAR}
]//keyFrames
}//Timeline;
var startButton: SwingButton = SwingButton{
text: "Start"
translateX: 75
translateY: sceneHeight - buttonFromBottom
action: function(): Void{
t.playFromStart();
}
};
var pauseButton: SwingButton = SwingButton{
translateX: startButton.translateX + startButton.width + 5
translateY: sceneHeight - buttonFromBottom
text: "Pause"
action: function(): Void{
t.pause();
}
};
var resumeButton: SwingButton = SwingButton{
translateX: pauseButton.translateX + pauseButton.width + 5
translateY: sceneHeight - buttonFromBottom
text: "Resume"
action: function(): Void{
t.play();
}
};
var stopButton: SwingButton = SwingButton{
translateX: resumeButton.translateX + resumeButton.width + 5
translateY: sceneHeight - buttonFromBottom
text: "Stop"
action: function(): Void{
t.stop();
}
};
Stage {
title: 'Animation: Simple'
scene: Scene{
width: sceneWidth
height: sceneHeight
content: [
Rectangle { // the moving blue square
x: bind x
y: 0
width: 100
height: 100
fill: Color.BLUE
}
startButton,
pauseButton,
resumeButton,
stopButton
] //content
} // Scene
}//Stage
AnimationTwoValues.fx
import javafx.ext.swing.*;
import javafx.scene.geometry.*;
import javafx.scene.paint.*;
import javafx.animation.*;
import java.lang.System;
var x = 0;
var y = 0;
var t = Timeline {
repeatCount: 3
autoReverse: true
keyFrames: [KeyFrame{time : 0s
values: [x => 0,
y => 0]},
KeyFrame{time : 2s
values: [x => 400 tween Interpolator.LINEAR,
y => 200 tween Interpolator.LINEAR]}
]//keyFrames
}//Timeline;
SwingFrame {
closeAction: function(): Void {System.exit(0);}
title : 'Animation: Two values'
background : Color.WHITE;
width : 550
height : 400
visible : true
content: BorderPanel{
top: Canvas {content:
Rectangle {x : bind x
y : bind y
width : 100
height: 100
fill : Color.BLUE
}
}//Canvas
bottom: FlowPanel{content: [
SwingButton{text : "Start"
action: function(): Void{t.start();}},
SwingButton{text : "Pause"
action: function(): Void{t.pause();}},
SwingButton{text : "Resume"
action: function(): Void{t.resume();}},
SwingButton{text : "Stop"
action: function(): Void{t.stop();}}
]}//FlowPanel
}//BorderPanel
}//SwingFrame
AnimationNested.fx
import javafx.ext.swing.*;
import javafx.scene.geometry.*;
import javafx.scene.paint.*;
import javafx.animation.*;
import java.lang.System;
var xRed = 0;
var xGreen = 0;
var xBlue = 0;
var t = Timeline {
repeatCount: 3
autoReverse: true
keyFrames: [KeyFrame{time : 0s
action: function(): Void{System.out.println("Start red");}
values: xRed => 0},
KeyFrame{time : 250ms
timelines: [Timeline {
keyFrames: [KeyFrame{time : 0s
action: function(): Void{System.out.println("Start green");}
values: xGreen => 0},
KeyFrame{time : 250ms
timelines: [Timeline {
keyFrames: [KeyFrame{time : 0s
action: function(): Void{System.out.println("Start blue");}
values: xBlue => 0},
KeyFrame{time : 2s
values: xBlue => 400 tween Interpolator.LINEAR}
]// keyFrames blue
}]//timelines blue
},
KeyFrame{time : 2s
values: xGreen => 400 tween Interpolator.LINEAR}
]//keyFrames green
}]//timelines green
},
KeyFrame{time : 2s
values: xRed => 400 tween Interpolator.LINEAR}
]//keyFrames red
}//Timeline;
SwingFrame {
closeAction: function(): Void {System.exit(0);}
title : 'Animation: Nested timelines'
background : Color.WHITE;
width : 550
visible : true
content: BorderPanel{
top: Canvas {content: [
Rectangle {x : bind xRed
y : 0
width : 100
height: 100
fill : Color.RED
},
Rectangle {x : bind xGreen
y : 110
width : 100
height: 100
fill : Color.GREEN
},
Rectangle {x : bind xBlue
y : 220
width : 100
height: 100
fill : Color.BLUE
}
]}//Canvas
bottom: FlowPanel{content: [
SwingButton{text : "Start"
action: function(): Void{t.start();}},
SwingButton{text : "Pause"
action: function(): Void{t.pause();}},
SwingButton{text : "Resume"
action: function(): Void{t.resume();}},
SwingButton{text : "Stop"
action: function(): Void{t.stop();}}
]}//FlowPanel
}//BorderPanel
}//SwingFrame
AnimationFading.fx
import javafx.ext.swing.*;
import javafx.scene.geometry.*;
import javafx.scene.paint.*;
import javafx.animation.*;
import java.lang.System;
var opacity = 0.0;
var t = Timeline {
repeatCount: Timeline.INDEFINITE
autoReverse: true
keyFrames: [KeyFrame{time : 0s
values: opacity => 0.0},
KeyFrame{time : 3.5s
values: opacity => 1.0 tween Interpolator.EASEBOTH}
]//keyFrames
}//Timeline;
SwingFrame {
closeAction: function(): Void {System.exit(0);}
title : 'Animation: Fading'
background : Color.WHITE;
width : 450
height : 550
visible : true
content: BorderPanel{
top: Canvas {content:
Rectangle {x : 20
y : 20
width : 400
height : 400
fill : Color.BLUE
opacity: bind opacity
}// Rectangle
}//Canvas
bottom: FlowPanel{content: [
SwingButton{text : "Start"
action: function(): Void{t.start();}},
SwingButton{text : "Pause"
action: function(): Void{t.pause();}},
SwingButton{text : "Resume"
action: function(): Void{t.resume();}},
SwingButton{text : "Stop"
action: function(): Void{t.stop();}}
]}//FlowPanel
}//BorderPanel
}//SwingFrame