- 追加された行はこの色です。
- 削除された行はこの色です。
TITLE:JavaFX Script でアイコンのアニメーション
#navi(../)
*JavaFX Script でアイコンのアニメーション [#k5f150de]
>編集者:[[Terai Atsuhiro>terai]]~
作成日:2006-05-18~
更新日:&lastmod;
// TITLE:JavaFX Script でアイコンのアニメーション
// #navi(../)
// *JavaFX Script でアイコンのアニメーション [#k5f150de]
// >編集者:[[Terai Atsuhiro>terai]]~
// 作成日:2006-05-18~
// 更新日:&lastmod;
//
// #contents
//
// **概要 [#ka6e16c6]
// JavaFX ScriptでFireFox風のAnimated Icon を作成します。
//
// //#screenshot
// http://terai.xrea.jp/data/jfx/animatedicon/AnimatedIcon.png
//
// **サンプルコード [#sdbe46e7]
// #code{{
// import javafx.ui.*;
// import javafx.ui.canvas.*;
//
// public class Timer {
// private attribute rotationValue: Number;
// public attribute running: Boolean;
// }
// attribute Timer.rotationValue = bind if running
// then [0,45..360-45] dur 1040 linear
// while running continue if true else 0;
//
// class CircleRtation extends CompositeNode {
// public attribute animating: Boolean;
// attribute radius: Number;
// }
// attribute CircleRtation.radius = 6;
// operation CircleRtation.composeNode() {
// var r = 2*radius;
// var c = 2*r+5; //2>(sqrt(2)+0.5), margin=5+r*(1.5-sqrt(2))
// var t = Timer {running: bind animating};
// return Group {
// transform: bind [rotate(t.rotationValue, c, c), translate(c, c)]
// content: [foreach (i in [1..8]) Circle {
// radius: this.radius,
// fill: bind if hover then red else green,
// opacity: 0.1*i,
// transform: [translate(-r, -r), rotate(i*45, r, r)]
// }, Circle {
// fill: Color{ opacity: 0 }
// radius: 2*r
// onMousePressed: operation(e:CanvasMouseEvent) { t.running = false; }
// onMouseReleased: operation(e:CanvasMouseEvent) { t.running = true; }
// }]
// };
// }
// var cr = CircleRtation{ animating: true };
// Frame {
// title : "JavaFX - Icon Animation"
// width : 320
// height : 120
// content: Canvas { content: cr }
// centerOnScreen: true
// visible: true
// onClose: operation() {
// cr.animating = false;
// }
// };
// }}
// //-&jnlp;
// //-&jar;
// //-&zip;
//
// **解説 [#f26b3d04]
// 準備中
//
// **参考リンク [#c6663f28]
// -[[Simple example of a clock>https://openjfx.dev.java.net/servlets/ReadMsg?listName=users&msgNo=90]]
// -[[Animation Syntax - Planet JFX - a Wikia wiki>http://jfx.wikia.com/wiki/Animation_Syntax]]
//
// **コメント [#xf9978dd]
// #comment
#contents
**概要 [#ka6e16c6]
JavaFX ScriptでFireFox風のAnimated Icon を作成します。
//#screenshot
http://terai.xrea.jp/data/jfx/animatedicon/AnimatedIcon.png
**サンプルコード [#sdbe46e7]
#code{{
import javafx.ui.*;
import javafx.ui.canvas.*;
public class Timer {
private attribute rotationValue: Number;
public attribute running: Boolean;
}
attribute Timer.rotationValue = bind if running
then [0,45..360-45] dur 1040 linear
while running continue if true else 0;
class CircleRtation extends CompositeNode {
public attribute animating: Boolean;
attribute radius: Number;
}
attribute CircleRtation.radius = 6;
operation CircleRtation.composeNode() {
var r = 2*radius;
var c = 2*r+5; //2>(sqrt(2)+0.5), margin=5+r*(1.5-sqrt(2))
var t = Timer {running: bind animating};
return Group {
transform: bind [rotate(t.rotationValue, c, c), translate(c, c)]
content: [foreach (i in [1..8]) Circle {
radius: this.radius,
fill: bind if hover then red else green,
opacity: 0.1*i,
transform: [translate(-r, -r), rotate(i*45, r, r)]
}, Circle {
fill: Color{ opacity: 0 }
radius: 2*r
onMousePressed: operation(e:CanvasMouseEvent) { t.running = false; }
onMouseReleased: operation(e:CanvasMouseEvent) { t.running = true; }
}]
};
}
var cr = CircleRtation{ animating: true };
Frame {
title : "JavaFX - Icon Animation"
width : 320
height : 120
content: Canvas { content: cr }
centerOnScreen: true
visible: true
onClose: operation() {
cr.animating = false;
}
};
}}
//-&jnlp;
//-&jar;
//-&zip;
**解説 [#f26b3d04]
準備中
**参考リンク [#c6663f28]
-[[Simple example of a clock>https://openjfx.dev.java.net/servlets/ReadMsg?listName=users&msgNo=90]]
-[[Animation Syntax - Planet JFX - a Wikia wiki>http://jfx.wikia.com/wiki/Animation_Syntax]]
**コメント [#xf9978dd]
#comment