How to create a JavaFX Button

JavaFX Button allows to process an action when a user clicks the button. JavaFX Button can have text, an image or both and various effects can be applied to it. JavaFx Button visual appearance can be enhanced using CSS styles. Using CSS in JavaFX applications is similar to using CSS in HTML, because each case is based on the same CSS specification.

package javafxcontrols;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class JavaFxControls extends Application {
    
    @Override
    public void start(Stage primaryStage) {

        Button fxButton = new Button("FX Button");
        StackPane root = new StackPane();
        
        root.getChildren().add(fxButton);
        Scene scene = new Scene(root, 500, 500);
        primaryStage.setTitle("Creating a JavaFX Button");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

javaFX Button

JavaFX

package javafxcontrols;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class JavaFxControls extends Application {

    @Override
    public void start(Stage primaryStage) {
        Image buttonImage = new Image(getClass().getResourceAsStream("/ok.png"));
        Button fxButton = new Button("With Image", new ImageView(buttonImage));
        StackPane root = new StackPane();
        root.getChildren().add(fxButton);
        Scene scene = new Scene(root, 500, 500);
        primaryStage.setTitle("Creating a JavaFX Button");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

Applying dropshadow effect

package javafxcontrols;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.effect.DropShadow;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class JavaFxControls extends Application {
    
    @Override
    public void start(Stage primaryStage) {

        Image buttonImage = new Image(getClass().getResourceAsStream("/ok.png"));
        Button fxButton = new Button("With Image", new ImageView(buttonImage));
        
        fxButton.setOnAction((ActionEvent e) -> {
            fxButton.setText("OK");
        });
        
        DropShadow shadow = new DropShadow();
        
        fxButton.addEventHandler(MouseEvent.MOUSE_ENTERED, (MouseEvent e) -> {
            fxButton.setEffect(shadow);
        });
 
        fxButton.addEventHandler(MouseEvent.MOUSE_EXITED, (MouseEvent e) -> {
            fxButton.setEffect(null);
        });
        
        StackPane root = new StackPane();
        
        root.getChildren().add(fxButton);
        Scene scene = new Scene(root, 500, 500);
        primaryStage.setTitle("Creating a JavaFX Button");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

JavaFX

you can add css style to button using setStyle method.
fxButton.setStyle("-fx-font: 30 arial; -fx-base: #0055ff;");

Leave a Reply

Your email address will not be published. Required fields are marked *