Friday Mar 26, 2010

Tech Days 2010 @ Hyderabad

2010 Sun Tech days over. Nice time at presentation and in train too. Nothing more to write. James was good. 

Presentation here: 

 G1 presentation  and mixing Lightweight/Heavyweight components.

Tuesday Dec 22, 2009

LiveConnect improvement in JDK6

JDK6 has done lot of changes in LiveConnect. LiveConnect is a feature in the browser for communication between Java Applet and JavaScript. With the new Plugin2, most of the work has been left on browser to do. Initially it was Java which do a good amount of work. So, now the Java Plug-in will operate like any other scriptable Plug-in. ..............
[Read More]

Tuesday Dec 15, 2009

Lightweight and Heavyweight components - Mess it !

So, if you are a Swing Developer, you have heard many stories where someone messed Lightweight component with Heavyweight component. In one line " A heavyweight component is one that is associated with its own  native screen resource (commonly known as a peer). A lightweight component is one that "borrows" the screen resource of an ancestor  (which means it has no native resource of its own -- so it's "lighter")."

 Now many times you have heard "Don't mix lightweight and heavyweight". What will happen ? Alright, here is a small code : ............

[Read More]

Wednesday Nov 25, 2009

Sorting and OpenJDK

If you are looking for sorting algorithms and if you use some sorting algorithm in your code/application/big application, then have a look here. First of all sorting/searching is a classic thing. It take more than 70 percent of your application time.People/Developer/Mathematician do a lot of work on optimizing this work to get Best, best out of best.

Early days, JDK used to use QuickSort which is one of the best sorting algorithm and go for a complexity of O(nlogn). But mind it, QuickSort is a recursive algorithm and consume space. Whereas some of the algorithm which has the complexity like O(n\^2) go for less complex in terms of memory. These days our platform varies from small mobile device to a terabyte storage machine............

[Read More]

Monday Aug 24, 2009

Debugging basics and some link - Java

Some simple debugging tools related to Java. These are for those who are new to Java.

1. Application is crashing : Most miserable one. Get your log file, try to analysis log. How to write log file, use Java Logger API.  Java Logger had been introduced in JDK 1.4.2. The most awesome feature of  Logger API is that you can use it in production without much overhead. The overhead is controlled by something called level in API. Level goes from FINEST to SEVERE. You can refer to O'Relly Book "Java, In a NutShell". I guess. ...........
[Read More]

Wednesday Aug 12, 2009

Netbeans Java Presentation

Small presentation(actually very small) on Netbeans and Java. Mostly covers the features, netbeans provide for Java SE. Like Profiling, Debugging..

http://blogs.sun.com/vaibhav/resource/BasicOfNetbeans_Java.pdf



Thursday Jun 18, 2009

Browser + Drag + Feature + JavaFX + Profile + Many more :)

Final destination for us is death and final destination of a JavaFX application is Browser. So, we should know what all things we can do with an application, JavaFX application, in browser.

Here are some :

1. Understand when our code will run on browser and when on Desktop/Mobile and optimize the code. Here is a small one :

package appletshow;

import javafx.scene.\*;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.\*;
import javafx.scene.shape.\*;
import javafx.scene.text.\*;
import javafx.stage.\*;

/\*\*
 \* @author Vaibhav Choudhary
 \*/

var textContent = "Hello JavaFX in applet World";
var subtext = "Drag me out for this example(Alt->Drag)";
var vis = false;
var s: Stage = Stage {
    title: "Applet Show"
    width : 600 height : 200
    style: StageStyle.TRANSPARENT
    scene : Scene {
            fill: Color.BLACK
            content: [
                Text { content: textContent
                       x: 25 y:35 fill: Color.WHITE
                       font: Font{size: 24}
                }
                Text { content:  subtext
                       x: 25 y:55 fill: Color.WHITE
                       font: Font{size: 14}
                }

                Rectangle { x: 560 y: 10 width: 20 height: 20
                            arcHeight:5
                            arcWidth: 5
                            stroke:Color.GRAY
                            strokeWidth: 2
                            fill: Color.TRANSPARENT
                            visible: bind ("{__PROFILE__}" != "browser")
                            onMouseClicked: function(e: MouseEvent): Void {
                                s.close();
                            }
                }
                Text {
                    fill: Color.WHITE
                    visible: bind ("{__PROFILE__}" != "browser")
                    font : Font {
                        name:"Arial Bold"
                        size: 14
                    }
                    x: 567, y: 25
                    content: "x"
                }
                ,
            ]
    }
}

Close button will be visible only in browser not in desktop/mobile. So, this is logical, close button should not be in Browser.

2. Remeber, we have draggable feature and things can change from applet inside the browser and when it has been dragged out :).

Now, I want again that when I dragged my applet out of the browser, I get a close button which is logical again, because a dragged application is like a desktop application. So, here we go :)


package appletshow2;

import javafx.scene.\*;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.\*;
import javafx.scene.shape.\*;
import javafx.scene.text.\*;
import javafx.stage.\*;

var textContent = "Hello JavaFX in applet World";
var subtext = "Drag me out for this example(Alt->Drag)";
var vis = false;
var s: Stage = Stage {
    title: "Applet Show"
    width : 600 height : 200
    style: StageStyle.TRANSPARENT
    scene : Scene {
            fill: Color.BLACK
            content: [
                Text { content: textContent
                       x: 25 y:35 fill: Color.WHITE
                       font: Font{size: 24}
                }
                Text { content:  subtext
                       x: 25 y:55 fill: Color.WHITE
                       font: Font{size: 14}
                }

                Rectangle { x: 560 y: 10 width: 20 height: 20
                            arcHeight:5
                            arcWidth: 5
                            stroke:Color.GRAY
                            strokeWidth: 2
                            fill: Color.TRANSPARENT

                    visible: bind vis
                            onMouseClicked: function(e: MouseEvent): Void {
                                s.close();
                            }
                }
                Text {
                    fill: Color.WHITE
                    visible: bind vis
                    font : Font {
                        name:"Arial Bold"
                        size: 14
                    }
                    x: 567, y: 25
                    content: "x"
                }
                ,
            ]
    }
    extensions: [
        AppletStageExtension {
            onDragStarted: function() {
                vis = true;
            }
            onAppletRestored: function() {
                vis  = false;
            }
            useDefaultClose: false
        }
    ]
}

Points to remember : a. useDefaultClose : false, it will vanish the default close button else it will be a mess, seeing too many close buttons. b. AppletStageExtension has lot of other features, please check the API. c. Close button should vanish once it goes back into the browser. 

3. Ah, now most important about dragging feature. I don't want to drag applet with Alt-> Drag feature, I want it should be draggable in simple style like we do with other application, NO COMPLICATION. Use this :)



package shoulddrag;

import javafx.lang.FX;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.AppletStageExtension;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;

/\*\*
 \* @author Vaibhav Choudhary
 \*/

var isApplet = "true".equals
(FX.getArgument("isApplet") as String);
var inBrowser = isApplet;
var dragRect: Rectangle;
var draggable = AppletStageExtension.appletDragSupported;
dragRect = Rectangle {
    x: 0
    y: 0
    width: 240
    height: 40
    opacity: 0.5
    fill: LinearGradient {
        startX: 0.0
        startY: 0.0
        endX: 0.0
        endY: 1.0
        stops: [
            Stop {
                color: Color.BLACK
                offset: 0.0
            },
            Stop {
                color: Color.WHITE
                offset: 0.3
            },
            Stop {
                color: Color.BLACK
                offset: 1.0
            },

        ]
    }
    onMouseDragged: function(e:MouseEvent):Void {
        print(inBrowser);
        stage.x += e.dragX;
        stage.y += e.dragY;
    }
};
var dragTextVisible = bind draggable and dragRect.hover;
var can_drag_me_text: Text = Text {
    content: "You can drag me !"
    fill: Color.BLACK
    font: Font {
        size: 12
        embolden: true
        name: "Arial Bold"
    }

    opacity: 1.0
    visible: bind dragTextVisible
    y: 20
    x: 15
};
var stage = Stage {
    title: "Should Drag"
    width: 250
    height: 280
    style: StageStyle.TRANSPARENT
    scene: Scene {
        content: [
            dragRect,
            Rectangle {
                x: 0,
                y: 40
                width: 240,
                height: 290
                fill: Color.BLACK
            },
            can_drag_me_text
        ]
    }
    extensions: [
        AppletStageExtension {
            shouldDragStart: function(e): Boolean {
                return e.primaryButtonDown and dragRect.hover;
            }
            onDragStarted: function(): Void {
                inBrowser = false;
            }
            onAppletRestored: function(): Void {
                inBrowser = true;
            }
            useDefaultClose: true
        }
    ]
}

Some complication are in code, but be relaxed and see, too easy, RIGHT ? Alright ! What more we can add here...

Please let me know if there is any issue with any of the code. Thanks !

Wednesday Mar 25, 2009

New Articles on JavaFX.com

So, finally we kicked off the new Article section on javafx.com. Go to the "Explore section". Hit "Overview", see "Overview and New Articles". We have 3 articles there right now.

1. Making a Point-Line Graph.

2. Write an app on Mobile.

3. Improve startup time for FX Apps.

and many more to come.

I don't know if there is a link where we can request for articles but you can definetely leave a comment here, we will take care of it :).


Monday Mar 23, 2009

Mega and Micro Challenges on the way ...FX'ing

Some great news for JavaFX developers. 

1.  JavaFX Coding Challenge starting from today, 23rd March.

For more please visit :  http://javafx.com/challenge/

Some eye catching stuff : Prizes, 25000, 10000, 5000, 1500, 100 $. Have a look !  

2. Another Challenge Josh has announced today on jfxstudio.org. Winners of JavaFX Application developer will get new upcoming book of JavaFX. Hava a look here as well.

So, its like writing one application and chance for getting lot of prizes :).

All the best to the competitors.

Friday Mar 20, 2009

Timelines - Ease to Use in JavaFX

JavaFX being an easy language, one complex part is to write proper timeline for animation. Though its quite easy but as beginner I feel problem sometime. And sometime as a Java Developer, we start demanding those things which are generally done by the concept of multi-threading in Java. Remember, JavaFX is single threaded application.

So, this is what I generally follow. Say, If I have a class Ball, which has a circle and every ball has a timeline for its own. Now, if you want One ball move after another ball, I write a master timeline in Main file and there we write something like this :

var t = Timeline {
    repeatCount: 1
    keyFrames: [
         KeyFrame { time:0s action: function(){ t1.t.playFromStart(); } },
         KeyFrame { time:1s action: function(){ t2.t.playFromStart(); } },

    ]
}

Where there is an animation of 1s in t1.t.playFromStart(); So, the next timeline call goes at 1s, means finishing at first one. If you want some initial delay, you can write :

var t = Timeline {
    repeatCount: 1
    keyFrames: [
         KeyFrame { time:1s action: function(){ t1.t.playFromStart(); } },
         KeyFrame { time:2s action: function(){ t2.t.playFromStart(); } },

    ]
}

Means, dont do anything from 0s to 1s.

But, It is possible that you messed up after sometime. For that, you need to check the "javafx.animation.transition" package, one of the awesome packages in FX API's.

Though, example is everywhere in API Doc. I just show a small one, copied from the API' example itself. First car will fade, then move left and right, then rotate, then move again and then zoom.

Code for assistance :

1. Main for timeline problem.

2. Time class for timeline problem

3. Transitions Main Class.


Monday Mar 16, 2009

Play with Space - JavaFX

Spring season is about to come and one can feel the coldness in air. Last week, I went to my home and that week was quite good for my sample writing. Able to finish some of my pending job. 

Back to JavaFX Samples, last week I saw a nice sample written in flash about the ball motion in 3-D space. I try to implement that idea in JavaFX. Code is little dirty, so I will post it later. 

This is how it looks (animation is important) :

To watch the animation, please launch this JNLP.

I hope, you will enjoy it ! 

1. There are 4 polygon, which covers the space, looks like a cricket net practice place :).

2. Launch button will give motion to ball, since the motion is not restored, pressing it again will not work.

3. var scale = z0 / (z0 + z); Scaling with proper value will provide the Z-Camera.

4. Gaussian Blur for shadow, which translate in 2-D and with same timeline.

-- 

Change in Blog : Adding source code :

1. Main File

2. Ball Throw

 This will allow you to relaunch the animation.

Tuesday Mar 10, 2009

Combining Some motions...JavaFX

This is combination of my old examples. But here we can easily see how to delete, insert items from window at runtime. I have integrated 6 of the physics motion in one tree. Actually it makes things little complex, say we have colliding balls on one button and when I go somewhere and come back to colliding balls, it should colliding from begin. So, for some motion we need to restore initial position again. Run the JNLP here :

Jar file is little big, so it will take time.

Monday Mar 09, 2009

Spot Light at spot - JavaFX

There are lot of ways, you can use Lighting effects in JavaFX. All of them have its own use like Spot Light, Distant Light or Point Light. One small sample to show how Spot Light works.

Run the JNLP :

Here is the code :

package lightingeffects;

import javafx.animation.Interpolator;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.effect.light.SpotLight;
import javafx.scene.effect.Lighting;
import javafx.scene.Group;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.scene.text.TextOrigin;
import javafx.stage.Stage;

/\*\*
 \* @author Vaibhav Choudhary
 \*/

var distance = -20.0;
var t = Timeline {
    repeatCount: 200
    autoReverse: true
    keyFrames: [
        KeyFrame {
            time: 6s
            canSkip: true
            values: [
                distance => 200.0 tween Interpolator.LINEAR
            ]
        }
    ]
}
t.play();
Stage {
    title: "Lighting Effects"
    width: 240
    height: 250
    scene: Scene {
        fill: Color.BLACK
        content: [
            Group {
                var t: Text;
                content: [
                    Circle {
                        translateX: bind distance
                        centerX: 20,
                        centerY: 45
                        radius: 30
                        stroke: Color.RED
                        strokeWidth: 2
                        effect: GaussianBlur {
                            radius: 10
                        }
                    }
                    t = Text {
                        translateX: 10
                        translateY: 20
                        effect: Lighting {
                            light: SpotLight {
                                x: bind distance
                                y: 0
                                z: 100
                                pointsAtX: bind distance
                                pointsAtY: 0
                                pointsAtZ: 0
                                specularExponent: 4
                            }
                            surfaceScale: 3
                        }
                        textOrigin: TextOrigin.TOP
                        x: 10
                        y: 10
                        content: "SpotLight"
                        fill: Color.RED
                        font: Font.font(null, FontWeight.BOLD, 40);
                    }
                ]
            }
            Group {
                content: [
                    Circle {
                        translateX: bind distance
                        centerX: 20,
                        centerY: 145
                        radius: 30
                        stroke: Color.GREEN
                        strokeWidth: 2
                        effect: GaussianBlur {
                            radius: 10
                        }
                    }
                    Text {
                        translateX: 10
                        translateY: 120
                        effect: Lighting {
                            light: SpotLight {
                                x: bind distance
                                y: 0
                                z: 100
                                pointsAtX: bind distance
                                pointsAtY: 0
                                pointsAtZ: 0
                                specularExponent: 4
                            }
                            surfaceScale: 3
                        }
                        textOrigin: TextOrigin.TOP
                        x: 10
                        y: 10
                        content: "SpotLight"
                        fill: Color.GREEN
                        font: Font.font(null, FontWeight.BOLD, 40);⁞
                    }
                ]
            },
        ]
    }
}

Wednesday Feb 25, 2009

Easy to use - A Block of JavaFX !

Somewhere in someone blog, I read this "Complex thing should be doable and simple things should be simple" - this is what the power of a Language.

Many of us have seen lot of Samples in JavaFX and my favorites are those in which complex things are done quite easy, like PhotoFlip. http://www.javafx.com/samples/PhotoFlip/index.html. You can see how complex calculation goes for a perspective transform.

Using it in a simpler form, I tried to write Cascade transformed Frames, which looks something like this :



You can play with 2 buttons. Sorry for not making some flashy button, I simple used Swing Buttons.

By code is little buggy, so bear with it.

- Moving Mouse on any frame, will make it front.
- Close button will close that frame. (It is only possible in non-perspective mode).
- Top bar can be useful for dragging the frames(again good at non-perspective mode, in perspective mode, use the left most corner to  drag it, you can figure out why is so ? :) ).
- Text will be as clear as it was in original mode.
- Sharing common reason in case of toFront() make the effect little flckry.

(One problem solved, thanks for José Miguel in comment section - Code changed)

Its all in around 100-150 lines of code.  Feel free for suggestions. This can be used for multi-frame work like showing Car models, parts of engine.

Code :

Main.fx

package cascade;

import cascade.Frame;
import javafx.ext.swing.SwingButton;
import javafx.scene.Group;
import javafx.scene.paint.Color;
import javafx.scene.Scene;
import javafx.stage.Stage;

/\*\*
 \* @author Vaibhav Choudhary
 \*/

var bt: Frame = Frame{ x: 20, y: 140 };
var bt1: Frame = Frame{ x: 100, y: 220};
var bt2: Frame = Frame{ x: 180, y: 300};

var gp = Group {
};
insert bt into gp.content;
insert bt1 into gp.content;
insert bt2 into gp.content;

Stage {
    title: "Application title"
    width: 550
    height: 580
    scene: Scene {
        fill: Color.GRAY
        content: [
            gp
            SwingButton {
                translateX: 10
                translateY: 10
                text: "Transform"
                action: function() {
                    bt1.t.playFromStart();
                    bt.t.playFromStart();
                    bt2.t.playFromStart();
                }
            }
            SwingButton {
                translateX: 100
                translateY: 10
                text: "Normal"
            action: function() {
                bt1.t.rate = -1;    bt1.t.play();
                bt2.t.rate = -1;    bt2.t.play();
                bt.t.rate = -1;     bt.t.play();
            }
            }
        ]
    }
}
Frame.fx
package cascade;

