如何实现JavaFX Spinner随鼠标拖拽事件改变值？

确实，JavaFX原生Spinner的加减按钮长按速度真的够磨人的，用鼠标垂直拖拽来控制数值的体验顺畅太多了！我之前也折腾过这个需求，给你分享两种实用的实现思路，代码都是亲测能跑的~

一、给原生Spinner直接添加拖拽事件 #

最快的方式就是给现有Spinner绑定鼠标事件，记录拖拽的起始状态，然后根据鼠标移动的垂直距离来更新数值，步骤很清晰：

• 监听鼠标按下事件，记录起始的鼠标Y坐标和Spinner当前值
• 拖拽过程中计算鼠标偏移量，把偏移量转换成数值变化（还能调灵敏度）
• 鼠标释放或离开时结束拖拽状态

直接上代码：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Spinner;
import javafx.scene.input.MouseButton;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
import java.util.concurrent.atomic.AtomicBoolean;
import java.util.concurrent.atomic.AtomicDouble;
import java.util.concurrent.atomic.AtomicInteger;

public class DragSpinnerDemo extends Application {
    @Override
    public void start(Stage stage) {
        Spinner<Integer> spinner = new Spinner<>(0, 200, 100);
        spinner.setEditable(true);
        spinner.setPrefWidth(150);

        // 用原子变量存拖拽状态（lambda里要用有效final的变量）
        AtomicBoolean isDragging = new AtomicBoolean(false);
        AtomicDouble startY = new AtomicDouble();
        AtomicInteger startValue = new AtomicInteger();
        AtomicDouble lastY = new AtomicDouble(); // 用来计算拖拽速度做加速

        // 鼠标按下：初始化拖拽参数
        spinner.setOnMousePressed(e -> {
            if (e.getButton() == MouseButton.PRIMARY) {
                isDragging.set(true);
                startY.set(e.getScreenY());
                startValue.set(spinner.getValue());
                lastY.set(e.getScreenY());
                // 让编辑框暂时失焦，避免拖拽时误触输入
                spinner.getEditor().requestFocus();
            }
        });

        // 鼠标拖拽：计算偏移并更新数值，还加了加速逻辑
        spinner.setOnMouseDragged(e -> {
            if (isDragging.get()) {
                double currentY = e.getScreenY();
                double totalDeltaY = startY.get() - currentY; // 向上拖增大，向下拖减小
                double frameDeltaY = lastY.get() - currentY; // 单帧移动距离，用来算速度
                lastY.set(currentY);

                // 灵敏度和加速逻辑：拖拽越快，数值变化越快
                double speedFactor = Math.abs(frameDeltaY) > 4 ? 2.2 : 1;
                int change = (int) Math.round(totalDeltaY / 2 * speedFactor);
                int newValue = startValue.get() + change;

                // 把数值限制在Spinner的最小/最大值范围内
                newValue = Math.max(spinner.getMin(), Math.min(spinner.getMax(), newValue));
                spinner.getValueFactory().setValue(newValue);
            }
        });

        // 结束拖拽的两种情况：鼠标松开、鼠标移出Spinner
        spinner.setOnMouseReleased(e -> isDragging.set(false));
        spinner.setOnMouseExited(e -> isDragging.set(false));

        VBox root = new VBox(20, spinner);
        root.setPadding(new javafx.geometry.Insets(20));
        stage.setScene(new Scene(root, 300, 200));
        stage.setTitle("拖拽控制Spinner");
        stage.show();
    }

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

这段代码里我还加了拖拽加速的逻辑——如果鼠标移动速度快（单帧超过4像素），数值变化的速度会翻2倍多，和你说的Edge浏览器那种“距离越远/速度越快，变化越猛”的体验更接近，灵敏度也可以自己改（比如把totalDeltaY / 2里的2改成1，数值变化会更灵敏）。

二、封装成自定义DragSpinner控件 #

如果你的项目里很多地方都要用这种拖拽Spinner，不如把逻辑封装成自定义控件，以后直接用就行，不用重复写事件：

import javafx.scene.control.Spinner;
import javafx.scene.input.MouseButton;
import java.util.concurrent.atomic.AtomicBoolean;
import java.util.concurrent.atomic.AtomicDouble;

public class DragSpinner<T extends Number> extends Spinner<T> {
    private final AtomicBoolean isDragging = new AtomicBoolean(false);
    private final AtomicDouble startY = new AtomicDouble();
    private final AtomicDouble lastY = new AtomicDouble();
    private Number startValue;

    // 构造方法直接继承原生Spinner的参数
    public DragSpinner(T min, T max, T initialValue) {
        super(min, max, initialValue);
        initDragBehavior();
    }

    private void initDragBehavior() {
        setOnMousePressed(e -> {
            if (e.getButton() == MouseButton.PRIMARY) {
                isDragging.set(true);
                startY.set(e.getScreenY());
                startValue = getValue();
                lastY.set(e.getScreenY());
                getEditor().requestFocus();
            }
        });

        setOnMouseDragged(e -> {
            if (isDragging.get()) {
                double currentY = e.getScreenY();
                double totalDeltaY = startY.get() - currentY;
                double frameDeltaY = lastY.get() - currentY;
                lastY.set(currentY);

                double speedFactor = Math.abs(frameDeltaY) > 5 ? 2.5 : 1;
                double newValue = startValue.doubleValue() + (totalDeltaY / 2 * speedFactor);

                // 适配不同数值类型：Integer、Double都支持
                if (startValue instanceof Integer) {
                    int intVal = (int) Math.round(newValue);
                    intVal = Math.max(getMin().intValue(), Math.min(getMax().intValue(), intVal));
                    getValueFactory().setValue((T) Integer.valueOf(intVal));
                } else if (startValue instanceof Double) {
                    double doubleVal = newValue;
                    doubleVal = Math.max(getMin().doubleValue(), Math.min(getMax().doubleValue(), doubleVal));
                    getValueFactory().setValue((T) Double.valueOf(doubleVal));
                }
                // 要支持Long、Float的话，照着上面的逻辑加就行
            }
        });

        setOnMouseReleased(e -> isDragging.set(false));
        setOnMouseExited(e -> isDragging.set(false));
    }
}

用的时候就像用普通Spinner一样简单：

DragSpinner<Integer> customSpinner = new DragSpinner<>(0, 150, 75);
DragSpinner<Double> doubleSpinner = new DragSpinner<>(0.0, 10.0, 5.0);

最后说一句，JavaFX原生确实没有内置这种带拖拽行为的Spinner，但自己实现起来完全不复杂，上面的代码你可以直接复制过去用，也可以根据自己的需求改灵敏度、加速因子或者数值类型支持~

备注：内容来源于stack exchange，提问作者Podbrushkin