Java 自定义控件 滑块（Slider）

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_34651026/article/details/86502835

java FX 滑块 Slider 原生的滑动后没有颜色 甚至thumb比较简单 先看下Slider的组成

本文章主要更改Track 和Thumb

public class CustomSlider  extends Application {
    @Override
    public void start(Stage stage) throws Exception {
        BorderPane mainPane = new BorderPane();
        mainPane.setPadding(new Insets(15));

        mainPane.setCenter(new ColorSlider());

        Scene scene = new Scene(mainPane, 250, 400);
        stage.setScene(scene);
        stage.show();


    }
    public class ColorSlider extends StackPane {
        public ColorSlider() {
            getStylesheets().add(this.getClass().getResource("testcss.css").toExternalForm());
            Slider slider = new Slider();
            slider.setId("color-slider");
            Rectangle progressRec = new Rectangle();
            progressRec.heightProperty().bind(slider.heightProperty().subtract(7));
            progressRec.widthProperty().bind(slider.widthProperty());

            progressRec.setFill(Color.web("#c3c3c3"));

            progressRec.setArcHeight(15);
            progressRec.setArcWidth(15);

            slider.valueProperty().addListener(new ChangeListener<Number>() {
                @Override
                public void changed(ObservableValue<? extends Number> ov, Number old_val, Number new_val) {
                    // Using linear gradient we can fill two colors to show the progress
                    // the new_val gets values between 0 - 100
                    String style = String.format("-fx-fill: linear-gradient(to right, #1979ca %d%%, #c3c3c3 %d%%);",
                            new_val.intValue(), new_val.intValue());
                    // set the Style
                    progressRec.setStyle(style);
                }
            });

            getChildren().addAll(progressRec, slider);
        }
    }
}

ColorSlider extends StackPane 然后去加载css样式，下面是我的css样式

我在推荐个网站：http://www.javafxchina.net/blog/2015/04/doc03_slider/