import javafx.animation.Interpolator;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.scene.CustomNode;
import javafx.scene.effect.PerspectiveTransform;
import javafx.scene.Group;
import javafx.scene.input.MouseEvent;
import javafx.scene.Node;
import javafx.scene.paint.Color;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;

/\*\*
 \* @author Vaibhav Choudhary
 \*/


public class Frame extends CustomNode {
    public var startx: Number;
    public var starty: Number;
    public var x: Number;
    public var y: Number;
    var distX: Number;
    var distY: Number ;

    public var clip_ = 0.0;
    public var t = Timeline {
        repeatCount: 1
        keyFrames: [
            KeyFrame {
                time: 1s
                canSkip: true
                values: [
                    clip_ => -150.0 tween Interpolator.LINEAR
                ]
            }
        ]
    }
    public var t_rev = Timeline {
        repeatCount: 1
        keyFrames: [
            KeyFrame {
                time: 1s
                canSkip: true
                values: [
                    clip_ => 0.0 tween Interpolator.LINEAR
                ]
            }
        ]
    }
    public override function create(): Node {
        return Group {
             effect: PerspectiveTransform {
                ulx: 0
                uly: 0
                urx: 300
                ury: bind clip_
                lrx: 300
                lry: bind clip_ + 150
                llx: 0
                lly: 150
            }
            cache: true
            translateX: bind x + startx
            translateY: bind y + starty
            content: [
                Rectangle {
                    x: 0,
                    y: 0
                    opacity: 0.6
                    width: 300
                    height: 150
                    fill: Color.BLACK
 
                    onMouseMoved: function( e: MouseEvent ):Void {
                        this.toFront();
                    }
                },
                Text {
                    fill: Color.WHITE
                    font: Font {
                        size: 14
                        name: "Arial Bold"
                    }
                    x: 10,
                    y: 40
                    content: "I am living on a 3D Frame. You can \\n  transform me using the Transform \\n Button at the top, "
                    "you can set \\n me normal using normal button "
                }
                Rectangle {
                    x: 1,
                    y: 1
                    width: 299,
                    height: 20
                    opacity: 0.8
                    fill: LinearGradient {
                        startX: 0.0
                        startY: 0.0
                        endX: 0.0
                        endY: 1.0
                        stops: [
                            Stop {
                                color: Color.GRAY
                                offset: 0.0
                            },
                            Stop {
                                color: Color.BLACK
                                offset: 1.0
                            },
 
                        ]
                    }
               onMousePressed: function (e:MouseEvent) : Void{
                      distX = startx;
                      distY = starty;
                }
                onMouseDragged: function( e: MouseEvent ):Void {
                      startx =distX  + e.dragX;
                      starty =distY  + e.dragY;
                }
                },
                Rectangle {
                    x: 280,
                    y: 3
                    width: 15,
                    height: 15
                    opacity: 0.7
                    onMouseClicked: function( e: MouseEvent ):Void {
                        this.visible = false;
                    }
                    fill: LinearGradient {
                        startX: 0.0
                        startY: 0.0
                        endX: 0.0
                        endY: 1.0
                        stops: [
                            Stop {
                                color: Color.ORANGE
                                offset: 0.0
                            },
                            Stop {
                                color: Color.DARKRED
                                offset: 0.5
                            },
                            Stop {
                                color: Color.ORANGE
                                offset: 1.0
                            },

                        ]
                    }
                    arcHeight: 5
                    arcWidth: 5
                },
                Text {
                    font: Font {
                        size: 20
                    }
                    x: 283,
                    y: 17
                    content: "x"
                }

            ]
        };
    }
}
View the JNLP here :)

Monday Feb 16, 2009

http://jfxstudio.org - for you !

Today, we have launched a new site for JavaFX Application Development. You all are welcome to join http://jfxstudio.org with your FX application. My contribution is very little on this site but in future I am hoping to put more and more samples here. 

These are sample list till now :

JavaFX Magic 8 ball

JavaFX Prespective Transform

Sliced Image Effect

Dynamic Flow Layout

Tower of Hanoi

JavaFX - Swing Binding (this is very good and simple)

Visualizing Sub Prime Losses

A simple Digital Clock

Data Visualization From JavaFX

Towards a 3D Graphics Engine

Family Tree Visualization

Pie Chart

Experimenting with Form Factor

Dynamic Center Layout

Periodic Table

Snow Fall for your desktop

Pop Pop Bubble

Why you are waiting for :), add your sample in the list. Even if you have a half written or idea of some great sample please share with us, we will work on it further.

About

Hi, I am Vaibhav Choudhary working in Sun. This blog is all about simple concept of Java and JavaFX.

Search

Categories
Archives
« May 2015
SunMonTueWedThuFriSat
     
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
      
Today