How to create JavaFX slider with two thumbs?

In general, a slider is a component that displays a continuous range of values. This contains a track on which the numerical values are displayed. Along the track, there is a thumb pointing to the numbers. You can provide the maximum, minimum and initial values of the slider.

The slider JavaFX provides contains only one thumb if you want to create a slider with two thumbs you need to rely on an external library named org.controlsfx.control.

Following is the maven dependency for this library −

<dependency>
   <groupId>org.controlsfx</groupId>
   <artifactId>controlsfx</artifactId>
   <version>11.0.1</version>
</dependency>

The RangeSlider class of this package is the JavaFXSlider but with two thumbs. Therefore to use it instantiate this class, add the required attributes, add it to the Node object.

Example

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import org.controlsfx.control.RangeSlider;
public class SliderTwoThumbs extends Application {
   public void start(Stage stage) {
      //Instantiating the RangeSlider class
      RangeSlider slider = new RangeSlider(0, 100, 10, 90);
      //Setting the slider properties
      slider.setShowTickLabels(true);
      slider.setShowTickMarks(true);
      slider.setMajorTickUnit(25);
      slider.setBlockIncrement(10);
      //VBox to arrange circle and the slider
      VBox vbox = new VBox();
      vbox.setPadding(new Insets(75));
      vbox.setSpacing(150);
      vbox.getChildren().addAll(slider);
      //Preparing the scene
      Scene scene = new Scene(vbox, 600, 200);
      stage.setTitle("Slider Example");
      stage.setScene(scene);
      stage.show();
   }
   public static void main(String args[]){
      launch(args);
   }
}

Output: