o7planning

JavaFX Slider Tutorial with Examples

  1. JavaFX Slider
  2. JavaFX Slider Example
  3. Slider ChangeListener

1. JavaFX Slider

Slider is a UI component allowing you to select a numeric value in a range of values. The slider includes a track and draggable thumb. It also includes tick marks and labels.
Block increment: The value increases or decreases when you click the left arrow or right arrow in order to move the thumb.

2. JavaFX Slider Example

SliderDemo.java
package org.o7planning.javafx.slider;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class SliderDemo extends Application {

    @Override
    public void start(Stage stage) {

        Label label = new Label("Select Brightness:");

        Slider slider = new Slider();
        
        // The minimum value.
        slider.setMin(0);
        
        // The maximum value.
        slider.setMax(100);
        
        // Current value
        slider.setValue(80);
        
        slider.setShowTickLabels(true);
        slider.setShowTickMarks(true);
        
        slider.setBlockIncrement(10);

        VBox root = new VBox();
        root.setPadding(new Insets(20));
        root.setSpacing(10);
        root.getChildren().addAll(label, slider);

        stage.setTitle("Slider (o7planning.org)");
        Scene scene = new Scene(root, 350, 200);
        stage.setScene(scene);
        stage.show();
    }

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

}

3. Slider ChangeListener

SliderChangeListenerDemo.java
package org.o7planning.javafx.slider;

import javafx.application.Application;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class SliderChangeListenerDemo extends Application {

   @Override
   public void start(Stage stage) {

      Label label = new Label("Select Brightness:");

      Label infoLabel = new Label("-");
      infoLabel.setTextFill(Color.BLUE);

      Slider slider = new Slider();

      slider.setMin(0);
      slider.setMax(100);
      slider.setValue(80);

      slider.setShowTickLabels(true);
      slider.setShowTickMarks(true);

      slider.setBlockIncrement(10);

      // Adding Listener to value property.
      slider.valueProperty().addListener(new ChangeListener<Number>() {

         @Override
         public void changed(ObservableValue<? extends Number> observable, //
               Number oldValue, Number newValue) {

            infoLabel.setText("New value: " + newValue);
         }
      });

      VBox root = new VBox();
      root.setPadding(new Insets(20));
      root.setSpacing(10);
      root.getChildren().addAll(label, slider, infoLabel);

      stage.setTitle("JavaFX Slider (o7planning.org)");
      Scene scene = new Scene(root, 350, 200);
      stage.setScene(scene);
      stage.show();
   }

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

}
Running the example:

JavaFX Tutorials

Show More