JavaFX Coverflow Part 2
Continuing with our previous example, we now create a CustomNode Coverflows, which contain 11 covers.
A new function called positiveOrZero is introduced so that the tilt angle can be negative.
A fill attribute is introduced to the Cover class and it is bound to the Rectangle.
/**
* Coverflow.fx
**/
package coverflow;
import javafx.application.*;
import javafx.animation.*;
import javafx.input.*;
import javafx.scene.geometry.*;
import javafx.scene.*;
import javafx.scene.paint.*;
import javafx.scene.effect.*;
import java.util.Random;
var rnd : Random = new Random();
class Cover extends CustomNode
{
attribute height:Number = 100;
attribute width:Number = 100;
attribute angle:Number = 10; /* 0 to 10 */
attribute fill:Color = Color.WHITE;
function positiveOrZero(v:Number):Number
{
if (v > 0) { return v; } else { return 0; }
}
function create():Node
{
this.opacity = 0.1;
return
Group
{
content:
[
Rectangle
{
width: 100 height: height x: 0 y: 0
fill: this.fill;
effect: Reflection { topOffset:0.0 topOpacity:0.30},
},
]
effect:
PerspectiveTransform
{
llx: bind translateX+0.0 lly: bind translateY+height*2 - positiveOrZero(-angle)
lrx: bind translateX+width lry: bind translateY+height*2 - positiveOrZero(angle)
ulx: bind translateX+0.0 uly: bind translateY + positiveOrZero(-angle)
urx: bind translateX+width ury: bind translateY + positiveOrZero(angle)
}
}
}
}
class Covers extends CustomNode
{
attribute covers:Cover[] =
for (i in [0..10])
Cover {
translateX: if (i==5) {125+i*25} else if (i>5) {150+i*25} else {100+i*25}
translateY: bind this.translateY
angle: if (i5) {-10} else 0
fill: Color.rgb(rnd.nextInt(255), rnd.nextInt(255), rnd.nextInt(255))
};
function create():Node
{
this.covers[5].opacity = 1.0;
return
Group
{
content: covers;
}
}
}
Frame
{
visible: true
title: "Coverflow Part 2"
closeAction: function() { java.lang.System.exit(0); }
width: 800 height: 300
stage: Stage
{
fill: Color.BLACK
content:
[
Covers { translateY: 20 },
]
}
}

2 Comments
Jump to comment form | comments rss [?] | trackback uri [?]