lunes, 19 de enero de 2009

JavaFX: Bind with inverse. Ajusta tamaño de círculo a tamaño de la ventana


La instrucción BIND es una de las cosas interesantes de JavaFX Script. Esta permite declarar la DEPENDENCIA entre una variable y otros elementos del programa. Por ejemplo, si al declarar un circulo, se define que el color de este dependerá de una variable X, al cambiar el color asignado a X se produce la actualización automática del círculo en pantalla, sin necesidad de ordenar al programa que repinte.




Circle {
radius:20
fill:bind colorcirculo
}

Ahora bien, la instrucción BIND puede ir acompañada de la instrucción WITH INVERSE, por ejemplo:

var a=bind b with inverse;

Esto significa que cuando se cambie el valor de 'b' en algún lugar del programa, se asignará el nuevo valor de 'b' a 'a', pero también quiere decir que cuando se modifique el valor de 'a' también se traspasará el valor de 'a' a 'b'.

¿Qué utilidad puede tener esta instrucción? ... pues, por ejemplo, se puede usar para ajustar el tamaño de un círculo al tamaño de la ventana que lo contiene... o para conocer las medidas de la ventana y cuando se cambia su tamaño.

En el siguiente ejemplo, se usa 'bind with inverse' para asignar el tamaño inicial de la ventana (300x300 pixeles)... pero luego, cuando se ajusta manualmente el tamaño de la ventana, la misma instrucción 'bind with inverse' pasa de regreso el tamaño actualizado de la ventana a las variables 'h' y 'w' que originalmente definieron su tamaño (h=height=alto y w=width=ancho).


package experimentsize;

import javafx.stage.Stage;
import javafx.stage.StageStyle;
import javafx.scene.Scene;
import javafx.scene.text.Text;
import javafx.scene.text.Font;
import javafx.scene.shape.*;
import javafx.scene.paint.*;
import java.lang.System;

// tamaño inicial de la ventana
var w=300.0 on replace {
println("ajusto ancho de la ventana a {w}");
};
var h=300.0 on replace {
println("ajusto alto de la ventana a {h}");
};

// borde horizontal de la ventana
var bh=16.0;
// borde vertical de la ventana (incluye titulo)
var bv=36.0;

Stage {
title: "Ajusta al tamaño de ventana"
width: bind w with inverse
height: bind h with inverse
scene: Scene {
content: {
Circle {
translateX: bind (w - bh) / 2
translateY: bind (h - bv) / 2
radius:bind
if (w < h) then (w - 50) / 2 else ( h - 80) / 2
fill:Color.RED
}
}
}
}

2 comentarios:

Unknown dijo...

Muy buen ejemplo gracias amigo me ayudo mucho, estoy aprendiendo fx. gracias

Unknown dijo...

Estoy con un programa y necesito que mi objeto en este caso es un rectangulo no sobre pase los limites de la ventana alguien me podria orientar gracias