w3hJava

What, Why, When and How of Java, JavaFX and related technologies


Published August 22nd, 2008

Gradient in Java FX - Shading and 3D effect !

One thing that makes life very easy in JavaFX is the effect of Gradient. There are two types of Gradient support in JavaFX - Linear and Radial.

Linear Gradient is good for shading like

So, you can see the gradient of Black and Red on ball.  Why 2 circle because in this code, I want to show you how to achieve same effect from proportional coordinate and from absolute coordinate :-). Here is the code:

package gradientexample;

import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.geometry.Rectangle;
import javafx.scene.paint.Color;
import javafx.scene.paint.*;
import javafx.scene.geometry.Circle;

Frame {
title: "MyApplication"
width: 500
height: 500
closeAction: function() { java.lang.System.exit( 0 );
}
visible: true

stage: Stage {
content: [

Circle {
centerX: 100, centerY: 100
radius: 40
fill: LinearGradient {
startX: 0.0
startY: 0.0
endX: 1.0
endY: 0.0
proportional: true
stops: [
Stop { offset: 0.0 color: Color.BLACK },
Stop { offset: 1.0 color: Color.RED }
]
}
},

Circle {
centerX: 200, centerY: 200
radius: 40
fill: LinearGradient {
startX:   160.0
startY:   0.0
endX: 240.0
endY: 0.0
proportional: false
stops: [
Stop { offset: 0.0 color: Color.BLACK },
Stop { offset: 1.0 color: Color.RED }
]
}
}

]
}
}

Now, Have a look of Radial Gradient, this can be used to generate 3D effect on a ball like :

Here is the code for 3D ball generator. Just click on the button on the top and it will keep on generating the random color, select the good for your application and just put it :)

Here goes the code:

package gradientexample;

import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.geometry.Rectangle;
import javafx.scene.paint.Color;
import javafx.scene.paint.*;
import javafx.scene.geometry.Circle;
import javafx.ext.swing.Button;
import java.util.Random;
import javafx.ext.swing.ComponentView;
import  javafx.scene.effect.*;

var color: Color = Color.RED;

var rnd : Random = new Random();

var button = Button {
text: "3D Ball Generator"
action: function() {
color = Color.rgb(rnd.nextInt(255),rnd.nextInt(255),rnd.nextInt(255))
}
}
Frame {
title: "3D Ball Generator"
width: 700
height: 700
closeAction: function() { java.lang.System.exit( 0 );
}
visible: true

stage: Stage {
fill: Color.GRAY
content: [
Circle {
centerX: 200, centerY: 200
radius: 70
fill: bind RadialGradient {
centerX: 170
centerY: 170
radius: 100
proportional: false
stops: [
Stop { offset: 0.0 color: Color.WHITE },
Stop { offset: 1.0 color: color },
]
}
effect: GaussianBlur   {
radius: 70
input: Flood {
paint: Color.BLACK
}
}
opacity: 0.6
},
ComponentView {
component: button
}

]
}
}

Lot of good examples on these gradient are available on net.

Published August 7th, 2008

Binding Swing component in JavaFX

Just an small example of putting Swing code in JavaFX and binding it as well. Here I am binding the Swing Component Slider with ImageView. The opacity of Image will change according to the slider value.  Here is the code :

package newapplication;

import javafx.application.*;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;
import javafx.ext.swing.*;

var slide = Slider {
    minimum: 0
    maximum: 100
    value: 0
}
Frame {
    title: "JavaFX Code", width: 600, height: 600, visible: true

    stage: Stage {
        content: [
            ImageView {
                image: Image {
                    url: "http://gretawire.files.wordpress.com/2007/10/baby1.jpg"
                }
                opacity: bind (slide.value) / 100.0
            },
            ComponentView {
                component: slide
                translateX: 200
                translateY: 530
            }
        ]
    }
}

Now here we can see the opacity movement with the slider component movement.

Published August 1st, 2008

Rotating balls JavaFX in ease style

Here is again a small code of JavaFX. Rotating some colorful circle in ease style. It mean, it will stop in flash way, I mean slow at the end and the begining.

Check out the code:

package newfx;

import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.geometry.Circle;
import javafx.scene.paint.Color;
import javafx.animation.Timeline;
import javafx.animation.KeyFrame;
import javafx.application.*;

import javafx.scene.*;
import javafx.scene.geometry.*;
import javafx.animation.*;
import javafx.scene.transform.*;

var angle = 0.0;

var anim = Timeline { keyFrames: [
KeyFrame { time: 5s values: angle => 360 tween Interpolator.EASEBOTH },
]
autoReverse: true
repeatCount: Timeline.INDEFINITE
};
anim.start();

Frame {
title: “MyApplication”
width: 900
height: 900
closeAction: function() { java.lang.System.exit( 0 );
}
visible: true
stage: Stage {
fill: Color.BLACK;
content: Group {
translateX: 400 translateY: 400
content: for(i in [0..5]) {
Circle {
centerX: bind(i*60), centerY: 50
radius: 40
fill: Color.rgb(255 - i*40,i*40,0)
strokeWidth:2
stroke:Color.BLACK
transform:bind[
Transform.rotate(angle,50,50),
]
}
}
}
}
}

Here is one snap shot:

Published July 11th, 2008

JavaFX and corresponding Java code

Tough to understand the code conversion :). I have seen the Java code of corresponding JavaFX code. Though its tough to map but we can see the correct correspondence. Let see this :

import javafx.ui.*;

Frame {
title: "Hello World JavaFX"
width: 200
content: Label {
text: "Hello World"
}
visible: true
}

and the corresponding Java Code:

import com.sun.javafx.runtime.Entry;
import com.sun.javafx.runtime.FXObject;
import com.sun.javafx.runtime.InitHelper;
import com.sun.javafx.runtime.Public;
import com.sun.javafx.runtime.Static;
import com.sun.javafx.runtime.location.AbstractVariable;
import com.sun.javafx.runtime.location.BooleanVariable;
import com.sun.javafx.runtime.location.DoubleVariable;
import com.sun.javafx.runtime.location.ObjectVariable;
import com.sun.javafx.runtime.sequence.Sequence;
import javafx.ui.Frame;
import javafx.ui.Frame.Intf;
import javafx.ui.Label;
import javafx.ui.Label.Intf;

public class Hello
implements Hello.Intf, FXObject
{
@Public
@Static
public static Object javafx$run$(Sequence<? extends String> paramSequence)
{
Frame localFrame = new Frame(true);
localFrame.get$title().setFromLiteral("Hello World JavaFX");
localFrame.get$width().setAsDoubleFromLiteral(200.0D);
Label localLabel = new Label(true);
localLabel.get$text().setFromLiteral("Hello World");

localLabel.initialize$(); localFrame.get$content().setFromLiteral(localLabel);

localFrame.get$visible().setAsBooleanFromLiteral(true);

localFrame.initialize$(); return localFrame; }
public void initialize$() { addTriggers$(this); userInit$(this); postInit$(this); InitHelper.finish(new AbstractVariable[0]); }
public static void addTriggers$(Hello.Intf paramIntf) {  }
public Hello() { this(false); initialize$(); }
public static void userInit$(Hello.Intf paramIntf) {  }
public static void postInit$(Hello.Intf paramIntf) {  }
public static void main(String[] paramArrayOfString)
throws Throwable { Entry.start(Hello.class, paramArrayOfString);
}
}

This I have done by generating the class file and then de-compiled the class file.

Frame of JavaFX - Frame localFrame = new Frame(true);
title and text of JavaFX
- localFrame.get$title().setFromLiteral(”Hello World JavaFX”);
-  localLabel.get$text().setFromLiteral(”Hello World”);

Visibility of JavaFX - localFrame.get$visible().setAsBooleanFromLiteral(true);

Lot of code is written to support JavaFX environment, which is completely justifiable. Don’t able to get why methods are written with $. If any clue, please let us know also.