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