How to create circular stage in JavaFX?

by
In this tutorial, you will learn how to create a Circular Stage in JavaFX. In this tutorial, I have explained the implementation with the help of an example project. I have described each step and use of that.


A method is used to create a circular stage in this video tutorial. I am sharing the code below that will help you to understand.


// variables for initial position of the stage at the beginning of drag and drop

private double initX;
private double initY;

public void createContent() {

//create stage which has set stage style transparent

final Stage stage = new Stage(StageStyle.TRANSPARENT);

//create root node of scene, i.e. group

Group rootGroup = new Group();

            //
create scene with set width, height and color
            Scene
scene = new Scene(rootGroup, 800, 800, Color.TRANSPARENT);
            // set
scene to stage
           
stage.setScene(scene);
            //
center stage on screen
           
stage.centerOnScreen();
            // show
the stage
           
stage.show();           
            //
create dragger with the desired size
            Circle
dragger = new Circle(200,200,200);          
        
            // fill
the dragger with radial background
           
dragger.setFill(new RadialGradient(50, 135, 0.5, 0.5, 1, true,
                                              
CycleMethod.NO_CYCLE,
                                              
new Stop[] {
                new
Stop(0, Color.RED),
                new
Stop(1, Color.WHITE)
            }));
            // when the mouse button is pressed, save the initial position of the screen
           
rootGroup.setOnMousePressed((MouseEvent me) -> {
                initX = me.getScreenX() – stage.getX();
               
initY = me.getScreenY() – stage.getY();
            });
            // when the screen is dragged, translate it accordingly
           
rootGroup.setOnMouseDragged((MouseEvent me) -> {
                stage.setX(me.getScreenX() – initX);
               
stage.setY(me.getScreenY() – initY);
            });
            
            //
create a button for the closing application
            Button
close = new Button(“Close me”);
           
close.setOnAction((ActionEvent event) -> {
               
stage.close();
            });
            //
create a button for minimizing stage
            Button
min = new Button(“Minimize me”);
           
min.setOnAction((ActionEvent event) -> {
               
stage.setIconified(true);
            });
            //
CREATE SIMPLE TEXT NODE
            Text
text = new Text(“Cool IT Help”); //20, 110,
           
text.setFill(Color.GREEN);
           
text.setEffect(new Lighting());
           
text.setBoundsType(TextBoundsType.VISUAL);
           
text.setFont(Font.font(Font.getDefault().getFamily(), 40));
            // USE
A LAYOUT VBOX FOR EASIER POSITIONING OF VISUAL NODES ON SCENE
            VBox
vBox = new VBox();
            vBox.setSpacing(10);
           
vBox.setPadding(new Insets(60, 0, 0, 70));
           
vBox.setAlignment(Pos.TOP_RIGHT);
           
vBox.getChildren().addAll(text, min, close);
            // add
all nodes to the main root group
           
rootGroup.getChildren().addAll(dragger, vBox);
    }


For complete understanding please watch this video tutorial.

Leave a Comment