Botones de JavaFX

En este capítulo te voy a mostrar como funcionan los botones de JavaFX con unos sencillos ejemplos prácticos. Crearemos la opción de asociar dos etiquetas posibles a un solo botón con dos eventos y luego, una etiqueta para cada botón.

En el capítulo anterior expliqué cómo funcionaban las etiquetas de JavaFX. También, expliqué cómo utilizar el evento onAction sobre un botón. Así que si te lo perdiste, te recomiendo que lo veas.

Botón en el archivo FXML de JavaFX

Lo primero, para añadir un botón a tu aplicación con JavaFX, es ir al archivo FXML. Después, lo definimos con la etiqueta <Button>:

<Button text="Hello!" onAction="#pulsarBoton"/>

Vamos a modificar el atributo text para que saque otro texto:

<Button text="Enviar" onAction="#pulsarBoton"/>

onAction es el evento asociado que se va a ejecutar al pulsar el botón.

Dos eventos para botones JavaFX, una etiqueta

Ahora, quiero que crees otro botón. Esta vez, vamos a asociarle otro evento.

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.VBox?>

<?import javafx.scene.control.Button?>
<VBox alignment="CENTER" spacing="20.0" xmlns:fx="http://javafx.com/fxml"
      fx:controller="com.example.proyectofx.HelloController">
    <padding>
        <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
    </padding>
    <Label fx:id="primeraEtiqueta"/>
    <Button text="Enviar" onAction="#pulsarBoton"/>
    <Button text="Haz clic aquí" onAction="#hazClic"/>
</VBox>

En el botón nuevo (línea 15), he puesto un evento inexistente llamado «hazClic», de modo, que hay que crearlo en el controlador.

public class HelloController {

    @FXML
    private Label primeraEtiqueta;

    // Eventos
    @FXML
    protected void pulsarBoton() {
        primeraEtiqueta.setText("Esta es la primera etiqueta creada con JavaFX");
    }

    @FXML
    protected void hazClic() {
        primeraEtiqueta.setText("Has hecho clic");
    }
}

Si ejecutamos, este es el resultado:

Si pulso en «Enviar», sale un texto, si pulso en «Haz clic aquí», sale otro.

En realidad, en ambos casos, tenemos la misma etiqueta, «primeraEtiqueta». Solo que en cada evento, se le asigna un valor ‘text’ diferente, el cual, reemplaza siempre al anterior.

Dos eventos para botones JavaFX, dos etiquetas

Si quieres tener una etiqueta para cada botón, tienes que crear una más.

En el archivo controlador añade esto:

@FXML
private Label segundaEtiqueta;

El evento que hemos creado («hazClic»), hay que modificarlo para asociarlo a la nueva etiqueta:

@FXML
protected void hazClic() {
	segundaEtiqueta.setText("Has hecho clic");
}

En el archivo FXML asegúrate de que el botón tiene la llamada al evento y que la etiqueta está posicionada dentro del VBOX:

<VBox alignment="CENTER" spacing="20.0" xmlns:fx="http://javafx.com/fxml"
      fx:controller="com.example.proyectofx.HelloController">
    <padding>
        <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
    </padding>
    <Label fx:id="primeraEtiqueta"/>
    <Label fx:id="segundaEtiqueta"/>
    <Button text="Enviar" onAction="#pulsarBoton"/>
    <Button text="Haz clic aquí" onAction="#hazClic"/>
</VBox>

Ahora, cada botón pondrá su propia etiqueta:

Dejamos aquí este capítulo introductorio a los botones de JavaFX.

No te pierdas nada del curso Máster en Java.