Imprimir

Dibujo de la red central

Con el fin de mejorar la estética y conocer el funcionamiento de los bucles for en Java podemos dibujar una especie de red en el centro de la ventana, utilizando una serie repetida de líneas cortas.

Screen Shot 2018 01 16 at 21.27.33 fb419

Líneas en JavaFX

Ya hemos visto en este tutorial cómo representar círculos y rectángulos como formas geométricas que ofrece JavaFX. Para añadir líneas puedes usar la clase Line.

Como en los otros casos, lo primero será crear un objeto de la clase Line. Para ello dispones de un método constructor en el que se indican las coordenadas X e Y de inicio y las de fin de la línea:

Screen Shot 2018 01 16 at 21.37.31 de55f

También será necesario en nuestro caso cambiar el color de la línea, para lo que se debe usar el método setStroke y también se puede especificar el ancho que deseamos para la línea usando el método setStrokeWidth. Como siempre habrá que añadir el objeto a la lista de hijos de un layout (el objeto que hemos llamado root en este ejemplo) para que aparezca en la ventana.

Por ejemplo, para dibujar la primera línea de la red:

Screen Shot 2018 01 16 at 21.42.37 af273

Que mostrará sólo el pequeño trozo de red que aparece en la parte superior:

PongFX 2 1a94d

Para dibujar el resto de las líneas que forman los trozos de la red podríamos pensar en repetir esas líneas de código para cada trozo cambiando las coordenadas de inicio y fin de cada línea. Algo como esto QUE NO VAMOS A HACER, pero que nos puede ayudar a pensar cómo lo podemos hacer mejor después:

Screen Shot 2018 01 16 at 21.54.25 9b03b

Ese código mostraría 4 trozos de la red, con 4 líneas en las que únicamente van cambiando las coordenadas Y de inicio y fin. Las coordenadas Y de inicio se han puesto cada 30 puntos (0, 30, 60, 90, ...) y las coordenadas Y de fin de cada línea están puestas como 10 puntos más allá del punto de inicio (10, 40, 70, 100, ...).

Siempre que necesites repetir una serie de sentencias (observa que las líneas anteriores se repiten casi íntegramente todas las veces), debes pensar en utilizar un bucle para simplificar y optimizar el código fuente de tu aplicación. Los bucles, que son utilizados en cualquier lenguaje de programación, permite la repetición de un bloque de sentencias una determinada cantidad de veces que depende de una condición que determinará en qué momento deben finalizar las repeticiones, o en otros casos determinará la condición que debe cumplirse para que se mantengan las repeticiones.

Bucles for en Java

Uno de los tipos de bucles más utilizados son los for, aunque también se pueden crear bucles con las sentencias while o do-while.

El formato de la sentencia for en Java es la siguiente:
    for(sentencia de inicio; condición a cumplir; sentencia repetida) {
        // Bloque de sentencias a repetir
    }

Como puedes ver en el formato de este tipo de sentencia, se deben especificar dentro de los paréntesis 3 sentencias: La primera sólo se ejecutará la primera vez que se ejecute el bucle. El bucle se repetirá mientras la segunda parte, que debe ser una expresión condicional, resulte verdadero (true), y en cada nueva repetición del bucle se ejecutará la sentencia que se indique en la tercera parte.

Una sentencia for puede ser todo lo complicado que se desee, pero lo más habitual es que se utilice de manera similar a la siguiente:

for(int i=0; i<10; i++) {
    System.out.println(i);
}

El bucle de este ejemplo se repite 10 veces, mostrando en la salida estándar los números del 0 al 9

Para que comprendas el funcionamiento de estos bucles es importante que conozcas la secuencia de ejecución, que es la siguiente:

  1. Se declara la variable i de tipo int y se le asigna el valor 0.
  2. Se comprueba si se cumple la condición i<10. Como i vale 0, la expresión 0<10 resulta true, por lo que entra dentro del bucle para ejecutar las sentencias que contenga.
  3. Se muestra el contenido de la variable i (0).
  4. Vuelve a la sentencia for y se ejecuta su tercera parte: i++. Es decir, se incrementa en 1 el contenido de la variable. Así que pone la variable i en 1.
  5. Se vuelve a comprobar la condición i<10. En este caso 1<10, que sigue siendo true, por lo que se sigue ejecutando el contenido del bucle.
  6. Se muestra el contenido de la variable i (1).
  7. Se siguen repitiendo los pasos 4 a 6 anteriores hasta el momento en que la sentencia i++ pone la variable en el valor 10. En ese momento se vuelve a comprobar la condición (10<10) que ahora resulta false, y deja de ejecutarse el contenido del bucle.

Bucle for para las líneas

Como decíamos anteriormente, para el caso actual necesitaríamos tener una variable que obtenga los valores (0, 30, 60, 90, ...) para conseguir las coordenadas Y de inicio de las líneas. Sería algo similar al ejemplo anterior, pero la variable i se debe incrementar de 30 en 30 en vez de ser de 1 en 1. Así que cambiamos la sentencia de incremento para poner: i+=30.

Además, el bucle no debe finalizar cuando i llegue al valor 10, sino cuando llegue al tamaño vertical de la ventana, es decir cuando llegue al valor de la constante SCENE_TAM_Y (400).

Así que la sentencia for debe quedar como:

Screen Shot 2018 01 16 at 22.44.28 797a7

Si lo añades ese código (fuera de la animación, dentro del método start ya que debe ejecutarse sólo al iniciar la aplicación), verás que se muestra la serie de números que buscábamos:

Screen Shot 2018 01 16 at 22.46.03 61767

Por tanto, ya podemos utilizar esa variable para crear las líneas. Tan sólo hay que añadir que la coordenada final de cada línea debe ser el valor de i+10, puesto que se busca que cada línea tenga 10 puntos de longitud.

Screen Shot 2018 01 16 at 22 6ca10 

Más información

Puedes encontrar más información sobre bucles en Java en los siguientes artículos: