Home > JavaFX > Simple Splash Screen Animation

Simple Splash Screen Animation


Splash Screen ini menggunakan Animasi JavaFX.

SreenShoot

Source Code

/*
 * This Project created by Pizaini
 * zheiner.taurus@gmail.com
 * visit "pizaini.wordpress.com"
 *
 * Intel Centrino
 *  Copyright 2010 by Pizaini
 */
/*
 * MySplash.fx
 *
 * Created on 29 Jan 10, 13:30:47
 */

package mysplashscreen.pizaini.wordpress;

import javafx.scene.Scene;
import javafx.scene.Cursor;
import javafx.stage.Stage;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;
import javafx.scene.input.MouseEvent;
import org.jfxtras.scene.border.PipeBorder;
import javafx.animation.transition.RotateTransition;
import javafx.stage.StageStyle;
import javafx.animation.Timeline;
import javafx.animation.KeyFrame;
import javafx.animation.Interpolator;
import javafx.animation.transition.ScaleTransition;
import javafx.animation.transition.ParallelTransition;
import javafx.animation.transition.PauseTransition;
/**
 * @author Pizaini
 *
 */
//The code is here
var myScene: Scene;
var myImage: ImageView;
var imageUrl = "images/home.jpg";
var myOp =  0.0;
var myPipeBorder:PipeBorder;
var rotTrans: RotateTransition;
var myStage: Stage;
var tmLine: Timeline;
var myParTransf: ParallelTransition;
var gambarQ: Image;

//deklarasi
gambarQ = Image{
    smooth: true;
    width:240
    height:230
    url:"{__DIR__}{imageUrl}";
}

myImage = ImageView{
    image: gambarQ;
    cursor: Cursor.HAND
    preserveRatio:true
    onMouseClicked: function (me: MouseEvent): Void{
        myParTransf.playFromStart();
    }
}

myPipeBorder =  PipeBorder{
    node: myImage
    translateX: bind (myScene.width - gambarQ.width)/2
    translateY: bind (myScene.height - gambarQ.height)/2
    opacity: bind myOp
}

rotTrans = RotateTransition{
    duration: 5s;
    node: myPipeBorder;
    byAngle:360;
    repeatCount:5;
    autoReverse:true    
}

myScene = Scene{
    width: 1024
    height: 768
    fill: null
    content: [
       myPipeBorder,
    ]
}
//parallel Transform
myParTransf = ParallelTransition {
    node: myImage
    content: [
       PauseTransition {
          duration: 0.1s
       }, // wait a second
       ScaleTransition {
          duration: 1.1s
          node: myPipeBorder;
          byX: 1.01
          byY: 1.01
          repeatCount:2
          autoReverse: true
       },
    ]
}
//timeline & keyframe
tmLine = Timeline{
    keyFrames: [
    KeyFrame{
       time:1s;
       values: [
          myOp => 0.0
       ]
   },
    KeyFrame{
       time:4s;
       values: [
           myOp => 1.0 tween Interpolator.EASEOUT,
       ]
    }
    KeyFrame{
        time:5s;
        values: [
             myOp => 0.1 tween Interpolator.EASEOUT,
        ]
    }
    KeyFrame { time: 5s
       action: function() {
           myStage.close();
       }
    }
  ]
}
//play rotation
rotTrans.playFromStart();
tmLine.playFromStart();

myStage = Stage{
    title:"My Splash Screen"
    scene:myScene
    resizable:false
    visible:true;
    style: StageStyle.TRANSPARENT;
}

Download Netbeans Project Splash Screen

  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: