Always reading bits...


Its the shadows and reflections cast from the future that interest me.

Who : Charles Ditzel

Email: cld9731@yahoo.com



Go get NetBeans
««Feb 2010»»
SMTWTFS
  123456
78910111213
14151617181920
21222324252627
28

Search Blog

 


Go to Swing Pointers site

Mailing List

Library Thing

Restaurant Reviews

Flickr - Latest Photos

 Use OpenOffice.org
Wikio - Top Blogs - Technology
cld
       cld.blog-city.com

JavaFX Script : Moving Images (Code + Short Video)

posted Sunday, 30 November 2008

We are only a few days from the launch (if you want to be reminded you can set an SMS reminder for December 4th) of a really interesting clientside solution - JavaFX Script. Keep your eyes open for this. For starters I think many people will be pleasantly surprised.  Octavian Tanase has already blogged about a new JavaFX Language Reference.  I have been anticipating this release for some time and the teams working on this have done an excellent job - I think Java and non-Java developers will be universally impressed with what has been accomplished (I don't doubt that there will be some nay-sayers but the new stuff blows the doors off what was previously available and does some things that competing systems don't have) - and coupled with the new tear-able applet features and better Java Web Start experience it is a great clientside combination.  I will be doing a lot of blogging about JavaFX Script - I'm looking forward to learning about the new improvements and features.

I was reading Vaibhav's Blog Space  and said, "Hey, I did this little exercise over a year ago". And I did ... in the blog, Learning JavaFX : Images and Mouse Events .  Okay, but that was then, and this is now - things have changed.  Thanks to his help - see his Blog comments - I 've now updated it. I've used his and Subrata's variable names to make it easier to go between the three examples.   Here is the latest version with the updated language changes.

> Catching Mouse Events Within An Image.  In this example, the idea is to display an image and move it about the screen using MouseDrag and click on it (MouseClick) to change the image. Here is a quick video (I created with Jing on my Mac) of it, followed by code.


               Source Code -
/*
 * ImageMoveFXStage.fx
 *
 * Created on Nov 29, 2008, 8:11:04 PM
 */

package org.myimgmove;

import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.Scene;
import javafx.stage.Stage;

Stage {
    title: "My Simple Image Move"
    width: 500
    height:500
    var keynum : Number = 0
    var imgX : Number = 20
    var imgY : Number = 20

    var startX : Number =  0
    var startY : Number = 0
    var distX : Number = 0
    var distY : Number = 0
    var switchit : Boolean = false
    var pix =  "http://files.blog-city.com/files/aa/1263/p/f/m3.jpg"
   
    scene: Scene {
        content: ImageView {
            x: bind imgX
            y: bind imgY

            image: bind Image {
                url:  pix
            }
            onMousePressed: function(e:MouseEvent): Void {
                startX = e.x;
                startY = e.y;

                distX = startX - imgX;
                distY = startY - imgY;
            }

            onMouseDragged: function(e:MouseEvent):Void {
                imgX = e.x - distX;
                imgY = e.y - distY;
            }

            onMouseClicked: function(e:MouseEvent) {
                if (switchit == false) {
                    pix = "http://files.blog-city.com//files/aa/1263/p/f/m2.jpg";
                    switchit = true;
                }
                else {
                    pix = "http://files.blog-city.com//files/aa/1263/p/f/m3.jpg";
                    switchit = false;
                }
            }
        }
    
    }
}

 

links: digg this    del.icio.us    technorati