Dale al Play

Ejemplo extraido de los tutoriales de javaFX.

Este ejemplo me parece interesante para ver como funcionan los eventos.

veamos el código:

package play;
/*
 * Main.fx
 *
 * Created on 24-jul-2009, 19:13:39
 */


import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.Group;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;

import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;

import javafx.animation.Timeline;



// defino los 4 estados posibles
def playNormal = Image { url: "{__DIR__}img/play_onMouseExited.png"};
def playPressed = Image { url: "{__DIR__}img/play_onMousePressed.png"};
def stopNormal = Image { url: "{__DIR__}img/stop_onMouseExited.png"};
def stopPressed = Image { url: "{__DIR__}img/stop_onMousePressed.png"};
// pongo las imagenes del modod resaltado
def playHover = Image { url: "{__DIR__}img/play_onMouseEntered.png"};
def stopHover = Image { url: "{__DIR__}img/stop_onMouseEntered.png"};


// inicializo la imagen del boton
var image = playNormal;

var button = ImageView {image: bind image}


var mode = true; //true for the Play mode,
                 //false for the Stop mode

var X: Number;  // la ubicacion
var Y: Number;  // la ubicaccion

var tooltip = Text {
   content: bind if (mode) "Play Button" else "Stop Button"
   translateX: bind button.translateX
   translateY: bind button.translateY + 80
   opacity: 0.0
   font: Font {
       size: 14
       name: "Tahoma"
   }
   fill: Color.BLACK
};

def appear = Timeline {
   keyFrames: [
   at(0s) {tooltip.opacity => 0.0},
   at(1.0s) {tooltip.opacity => 1.0}
   ]
}



Stage {
   title: "Play Button"
   scene: Scene {
       width: 300
       height: 240
       content: Group {
           content: [button,tooltip
           ]
           onMousePressed: function(event) {
               X = event.sceneX - event.node.translateX;
               Y = event.sceneY - event.node.translateY;
               image = if (mode){
                   playPressed;
               } else {
                   stopPressed;
               };
            }
            onMouseReleased: function(event) {
               if (mode){
                   image = stopNormal;
                   mode = false;
               } else {
                   image = playNormal;
                   mode = true;
               }
            }
            onMouseDragged: function(event) {
               if (event.sceneX - X <0) {
                   event.node.translateX = 0;
               } else { if (event.sceneX - X > 300 - image.width){
                   event.node.translateX = 300 - image.width;
               } else {
                   event.node.translateX = event.sceneX - X;
               }
               }
               if (event.sceneY - Y <0) {
                   event.node.translateY = 0;
               } else {if (event.sceneY - Y > 240 - image.height){
                   event.node.translateY = 240 - image.height;
               } else{
                   event.node.translateY = event.sceneY - Y;
               }
               }
            }

            onMouseEntered: function(event) {
                  image = if (mode){
                      playHover;
                  } else {
                       stopHover
                 }
                 appear.rate = 1;
                 appear.play();
                 }

            onMouseExited: function(event) {
               image = if (mode){
                   playNormal;
               } else {
                   stopNormal
               }
               appear.rate = -1;
               appear.play();
}


       }
    }
}