Effect: Animated Gradients - JavaFX Special Effects - page 168

translateY: 480/2-50
width: 350
height: 50
fill: bind createLinearGradient([
Stop{color:Color.YELLOW, offset:0.0},
createStop(createColor(1.0, 1.0, 0.0, opacity), offset),
Stop{color:Color.YELLOW, offset:1.0},
]);
}
insert Label{
translateX: 300
translateY: 205
text: "Opacity"
scaleX: 3
scaleY: 3
} into group.content;
insert rect into group.content;
var anim = Timeline{
repeatCount: Timeline.INDEFINITE;
autoReverse: true;
keyFrames: [
KeyFrame{
time: 0s
values: opacity => 1.0
},
KeyFrame{
time: 2s
values: opacity => 0.3
},
KeyFrame{
time: 4s
values: [
offset => 1.0 ,
opacity => 1.0
]
}
]
}
anim.play();
}
Listing 8-13 again shows a Rectangle with its fill being set. In this case the middle Stop has both its
color and offset components set to a value that is animated. The Timeline named anim increases the
value of the variable offset from 0.0 to 1.0 in four seconds. The Timeline anim also decreases the value of
opacity from 1.0 to 0.3 over two seconds, then increases it back to 1.0 over the last two seconds. In this
way, the animated Stop starts out on the left, fully opaque. Then as it moves to the right, it becomes
more transparent until it reaches the middle where it becomes more opaque again and continues to the
right. While the Stop is partially transparent, the word Opacity is visible. The visible text is just a Text
node behind the rectangle.