DEV Community

Cover image for Button
Paul Ngugi
Paul Ngugi

Posted on

Button

A button is a control that triggers an action event when clicked. JavaFX provides regular buttons, toggle buttons, check box buttons, and radio buttons. The common features of these buttons are defined in ButtonBase and Labeled classes as shown in Figure below.

Image description

The Labeled class defines the common properties for labels and buttons. A button is just like a label except that the button has the onAction property defined in the ButtonBase class, which sets a handler for handling a button’s action.

The code below gives a program that uses the buttons to control the movement of a text, as shown in Figure below.

package application;
import javafx.application.Application;
import javafx.stage.Stage;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.text.Text;

public class ButtonDemo extends Application {
    protected Text text = new Text(50, 50, "JavaFX Programming");

    protected BorderPane getPane() {
        HBox paneForButtons = new HBox(20);
        Button btLeft = new Button("Left", new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/lo.jpg"));
        Button btRight = new Button("Right", new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/lo.jpg"));
        paneForButtons.getChildren().addAll(btLeft, btRight);
        paneForButtons.setAlignment(Pos.CENTER);
        paneForButtons.setStyle("-fx-border-color: green");

        BorderPane pane = new BorderPane();
        pane.setBottom(paneForButtons);

        Pane paneForText = new Pane();
        paneForText.getChildren().add(text);
        pane.setCenter(paneForText);

        btLeft.setOnAction(e -> text.setX(text.getX() - 10));
        btRight.setOnAction(e -> text.setX(text.getX() + 10));

        return pane;
    }

    @Override // Override the start method in the Application class
    public void start(Stage primaryStage) {
        // Create a scene and place it in the stage
        Scene scene = new Scene(getPane(), 450, 200);
        primaryStage.setTitle("ButtonDemo"); // Set the stage title
        primaryStage.setScene(scene); // Place the scene in the stage
        primaryStage.show(); // Display the stage
    }

    public static void main(String[] args) {
        Application.launch(args);
    }
}

Enter fullscreen mode Exit fullscreen mode

Image description

The program creates two buttons btLeft and btRight with each button containing a text and an image (lines 18–19). The buttons are placed in an HBox (line 20) and the HBox is placed in the bottom of a border pane (line 25). A text is created in line 14 and is placed in the center of the border pane (line 29). The action handler for btLeft moves the text to the left (line 31). The action handler for btRight moves the text to the right (line 32).

The program purposely defines a protected getPane() method to return a pane (line 16). This method will be overridden by subclasses in the upcoming examples to add more nodes in the pane. The text is declared protected so that it can be accessed by subclasses (line 14).

Top comments (0)