Cedric Martens Cedric Martens - 8 days ago 5
Java Question

My JavaFX Slider does not change value, it appears frozen

My JavaFX slider does not change value when I'm trying to move.
My slider is inside a GridPane layout.

My code looks like this, if you need more just ask :

root = new GridPane();
root.setLayoutY(canvasHeight);
root.setGridLinesVisible(true);
root.setPadding(new Insets(10, 10, 10, 10));
root.setVgap(2);

Label lblAmount = new Label("Amount of fireworks : ");
GridPane.setConstraints(lblAmount, 0, 0);
root.getChildren().add(lblAmount);

Slider sliAmount = new Slider();
sliAmount.setMin(1);
sliAmount.setMax(10);
sliAmount.setValue(5);
sliAmount.setMaxWidth(100);
root.getChildren().add(sliAmount);
GridPane.setConstraints(sliAmount, 1, 0);

Label lblPSize = new Label("Size of particles : ");
GridPane.setConstraints(lblPSize, 0, 1);
root.getChildren().add(lblPSize);

root.getRowConstraints().add(new RowConstraints(15));
root.getColumnConstraints().add(new ColumnConstraints(140));


Here's a GIF to better understand what the problem is

Here's what it looks like in my small program :

1

EDIT : More code

Since my program is very small and has pretty much only the slider implemented here is all my code.

Main class

public class Main extends Application {

private final int CANVAS_WIDTH = 1600;
private final int CANVAS_HEIGHT = 750;
private final int MENU_HEIGHT = 150;

private GraphicsContext graphics;
private GUI gui;

@Override
public void start(Stage primaryStage) throws Exception{
gui = new GUI(CANVAS_WIDTH, CANVAS_HEIGHT, MENU_HEIGHT);
gui.setup();

Canvas canvas = new Canvas(CANVAS_WIDTH, CANVAS_HEIGHT);

graphics = canvas.getGraphicsContext2D();

clearCanvas();


gui.getRoot().getChildren().add(canvas);


primaryStage.setTitle("FireworkSim by Cedric Martens");
primaryStage.setScene(new Scene(gui.getRoot(), CANVAS_WIDTH, CANVAS_HEIGHT + MENU_HEIGHT, Color.rgb(137, 182, 255)));
primaryStage.show();
}


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

private void clearCanvas()
{
//graphics.setFill(Color.BLACK);
//graphics.fillRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

}
}


GUI class

public class GUI {

private GridPane root;
private int canvasWidth;
private int canvasHeight;
private int menuHeight;

public GUI(int canvasWidth, int canvasHeight, int menuHeight)
{
this.canvasWidth = canvasWidth;
this.canvasHeight = canvasHeight;
this.menuHeight = menuHeight;
}

public void setup()
{
root = new GridPane();
root.setLayoutY(canvasHeight);
root.setGridLinesVisible(true);
root.setPadding(new Insets(10, 10, 10, 10));
root.setVgap(2);

Label lblAmount = new Label("Amount of fireworks : ");
GridPane.setConstraints(lblAmount, 0, 0);
root.getChildren().add(lblAmount);

Slider sliAmount = new Slider();
sliAmount.setMin(1);
sliAmount.setMax(10);
sliAmount.setValue(5);
sliAmount.setMaxWidth(100);
root.getChildren().add(sliAmount);
GridPane.setConstraints(sliAmount, 1, 0);

Label lblPSize = new Label("Size of particles : ");
GridPane.setConstraints(lblPSize, 0, 1);
root.getChildren().add(lblPSize);

root.getRowConstraints().add(new RowConstraints(15));
root.getColumnConstraints().add(new ColumnConstraints(140));
}

public GridPane getRoot() {
return root;
}
}

Answer

You're placing the canvas directly in the grid pane created by the GUI class, without specifying any layout properties (row and column indexes, for example). So the canvas is directly overlaying the grid pane, and receives the mouse events, preventing the slider from receiving them. Instead, use a layout pane that lays things out appropriately. For example:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.layout.BorderPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class Main extends Application {

    private final int CANVAS_WIDTH = 1600;
    private final int CANVAS_HEIGHT = 750;
    private final int MENU_HEIGHT = 150;

    private GraphicsContext graphics;
    private GUI gui;

    @Override
    public void start(Stage primaryStage) throws Exception{

        BorderPane root = new BorderPane();
        gui = new GUI(CANVAS_WIDTH, CANVAS_HEIGHT, MENU_HEIGHT);
        gui.setup();

        Canvas canvas = new Canvas(CANVAS_WIDTH, CANVAS_HEIGHT);

        graphics = canvas.getGraphicsContext2D();

        clearCanvas();


        root.setCenter(canvas);
        root.setBottom(gui.getRoot());



        primaryStage.setTitle("FireworkSim by Cedric Martens");
        primaryStage.setScene(new Scene(root, CANVAS_WIDTH, CANVAS_HEIGHT + MENU_HEIGHT, Color.rgb(137, 182, 255)));
        primaryStage.show();
    }


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

    private void clearCanvas()
    {
        graphics.setFill(Color.BLACK);
        graphics.fillRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

    }
}
Comments