Dibuja líneas en JavaFX: así es como puedes crear formas fácilmente

El dibujo de formas es un componente fundamental del desarrollo de GUI. Con JavaFX puedes crear fácilmente diversas formas que añaden más atractivo visual a tu aplicación. En este tutorial, nos enfocaremos en la forma más simple: la línea. Aprenderás cómo dibujar, ajustar y estilizar una línea en una escena de JavaFX.

Principales aprendizajes

• Uso de la clase Line para crear una línea en JavaFX.
• Ajustar el color y el grosor de la línea.
• Introducción a las líneas punteadas y diferentes estilos de línea.

Guía paso a paso

Para crear una línea en JavaFX, sigue estos pasos:

Paso 1: Crear un HBox básico

Para representar tu línea, primero debes crear un HBox. Este sirve como contenedor para todos los componentes gráficos.

Primero se instancia la caja. Puedes crear un nuevo HBox utilizando el siguiente código:

HBox box = new HBox();

Paso 2: Crear una escena

Ahora es el momento de crear una escena en la que se insertará tu HBox. Puedes establecer el tamaño de la escena, y por ende del área de dibujo, en 400x400 píxeles.

Aquí está el código para crear la escena:

Scene scene = new Scene(box, 400, 400);

Paso 3: Insertar una línea

Para dibujar una línea, utilizas la clase Line. Esta te permite especificar los puntos de inicio y fin de la línea directamente en el constructor.

Por ejemplo creas una línea que va desde el punto (0,0) hasta el punto (200,200):

Line line = new Line(0, 0, 200, 200);

Paso 4: Añadir la línea a la escena

Para hacer la línea visible, debes añadirla al HBox. Para esto, utilizas el método getChildren().addAll().

Aquí está el código correspondiente:

box.getChildren().addAll(line);

Paso 5: Entender el punto cero

Una característica importante de JavaFX es que el punto cero está en la esquina superior izquierda del área de dibujo. Aquí, los valores positivos van hacia abajo para el eje y y hacia la derecha para el eje x.

Paso 6: Colorear la línea

Para que la línea sea más visible, puedes cambiar su color con el comando setStroke().

Utiliza este código para hacerla roja:

line.setStroke(Color.RED);

Paso 7: Ajustar el grosor de la línea

También puedes ajustar el grosor de la línea. Para ello, utilizas el método setStrokeWidth().

Usa este código para aumentar el ancho a 25 píxeles:

line.setStrokeWidth(25);

Paso 8: Crear líneas punteadas

Para crear una línea punteada, necesitas el DashArray. Este método te permite establecer patrones para la línea.

Aquí hay un ejemplo de cómo crear una línea punteada:

line.getStrokeDashArray().addAll(10.0, 20.0);

Paso 9: Definir el estilo de línea

El Cap de la línea puede ser redondo o cuadrado. Para configurar el estilo a redondo, utiliza el comando setStrokeLineCap().

Aquí está el código correspondiente:

line.setStrokeLineCap(StrokeLineCap.ROUND);

Paso 10: Ejercicio interactivo

Ahora que conoces los principios del dibujo de líneas en JavaFX, puedes atreverte a realizar un pequeño ejercicio. Intenta dibujar una casa sencilla utilizando líneas para la base y el techo.

¡Pausa el video y trata de esbozar una casa!

Resumen

En este tutorial, has aprendido cómo crear, ajustar y estilizar una línea en JavaFX. Has conocido los fundamentos de la interfaz gráfica para continuar con otras formas en videos futuros.